WordPress用のAMPとは何ですか?それをインストールする方法

ウェブサイトにアクセスして、そのホームページの読み込みに時間がかかる(homepage takes ages to load)ことに気付くほどイライラすることはほとんどありません。さらに悪いことに、画像の品質が低く、レイアウトが適切に最適化されていない場合があります。

実際、Googleの調査(Google study)によると、53%の人が、3秒以内に読み込まれないサイトを離れるため、バウンス率が高くなり、収益が減少します。

これらの問題に対処するために、Googleは(Google)Accelerated Mobile PagesAMP )を作成しました。AMPはサイトの読み込み時間を短縮するだけでなく、魅力的なサイトの設計(design a compelling site)、スリリングなモバイルエクスペリエンス、平均クリック率(CTR)の向上にも役立ちます。

このガイドでは、Google AMPがモバイルページでGoogleが推奨する形式である理由と、 (Google AMP)WordPress用(WordPress)AMPを実装する方法について説明します。

Google AMPとは何ですか?(What Is Google AMP?)

Google AMPは、 (Google AMP)2015年10月(October 2015)にリリースされたウェブコンポーネントフレームワークであり、軽量でユーザーファーストのウェブサイトの作成と構築を支援します。モバイルイニシアチブは、Webページの簡略化されたバージョンを提供することによってWebを高速化するように設計されています。

WordPressPinterestWashington PostRedditなどの多くの大企業がAMPを採用しており、毎月のユニークビジター数が増加してい(increase in monthly unique visitors)ます。

ウェブページがGoogleの(Google)AMPを介してモバイルユーザーに提供されると、基本的で単純に見えるため、AMPの目標である、非常に高速で動的なエクスペリエンスと使いやすさの向上を実現できます。

WordPressサイトにAMPが必要ですか?(Do You Need AMP on Your WordPress Site?)

AMPは高速ですが、Webページの読み込みを高速化したり、サイトの速度を上げ(increase your site speed)たりする唯一の方法ではありません。

出版社、企業、その他の業界に対するAMPのプラスの影響を示す多くのケーススタディがありますが、多くのケーススタディの失敗もあります。これは、 AMP(AMP)がすべてのサイトに対応しているかどうかについて明確な決定がないことを意味します。

しかし、本当のことは、AMPの成功はいくつかの決定要因に依存しているということです。たとえば、ユーザーが主にデスクトップを使用している場合、 AMPページはデスクトップに豊富な機能を備えて表示されず、AMPキャッシュ(AMP Cache)から提供されないため、ユーザーはこれらのメリットを享受できない可能性があるため、 AMPは適していません。

黄金律は、AMPは主にニュースサイトやブログを運営している出版社に推奨されるということです。ポートフォリオサイトやランディングページのような他のものは、必ずしもAMP(AMP)を必要としません。

さらに、AMP以外のページを2.5秒の標準内またはそれ以下で読み込むことができる場合は、AMPをインストールまたは維持する必要はおそらくありませ(AMP)

WordPressサイトにAMPを実装する方法(How to Implement AMP on a WordPress Site)

WordPressでウェブページのAMPバージョンを作成することは、開発者だけが処理できるタスクのように見えるかもしれませんが、少しの知識といくつかのガイダンスがあれば、自分でそれを行うことができます。

Googleには、 (Google)AMPページの作成、ページの統合と最適化、分析トラッキングの設定(set up analytics tracking)、サイトのニーズに合わせたページのデザインをガイドするワークフロープロセスがあります。

まず、Googleからテンプレートコードが提供されます。このコードをコピーして.html拡張子に保存し、必要なマークアップを追加できます。これにより、ページが実行可能なAMPHTML(AMP HTML)ドキュメントに変わります。

公開する前に、サイドバーに記載されている手順を使用して、画像を含めたり、レイアウトを変更したり、SEOに合わせてページを最適化したり(optimize the page for SEO)、プレビューしたり、ページを完成させたりすることができます。

必要に応じて、独自のWordPress(WordPress)サイトで試す前に、amp.devホームページでAMPを試すことができます。

WordPressにGoogleAMPをインストールする方法(How to Install Google AMP on WordPress)

WordPressサイトに(WordPress)GoogleAMPを手動で設定してインストールするのは複雑です。ただし、WordPress用の公式AMPプラグイン、(official AMP plugin for WordPress) WP用AMP(AMP for WP)、またはAMP WPなどのプラグインを使用して、プロセスを簡単にすることができます。

このガイドでは、公式のWordPressAMPプラグインを使用してWordPressサイトに(WordPress)AMPをセットアップしてインストールする方法を説明します。

WordPressAMPプラグインを使用してAMPをインストールする方法(How to Use the WordPress AMP Plugin to Install AMP)

  1. 開始するには、 WordPress(WordPress)サイトにWordPressAMPプラグインをインストールしてアクティブ化します。WordPressダッシュボードに移動し、[Plugins > Add New選択します。

  1. 検索ボックスに「AMP プラグイン」と入力し、 (plugin)[今すぐインストール](Install Now)を選択してプラグインをインストールします。

(Note)WordPress.comを使用している場合は(WordPress.com)、プラグインをインストールするには(install any plugins)ビジネス(Business)プランにアップグレードする必要があります。

  1. Plugins > Installed Pluginsに移動し、 AMPを見つけて[アクティブ化](Activate )リンクを選択し、 AMPプラグインをアクティブ化して、サイトで機能させるようにします。

  1. プラグインを有効にしたら、設定を調整してAMPページをカスタマイズします。プラグインを構成するには、AMP > Settingsに移動し、ウィザードを使用してAMPページの設定を構成します。

  1. 設定の調整が完了したら、[公開(Publish )]ボタンを選択します。サイトは訪問者に表示されたり、Googleで検出されたりすることはありませんが、ページ、投稿、またはその両方を(Google)AMPサイトに表示するかどうかを選択できます。これを行うには、AMP > Settings > Advanced Settings, サポートされているテンプレート(Supported Templates)]チェックボックスの選択を解除してその他のオプションを取得します。

  1. 必要なオプション(options)を選択してから、[変更を保存](Save Changes)を選択します。

  1. Plugins > Add NewYoast SEOとAMP(Yoast SEO & AMP)(Yoast SEO)検索して、 YoastSEOをAMPセットアップに統合することもできます。 
  2. [今すぐインストール]を(Install Now)選択し、プラグインをアクティブ化します。(Activate)有効になったら、SEOに移動し、[ (SEO)AMP ]を選択してページのカスタマイズオプションをさらに取得し、[変更を保存](Save Changes)を選択します。 
  3. 公開する前に、必要な投稿またはページのURLの最後に(URL)ampを追加して、 (amp)AMPサイトをプレビューします。たとえば、https://yourwebsite.com/blog-post-title/amp/にアクセスできます。

WordPressAMPを検証する方法(How to Validate WordPress AMP)

WordPressサイトにAMPがインストールされている場合、次のステップは、AMPが正しく機能することをテストすることです。それだけでなく、検証により、サポートされているプラ​​ットフォームがサイトにアクセスしてリンクできることが保証され、トラブルシューティングのための(errors for troubleshooting)AMPエラーを見つけることができます。

WordPress AMPは手動で、またはGoogleのAMPテストツール(Google’s AMP Testing tool)を使用して検証できます。

WordPressAMPを手動で検証する方法(How to Validate WordPress AMP Manually)

  1. これを行うには、AMPページを開き、検証するWebページのURLの末尾に#development=1

  1. ブラウザに移動し、開発ツールコンソール(developer tools console)を開きます。Firefoxを使用している場合は、menu > Web Developer > Web Consoleを選択します。AMPページにエラーがある場合は、赤で強調表示されます。

検証エラーは、不正なコード、無効なプレフィックス、または許可されていないタグが原因で発生する可能性がありますが、エラーの横に原因の説明が表示されます。

GoogleのAMPテストツールを使用してWordPressAMPを検証する方法(How to Validate WordPress AMP Using Google’s AMP Testing Tool)

  1. Google AMPテストツール(Google AMP Testing tool)ページを開き、サイト、投稿、またはページのURLを入力して、[(URL)テストURL](Test URL)を選択します。サイトのコードを貼り付けて、[テストURL](Test URL)を選択することもできます。

  1. Googlebotがサイトを分析し、有効な場合は、AMPページがGoogleSERP(Google SERPs)にどのように表示されるかをプレビューします。

Google AMPテスト(Google AMP Testing)ツールを使用すると、AMPエラーを特定し(AMP)サイトの問題の原因となるコードを確認できます。[共有(Share)]ボタンを選択して、分析を同僚と共有することもできます。

また、Google AMP(Google AMP Validator)検証ツールを使用してコードが検証されていることを確認するか、Chrome AMP拡張機能(Chrome AMP extension)を使用してページを検証し、警告やエラーを表示することもできます。

WordPressサイトを強化する(AMP up Your WordPress Site)

Google AMPは、特にモバイルトラフィックがすでに多い場合、どのサイトにとっても大きな変化です。ニュースコンテンツのあるサイトを運営している場合は、AMPをすぐにインストールするのが理にかなっているかもしれませんが、他のビジネスでは、間違ってしまうとコンバージョンを損なう可能性があります。

サイト全体で使用することを決定する前に、トラフィックの多いいくつかのページでAMPをテストして、肯定的な結果が得られるか否定的な結果が得られるかを確認することをお勧めします。

WordPressサイトでAMPを試しましたか?AMP for WordPressの使用について共有する他のヒントはありますか?コメントで私たちと共有してください。



About the author

私は Firefox と Google Docs の経験を持つ Web 開発者です。私はフロリダ大学で経営学の学位を取得しています。私のスキルには、Web サイト開発、コンテンツ管理システム (CMS)、データ分析、およびユーザー インターフェイス設計が含まれます。私は経験豊富なコンサルタントであり、チームが効果的な Web サイトとアプリケーションを構築するのを支援できます。



Related posts