公式のGoogleAMPWordPressプラグインの使用方法

公開: 2020-02-13

モバイルデバイスの場合、ブラウザよりもWebサイトの速度が遅くなるのが一般的であり、コンテンツが豊富なページほど、読み込みに時間がかかる可能性があります。 あなたがあなたのサイトをスピードアップするためにいくつかのことを試みたとしても、グーグルAMPとワードプレスAMPプラグインはあなたが探している後押しを与えるかもしれません。

ウェブサイトの読み込みに時間がかかりすぎると、バウンス率が上がる可能性があります。 一方、Webページがほぼ瞬時に表示されると、ユーザーエクスペリエンス（UX）が向上し、トラフィックが増加する可能性があります。 GoogleAMPの仕組みとウェブサイトでの使用方法は次のとおりです。

GoogleAMPの概要

Google AMPは、2015年10月に開始されたオープンソースプロジェクトです。AMPは「AcceleratedMobile Pages」の略ですが、GoogleAMPはもはやモバイルに限定されていません。 現在では、デスクトップページでも機能します。 （ただし、この記事では、AMPが最も役立つので、主にモバイルページについて説明します。）Google AMPの目的は、Webコンテンツの読み込みを高速化することです。 WordPress AMPプラグインは、ページをAMPバージョンに変換する簡単な方法です。

それが機能する方法は、AMPが限られたCSS、HTML、およびJavaScriptのおかげでWebページを高速化することです。 基本的に、これは非常に軽いWebページを作成する方法であり、読み込み時間を短縮します。 Google AMPキャッシュはコンテンツをホストし、キャッシュされたバージョンはGoogleがユーザーに送信するものであり、ユーザーはWebページをすぐに見ることができます。 Google、LinkedIn、Reddit、Twitterなどの大手テクノロジー企業はGoogle AMPをサポートしており、AMPはすべてのアプリ、ブラウザ、ウェブビューアで表示できます。

GoogleAMPの長所と短所

ほとんどのウェブサイトはGoogleAMPの恩恵を受けますが、いくつかの欠点もあります。 Google AMPの長所と短所は次のとおりです。これは、WordPressAMPプラグインが自分に適しているかどうかを判断するのに役立ちます。

長所

  • モバイル検索から多くのトラフィックを獲得した場合、AMPはUXを向上させ、ランキングを上げるのに役立ちます。
  • 遅いインターネット接続で立ち往生しているモバイルユーザーはあなたのウェブサイトに従事することができます。
  • Googleは、AMPフレームワークを使用するすべてのサイトをキャッシュします。これにより、Googleのランキングを向上させることができます。
  • ロード時間が短いほどエンゲージメントが向上し、多くの場合、収益が増加します。

短所

  • AMPは限られたCSS、HTML、JavaScriptを使用するため、ウェブサイトのデザイナーは簡素化されたページを作成する必要があります。 アニメーション、ソーシャルメディアの「いいね」ボックス、スマートオプトインフォームなどの特定の機能やウィジェットは、肥大化を減らすために使用する必要があります。
  • GoogleAMPはGoogleAnalyticsをサポートしていますが、それを除けば、他のほとんどの分析プラットフォームをサポートしていません。
  • また、GoogleAMPがサポートする広告オプションは多くありません。 ただし、プラグインを追加すると、広告オプションを追加できます。これについては後で詳しく説明します。
  • これはソフトコンですが、モバイルページがすでに軽量で最適化されている場合、AMPを使用しても目立って速くならない可能性があるため、設定に時間がかかる可能性があります。

WordPressAMPプラグイン

モバイルの最適化

WordPress用のGoogleAMPプラグインは、すべての投稿のAMPバージョンを自動作成します。 次に、検索エンジンとAMPでサポートされているアプリとサービスは、ソースコードの「amphtml」のおかげで、ページのAMPバージョンを探す場所を認識します。 プラグインは、クラシックビルダーまたはグーテンベルクのどちらを使用していても、WordPressとシームレスに連携します。

プラグインは個別のモバイルテーマを作成せず、モバイルデバイスをAMPバージョンのWebサイトに誘導しません。 ただし、モバイル訪問者がGoogle、Pinterest、Twitterなどのプラットフォームでコンテンツを見つけた場合は、AMPバージョンが表示されます。

ページのAMPバージョンをレンダリングできない場合、プラグインは非AMPバージョンが読み込まれるようにします。 つまり、可能な限り多くのサイトがAMPに最適化され、サイトのそれができない部分については、必要に応じて表示および実行されます。

WordPressAMPプラグインの機能

  • 互換性と検証： AMPへの自動変換が不可能な場合は、詳細な検証エラーが発生するため、無効なマークアップを見つけることができます。 マークアップを削除するか保持するかを選択できます。
  • コアテーマのサポート： AMPはすべてのコアWordPressテーマと互換性があります。 （コア以外の多くのテーマとも互換性があります。）
  • CSSツリーシェイク：未使用のCSSを自動削除して、合計をAMP50KBの制限内に収めます。
  • AMPストーリー： AMPには、訪問者向けのフルスクリーン広告とエクスペリエンスを作成できるストーリービルダーがあります。
ワードプレスアンププラグイン

出典：AMP

WordPressAMPプラグインを設定して使用する方法

1.プラグインをインストールしてアクティブ化します。 ここからプラグインを入手してください。

2. [外観]に移動して、[AMP]を選択します。 モバイルデバイスを使用したときにWebサイトがどのように表示されるかを確認できます。また、AMPデスクトップバージョンを表示することもできます。 ホームページでAMPを使用できない場合は、次の通知が表示されます。

モバイルの最適化

WebページがAMPに変換される場合、それは基本的に元のページを取り除いたバージョンです。 以下では、私のブログ投稿の元のバージョンをAMPバージョンと比較できます。ロゴ（定型化されたフォントでの私の名前）、色、およびフォントが異なります。

ワードプレスアンププラグイン

3. [デザイン]をクリックして、ヘッダーテキストの色、ヘッダーの背景とリンクの色、および配色（明るい色または暗い色）を更新します。 リンクを表示して、訪問者がリーダーモードを終了できるようにすることもできます。

ワードプレスアンプ

4. Webサイト上の任意の投稿のURLに移動し、その末尾に/ amp /を追加して、投稿のAMPバージョンを表示できます。 AMPバージョンを表示しようとしたときに404エラーが発生した場合は、[設定]、[パーマリンク]の順に移動し、左下の[変更を保存]をクリックします。 実際に変更を加える必要はありませんが、[保存]ボタンをクリックすると、パーマリンク構造が更新され、それらのAMPページが表示されるようになります。

ウェブサイトモードを選択する

WordPress AMPプラグインには、3つのWebサイトモードから選択できます。これらのモードにアクセスするには、左側のサイドバーのAMPに移動し、[全般]をクリックします。

  1. 標準： AMPはWebサイトのフレームワークです。 AMP以外のバージョンとAMPバージョンを別々に用意する必要はありません。
  2. 移行各ページには、正規URLとAMPURLがあります。
  3. 読者：各ページには、正規URLとAMPURLがあります。 リーダーモードでは、AMPは単一の投稿、ページ、その他の投稿タイプでのみ使用されます。 他の2つのWebサイトモードは、Webサイト全体で使用されます。

デフォルトでは、リーダーモードが選択されます。 他の2つのオプションのいずれかに変更すると、外観からその「デザイン」セクションにアクセスできなくなります。

選択したWebサイトモードは、追加のオプションに影響します。 標準または移行を選択した場合、以下のスクリーンショットにオプションがあります。 リーダーを選択した場合、3つのコンテンツタイプからのみ選択できます。

ワードプレスアンププラグイン

追加のプラグインでAMPをカスタマイズする

WordPress AMPプラグインには多くのカスタマイズオプションがないため、他のプラグインを使用してページをさらにパーソナライズできます。 たとえば、AMP WPはソーシャルアイコンをサポートし、（他の多くの機能の中で）カスタマイズ可能な配色を備えています。AdsforWPは、AMPの高度な広告サポートを備えています。

また、現在Yoast SEOを使用している場合は、Glue for Yoast SEOとAMPプラグインを使用して、AMPページに適切なYoastSEOメタデータを含めることができます。 プラグインをインストールしてアクティブ化した後、通常どおりYoastSEOオプションを設定します。 プラグインはバックグラウンドでその魔法を働かせます。

追加のAMP関連プラグインを設定したら、必ずAMPページを再検証してください。 これにより、以前は存在しなかった新しい検証エラーがないかチェックされます。

最終的な考え

Accelerated Mobile Pagesの設定は、ウェブページの読み込みを高速化するために使用できる多くの手法の1つにすぎません。 WordPressプラグインのおかげで、AMPがどのように機能するかを理解する必要がなく、ウェブサイトに有益であることがわかります。 そして、そのような単純な、すべてがあなたのために行われるセットアッププロセスで、あなたはそれを午後にインストールして、あなたのアーカイブ全体を数日以内に変換させることができます。

もう1つ、Google検索コンソールを使用している場合、AMPページの結果がすぐに表示されなくても心配する必要はありません。 Googleは、AMPのインデックスを作成してデータを表示するときに時間がかかる場合があります。

あなたのモバイルサイトからさらに多くの牽引力を得たいですか？ Divi ThemeBuilderを使用してモバイルでサイドバーを最適化する方法に関するガイドをご覧ください。

Fouaddesigns /shutterstock.com経由の注目の画像