タグ

2016年5月16日のブックマーク (2件)

  • AMPの対応方法まとめ

    Googleが「Accelerated Mobile Pages(モバイル環境でのページ表示を高速化しよう)」という目的で始めたAMPプロジェクト。AMPに対応したウェブページを作成する方法を、初心者の私が勉強をしながらまとめていきます。 Q&A対応するとどうなるの?カルーセルに掲載されるモバイルでのGoogleの検索結果にカルーセル形式で表示されます。ただし、AMPに対応した全てのページがカルーセルで表示されるとは限りません。 AMPのマークが付くモバイルでのGoogleの検索結果に雷のマークが付きます。そして検索結果からのアクセスは全てAMPのページになります。開発者もユーザーも、通常のページかAMPのページかを選択することができません。 アクセスは増える?増えると思います。AMPに対応するとカルーセルに表示されるかもしれません。カルーセルは確かに検索結果ページの上部にありますが、その

    AMPの対応方法まとめ
  • 【WordPress】プラグイン無しでAMP(Accelerated Mobile Pages)に対応にする手順

    プラグインを有効化するとこんな感じになります。パープルのヘッダーにグレーの背景でこちらもシンプルな見た目になります。AMPは制約が多いので凝った作りにすることが難しいためです。テーマに組み込んでいた関連記事のショートコードもむき出しになってしまいました。 AMPをプラグインを使わず自分で対応したい 上記のプラグインは完全なAMP対応とは言えずまだまだβ版です。今から数年前にスマホサイト対応でWPtouch Mobile Pluginが流行ったのと同じように、プラグインを使っている人と全く同じデザインになってしまうので「とりあえず対応しました感」があって何か嫌なんですよね。 というわけで今回はWordPressでプラグインを使用せずAMPに対応させた手順をご紹介します。このページもAMPに対応しているので、URL末尾に「?amp=1」を付けてレイアウトの違いを見て下さい。 https://c

    【WordPress】プラグイン無しでAMP(Accelerated Mobile Pages)に対応にする手順