AMP It Up！ Drupal AMPの理由と方法（そしてそれがあなたのウェブサイトに何ができるか）

公開: 2019-08-13

オープンソースのAcceleratedMobile Pages（AMP）プロジェクトが2015年10月に開始されたとき、GoogleAMPはFacebookのインスタント記事と比較されることがよくありました。それでも、両方の技術者は、Webページの読み込みを高速化するという共通の目標を共有しています。 AMPにはWebURLでアクセスできますが、FacebookのInstant Articlesは、アプリユーザーの苦痛を和らげることのみを目的としています。 Google AMPは、パブリッシングおよびテクノロジーセクターの強力なローンチパートナーと協力して、モバイルデバイスでのコンテンツ配信の将来に影響を与えることを目的としていました。

今日まで早送りしてください。GoogleAMPはインターネットで最も人気のあるものです。 40億以上のAMPページを公開している2500万以上のウェブサイトドメインがあるため、プロジェクトが大成功を収めるのにそれほど時間はかかりませんでした。 2つの主要な機能で構成されています。オブジェクトの現金化へのスピードとサポート、AMPの影響は、企業、マーケター、eコマース、その他すべての大小の組織にまで及んでいます。優れた機能と、その起源がGoogleイニシアチブであるという事実により、AMPページがGoogleSERPでより目立つように取り上げられるのは当然のことです。

AMPとは何ですか？

モバイルユーザーの急増に伴い、ウェブサイトのようなユーザーエクスペリエンスを提供する必要性は、それを削減するだけではありません。今日のモバイルユーザーは、注目のスパンが小さく、インターネットの速度もさまざまです。企業は、Google AMPを使用して、読み込みが速く、軽量でアプリのようなウェブサイトを使用して、これらの各課題に対応できます。

AMPは、HTMLを簡素化し、CSSルールを合理化し、Javascriptの使用を制限し（代わりにAMPのコンポーネントライブラリを使用できます）、Google AMPキャッシュ（プロキシベースのコンテンツ配信ネットワーク）を介してページを配信するオープンソースフレームワークです。

なぜAMP ??

Googleのオープンソースイニシアチブは、デジタルアセットの技術アーキテクチャに影響を与え、モバイルブラウザやその他のアプリに合理化されたウェブページを提供することを目的としています。

本当に速いように速い

Google AMPは、通常の同等のモバイルページの約2倍の速度で読み込まれ、レイテンシは10分の1になります。モバイルユーザーに最速のエクスペリエンスを提供することを目的として、顧客はコンテンツにすばやくアクセスできるようになり、サービスについて購入したり問い合わせたりするためにページにとどまる可能性が高くなります。これは、時間がかからないことを知っているためです。

オーガニックブースト

Google SERPの他の検索結果よりも上位にあるAMPカルーサルの適格性により、オーガニック検索結果とトラフィックが大幅に増加し、組織の可視性が大幅に向上します。ページ権限とドメイン権限を増やす責任はありませんが、GoogleAMPははるかに多くのトラフィックを送信する上で重要な役割を果たします。

ROI

AMPがWebサイトの既存のWebインフラストラクチャを活用し、混乱させないという事実により、AMPを採用するコストは競合するテクノロジーよりもはるかに低くなります。その見返りとして、Google AMPはユーザーエクスペリエンスの向上を可能にし、モバイルデバイスでのコンバージョン率の向上につながります。

Drupal＆AMP

ユーザーエンゲージメントの向上、滞留時間の延長、コンテンツ間のナビゲーションの容易さにより、企業はAMPに適したページでより多くのトラフィックを促進し、収益を増やすことができます。 AMPモジュールは、Drupal SEOの取り組みを最適化するための優れた追加機能であるため、マーケターにとって特に便利です。

AMPは、Webをより高速な場所にするHTMLを生成します。 DrupalでのAMPモジュールの実装は本当に簡単です。ダウンロードして有効にし、構成するだけです。
AMPモジュールとDrupalの統合を開始する前に、次のことが必要です。
AMPモジュール： AMPモジュールは、主に通常のDrupalHTMLページからAMPクレームページへの変換を処理します。

AMPモジュールの2つの主要コンポーネント：

AMPモジュール： AMPモジュールは、主に通常のDrupalHTMLページからAMPクレームページへの変換を処理します。
AMPモジュールの2つの主要コンポーネント：

AMPテーマ： AMPHTMLとその標準に出くわしたと思います。コンテンツが効果的に見え、モバイルでうまく機能するようにする責任があります。 Drupal AMPテーマは、モバイルの世界でうまく機能することを目指しているWebサイトに対して、これらの標準で必要とされるマークアップを生成します。また、AMPテーマを使用すると、カスタムメイドのAMPページを作成できます。

AMP PHPライブラリ： AMPベーステーマとExAMPleサブテーマで構成される、Drupal AMPPHPライブラリが最終的な修正を処理します。ユーザーは、独自のAMPサブテーマを最初から作成したり、特定の要件に合わせてデフォルトのExAMPleサブテーマを変更したりすることもできます。

DrupalでAMPをセットアップする方法は？

AMPをDrupalと統合する前に、AMPがWebサイト全体を置き換えるわけではないことを理解する必要があります。代わりに、本質的に、AMPモジュールはコンテンツタイプの表示モードを提供します。これは、ブラウザがAMPバージョンを要求したときに表示されます。

AMPモジュールをダウンロードする

ローカルの準備ができたら、次のターミナルコマンドを入力します。

drush dl amp, amptheme, composer_manager

このコマンドは、AMPモジュール、AMPテーマ、およびComposer Managerモジュールをダウンロードします（Composer Managerがまだない場合）。

Drupal 8を使用したことがある場合は、Composerと、プロジェクトの依存関係をインストールするPHPのパッケージツールとしてのComposerの機能に精通していると思います。コンポーザーは、生のHTMLをAMPHTMLに変換するPHPライブラリをインストールするために使用されます。また、作曲家はそのライブラリをDrupalで動作させるのに役立ちます。

ただし、AMPモジュールは依存関係にComposer Managerを明示的に必要としないため、代替ワークフローでは、ComposerManagerを使用せずにモジュールComposerファイルを使用できます。

次に、開始するために必要な項目を有効にします。

drush en composer_manager, amptheme, ampsubtheme_example

AMPモジュール自体を有効にする前に、AMPサブテーマを有効にする必要があります。 AMPモジュールのデフォルト設定では、AMPテーマが「ExAMPleサブテーマ」に設定されています。

AMPモジュールを有効にする方法は？

DrupalのAMPモジュールは、Drushを使用して有効にできます。モジュールが有効になると、ComposerManagerが他のAMPライブラリとその依存関係のダウンロードを処理します。

drush en amp

構成

すべてをインストールして有効にしたら、Drupal AMPページを表示する前に、Webインターフェイスを使用してAMPを構成する必要があります。まず、AMPバージョンを設定するコンテンツタイプを決定する必要があります。あなたはそれらのすべてのためにそれを必要としないかもしれません。 [カスタムディスプレイ設定でAMPを有効にする]リンクをクリックして、特定のコンテンツタイプを有効にします。次のページで、「カスタム表示設定」フィールドセットを開きます。 [AMP]チェックボックスをオンにして、[保存]をクリックします。

AMPテーマの設定

AMPモジュールとコンテンツタイプを設定したら、AMPページのテーマを選択して設定します。 Drupal AMPモジュールのビューモジュールとフィールドフォーマッターは、ページのメインコンテンツを処理します。一方、Drupal AMPテーマは、ページのメインコンテンツ領域の外側のマークアップを変更します。

また、Drupal AMPテーマを使用すると、AMPページのカスタムスタイルを作成できます。メインのAMP設定ページで、AMPテーマの設定がExAMPleサブテーマまたは作成したカスタムAMPサブテーマに設定されていることを確認します。

Drupal-テーマ