今年の初めに、この2017のSEOニュースで、モバイルデバイス用のWebサイトの読み込み速度の最適化によるSEOのAMPとその重量について説明します。 youtubeビューを購入する
AMP yesまたはno?
AMPページのバージョンは、Webサイトのコンテンツを必要最小限に減らして、これまでよりも高速にロードできることを考慮に入れて、はい。
したがって、GoogleがAMPの使用を推奨している場合は、必ず注意を払う必要があります。 特に、SERPでの結果を改善するのに役立つからです。
WordPressブログにAMPを実装する方法
ブログをAMPと互換性を持たせるのは非常に簡単です。 追加の設定をしなくても互換性のあるプラグインをダウンロードするだけです。 インストールするだけで、プラグインが残りを自動的に処理し、何もする必要はありません。 次に、この機能を実行するXNUMXつのプラグインへのリンクを残します。
WebページにAMPを実装する方法
Webページでは、WordPressほど単純ではありません。手動プロセスであるため、より複雑でデリケートなためです。
Googleとモバイルユーザーに関連する最終ページ(製品、ニュース、ランディングなど)のそれぞれのAMPバージョンを作成する必要があります。 これは別のURLで提供され、コードに特定のHTMLタグが含まれます。
An ページのAMPバージョン 次のいずれかです。
- 画像、iframe、フォームなどの重い要素の使用を破棄または排除し、エンドユーザーにすばやく情報を送信する必要がありません。 Javascriptを使用する可能性を完全に排除 .
- HTMLコードで特定のタグを使用して、AMPバージョンとして識別します。 例:代わりに 君は 使用するだろう .
加えて、 スタイルシートには独自の制限があります AMPバージョンの場合:
- 外部スタイルシート(CSS)は使用できません。
- CSSは、単一の特定のAMP固有のタグ内にある必要があります。
- 次のようなCSSルール @インポート および ! 重要 完全に使用する 禁止さ .
AMPへのページの適合
上記を考慮して、ページを2倍にし、HTMLコードを編集してAMPに変換します。
ステップバイステップ:
- ザ・タグが存在している必要があります。
- 次に、 このようなものにタグを付けます: ご覧のとおり、アンプページであることを指摘するだけでなく、言語も示しています。
- 内部タグから始めます
- その後すぐに、次のライブラリを導入します。 .
- 重複したコンテンツのSEOの問題を回避するには、入力することが不可欠です 変換する元のページのURLを指すタグ。 これは重要です。そうしないと、より良いポジションで報酬を与える代わりに、Googleがペナルティを科します。
- デバイスの解像度に合わせてコンテンツの表示を最適化します。
- CSSスタイルを導入します タグ
- 閉じる前にページのコンテンツの視覚化に関連する特定のスタイルを含む次のコードをコピーして貼り付けることが不可欠です。
Here the CSS styles (font types and sizes, colors …
body {-webkit-animation: -amp-start 8s steps (1, end) 0s 1 normal both; -moz-animation: -amp-start 8s steps (1, end) 0s 1 normal both; -ms-animation: -amp-start 8s steps (1, end) 0s 1 normal both; animation: -amp-start 8s steps (1, end) 0s 1 normal both} @ – webkit-keyframes -amp-start {from {visibility: hidden} to {visibility: visible}} @ – moz-keyframes -amp-start {from {visibility: hidden} to {visibility: visible}} @ – ms-keyframes -amp-start {from {visibility: hidden } to {visibility: visible}} @ – o-keyframes -amp-start {from {visibility: hidden} to {visibility: visible}} @ keyframes -amp-start {from {visibility: hidden} to {visibility: visible} } body {-webkit-animation: none; -moz-animation: none; -ms-animation: none; animation: none}
これらは、AMPページの冒頭に示されている要件を常に尊重しながら、AMPで特定のページを作成するための基本的な手順です。 ただし、記事、ニュース、ブログ投稿など、ページのコンテンツを識別するschema.orgメタデータを追加することもできます。
AMPプロジェクトページにアクセスして、さらに多くのものを発見することをお勧めします。
すでにAMPを使用していますか? SERPのインデックスの変更に気づきましたか?