こんな方に読んで欲しい！
- サイトのアクセス数を増やして、広告収入を増やしたい！
- モバイルページの表示速度を今よりも早くしたい！
- AMP対応が面倒なので、簡単な
サイトのアクセス数を伸ばすには、ウェブ閲覧の大多数を占めるモバイルユーザーを取り込むことが大切です。
WordPressは、プラグインやテーマの機能でスマホやタブレットを使ったユーザーに、サイトをきれいに表示させる機能がいくつもありますが、パソコン用のページより表示速度が遅い傾向があります。
モバイルページの速度を上げる方法はいくつもありますが、その中でも「AMPを導入していない」という方は今すぐ導入すべきです。
今回は、サイトを簡単にAMPに対応させるWordPressプラグイン「Accelerated Mobile Pages」について徹底解説します！
1. AMPとは？
WordPressプラグインの解説を行う前に、「AMPとはなにか」について簡単に解説します。AMPとは、Accelerated Mobile Pagesの頭文字をとった、Googleが推進する「スマホやタブレットなどに、安全かつ高速にウェブページを表示させる技術」のことです。
ウェブページをAMPに対応させるには、AMPの規約に沿って、ウェブページのHTMLやCSSを書き換える必要があります。
ここがポイント！
AMPの規約をクリアしたウェブページがGoogleのクローラーに認識されると、AMP専用サーバーのキャッシュに登録され、ユーザーがそのページを検索した場合、キャッシュが優先的に表示されます。
1-1. AMPのメリット
AMPのメリットは下記のとおりです。
- AMPページは、一般ページに比べて約4倍の速度で表示できる
- モバイルページの表示速度があがることで、サイトからの離脱が抑制できる
- ページへのあらたな流入経路ができるので、アクセス数が上がる
- AMPページはSEO対策にもなる
1-2. AMPのデメリット
AMPのデメリットは下記のとおりです。
- 通常の方法では、Google Analyticsを使った集計ができない
- 一部のCSSが削除されるので、通常のページと雰囲気が異なる場合がある
- 一部のJavaScriptが削除される
- AMPページは、通常のプラグインが機能しない
2. 「Accelerated Mobile Pages」のメリットとデメリット
今回紹介するプラグインの名前もAMPの正式名称と同じ「Accelerated Mobile Pages」ですが、これはプラグイン名で、先ほど解説した技術の名前とは区別されます。
ここに注意！
同じ名前がまぎらわしいので、この記事では、技術のことはAMP、プラグインのことは「Accelerated Mobile Pages」と表すことにします。
2-1. 「Accelerated Mobile Pages」のメリット
「Accelerated Mobile Pages」のメリットは下記のとおりです。
- HTMLやCSSなどの専門知識がなくても大丈夫
- 簡単な初期設定を行うだけでブログがAMP化する
- パソコンからのアクセスは今まで通りできる
- AMP化したくないページを除外できる
- プラグインの更新が頻繁なので安心できる
2-2. 「Accelerated Mobile Pages」のデメリット
「Accelerated Mobile Pages」のデメリットは下記のとおりです。
- 一部のプラグインやCSSが機能せず、デザインや機能が思ったものと違う場合がある
- AMPの効果をすぐには実感できない
3. 「Accelerated Mobile Pages」の導入方法
「Accelerated Mobile Pages」はWordPress公式プラグインなので、WordPress管理画面>プラグイン>新規追加 から簡単にインストールできます。
右側のキーワード検索テキストボックスで「Accelerated Mobile Pages」と検索すると1番目にヒットしますので、「今すぐインストール」をクリックし、有効化します。
インストール済みプラグイン一覧に「Accelerated Mobile Pages」が表示されていればインストール完了です。
ブログのAMP化は「Accelerated Mobile Pages」が自動で行いますので、プラグインをインストールしたら、簡単な初期設定を行うだけで大丈夫です。
このプラグインをアンインストールしてしまうと、AMPが機能しなくなるほか、最悪の場合通常の記事を見れなくなる場合もありますので注意が必要です。
ここに注意！
サーバーによっては、キャッシュ系の設定を行うと正常に表示されないこともあるので、「Accelerated Mobile Pages」をインストールする前にブログのバックアップを取っておくことをおススメします。
4. 「Accelerated Mobile Pages」の設定方法
「Accelerated Mobile Pages」を有効化すると、設定パネルを簡易的なものである「Basic Setup」か専門的なものである「Advance Setup」のどちらかの選択選べます。あとで変更できますのでまずは気軽に「Basic」を選びます。
その後、下記画像の赤枠内のような英文で、アップデートなどや商品情報をメールで受け取るか尋ねてきますが、迷惑メールが増えるだけなので迷わず「No Thanks」を選びます。
4-1. 「Basic Setup」の設定内容
先ほど選んだ簡易的な設定画面である「Basic Setup」の設定内容は下記のとおりです。
- Website Type … ウェブサイトのタイプを選びます
- Where do you need … AMP化するページを選択をします
- Design and Present … AMP化した後のページデザインの選択をします
- Analytics … 「Google Analitycs」にAMPページを表示させる設定です
- Privacy Settings … プライバシー設定です
- Advertisement … 広告設定です
- 3rd Party Compatibility … ほかのプラグインとの互換性についてです
下記は「Basic Setup」の初期の画像です。吹き出し部分には、「まだAMP設定が完了していない」という内容が英文で表示されています。
「Basic Setup」の設定が完了すると、左上「Setup」の横のセットアップマークがオレンジ色から緑色に変わり、AMPページが使えるようになりますが、「Basic Setup」のすべての項目を入力しなくても大丈夫です。
4-2. 「Basic Setup」で設定するのは最低限2つだけ
セットアップマークがオレンジ色から緑色に変わるための設定は下記の2つがあります。あくまでAMPが稼働するために行う、最低限の設定です。
4-2-1. Where do you need （AMP化するページを選択）
AMPに指定するページ種類を下記から選択します。最低でも「投稿」と「固定ページ」は選択しておきましょう。
4-2-2. Analytics （アクセス集計ツールを登録）
「Google Analitycs」にAMPページを表示させる設定です。トラッキングIDを入力するだけで完了です。
このプラグインは、「Google Analitycs」以外のアクセス集計ツールも登録が可能です。アナリティクスタイプを選択して「Add」ボタンをクリックすると、任意の集計ツールのアクセスキーが入力できます。
5. AMPページの確認方法
「Accelerated Mobile Pages」は「Basic Setup」が終わると、投稿ページと固定ページをあっという間にAMP化します。
通常、ページを表示させるだけでは本当にAMP化されているのかわかりませんが、下記の手順でページがAMP化されているのかどうかを確認できます。
- AMPページを表示させる
- Google chromeデベロッパーツールを開く
- HTMLを見てAMP化されているか確認する
5-1. AMPページを表示させる
AMPページを表示させるには、本来のページURLの末尾にAMP用の記号「/amp/」を入力します。
別のプラグインやテーマによっては、AMP記号が下記いずれかの場合がありますので、「 /amp/」で表示されない場合はこちらも試してみてください。
- /?amp=1/
- /?amp/
5-2. Google chromeデベロッパーツールを開く
Google chromeの右上のオプションボタンをクリックして、その他ツール>デベロッパーツールを選択すると右側にウェブページの構造「デベロッパーツール」が表示されます。
5-3. HTMLでAMP化を確認
デベロッパーツールで、下記のいずれかの表示が確認できれば、ページのAMP化は成功です。
- デベロッパーツール>Console を開き「Powerd by AMP…」の表示を確認する
- デベロッパーツール>Elementsを開き「<html amp …」の表示を確認する
6. まとめ
ウェブの閲覧は、パソコンよりもスマホやタブレットを使う人のほうが多いので、アクセス数を増やそうと考えたときに、モバイルユーザーに合わせてウェブを対応させることは大切です。
ここに注意！
表示する速度が遅いと、いくら良い記事を書いてもユーザーは読んでくれず、サイトから離脱する割合が高くなります。
「Accelerated Mobile Pages」はWordPress公式プラグインなので導入が簡単です。しかも無料で使えますので、モバイルユーザーからのアクセス数を増やしたいとお考えなら、「Accelerated Mobile Pages」を使ってみてはいかがでしょうか？