今さら聞けない AMP と PWA とは？【ブログで生き残るために知っておきたいこと】

ブログを始めたばかりだと記事を書くことで一所懸命だと思いますけど、WordPress でブログを始めた場合には「AMP」と「PWA」という単語に触れる機会があるはずです。

導入するかどうかは置いておいて、「AMP」と「PWA」はこれからブログを始める人にとっても影響する仕組みなので、一度はしっかりと理解しておくと良いでしょう。

ということで、「AMP」と「PWA」についてしっかりと、でも簡単に解説します。

「AMP」と「PWA」の違い

「AMP」と「PWA」は、どちらもスマホでサイト（ブログ）を表示させる時に影響が出る仕組みで、SEO の面でも効果があることから導入するサイトがここ数年で増えました。

とはいえ、絶対にした方が良いというわけではないので、導入していないサイトはまだまだたくさんあります。

表示速度を速くする「AMP」

「AMP」は Accelerated Mobile Pages の略称で、スマホでサイトを表示する時に高速化させる仕組みのことを言います。

そうすることで、ユーザビリティが向上してサイトを閲覧する人のストレスを軽減させることができるということから、「AMP」の導入を Google は推奨しています。

サイトの表示速度も評価の１つということで、SEO の面でも「AMP化」するサイトは多いです。

そもそも、どのようにして「AMP」対応のサイトかどうかを見分けるのかというと、検索結果の一覧でタイトルの前などに「 」が表示されると「AMP」を導入しているサイトとなります。

ただ、推奨している割には Google 検索をしてもマークが表示されなかったりすることもあるので、もはやわざわざ表示させる必要もなくなってきているのかもしれません。

アプリ化させる「PWA」

「PWA」は Progressive Web Apps の略称で、WEB サイトをアプリ化させるための仕組み。一般的なアプリのように、スマホ画面にアプリアイコンを追加させることができます。

この「PWA」のスゴイところは、普通はサイトを見る時にブラウザを立ち上げますよね。しかし、アプリ化するので単独で立ち上がることになります。

しかも、データさえ読み込めばオフラインでもサイトが閲覧できるようになるので、サイト表示のサクサク感がハンパないです。

「AMP」や「PWA」を導入する方法

この記事では「AMP と PWA を理解する」ということを目的としているので、詳しい導入方法は紹介しません。

ただ、どういう形で導入することできるのかを紹介します。

「AMP」を導入するには？

「AMP」を導入するには、以下の３通りあります。

最もハードルが高いのはプログラムすることですが、ちゃんと解説してくれているサイトがいくつかあるので、普段から php などを触っている人なら挑戦してみても良いと思います。

いやいやプログラミングなんて… という人は、プラグインを使ってみるのも良いと思います。

そんなことより、もっと手軽に AMP 化したいという人は、最初から AMP 対応されているテーマを使うという手もあります。設定で「AMP」にチェックを入れれば良いだけなので、無駄なプラグインを入れる必要もないです。

「PWA」を導入するには？

「PWA」を導入するには、以下の２通りあります。

プログラミングに関しては、「AMP」より導入が簡単だと思います。こちらも丁寧に解説してくれているサイトがいくつかあるので、php などにアレルギー反応が出ない人は挑戦してみると良いと思います。

プログラミンが苦手な人は、プラグインを使ってみると良いでしょう。ただ、それぞれのプラグインにはクセがあるので、自分の使いやすいものを検討してから導入することをオススメします。

「AMP」と「PWA」の導入で気をつけること

「AMP」と「PWA」を導入するのは、プラグインなどで簡単にできます。ただ、それぞれには導入時に気をつけることがいくつかあります。

そうしないと、逆に何も表示されないような事態になることもあるので、しっかりと確認をしておきましょう。

「AMP」の導入で気をつけること

プラグインで「AMP」化させる人は多いと思いますけど、導入すること自体は簡単です。インストールすれば良いだけですからね。

ただ、「画像」「広告」「プラグイン」の３つには手を加える必要が場合によってあります。

というのも、通常のスマホでの表示方法とは異なってくるので、タグなどが違ってくるんですね。そのため、これまでに「ASP」で発行したタグなどが表示されなくなったりすることもあります。

基本的には「AMP」対応している「ASP」がほとんどなので、「AMP」でも表示できるタグに切り替える必要があります。

そうなると、気になってくるのが「アドセンス」の存在。「アドセンス」はタグの切り替えは必要ないんですけど、「AMP」に切り替わると自動では非表示になってしまいます。

別個で「AMP」でも「アドセンス」が表示されるように設定が必要となるので、その部分だけを忘れずに対応してください。

また、「プラグイン」によっては「AMP」非対応のものもあります。こればかりは切り替えて初めて分かる部分なので、プラグインがうまく機能していないと思ったら別のものを検討してみましょう。

「PWA」の導入で気をつけること

「PWA」を導入する時に、必須なことが１つあります。

それは、サイトを SSL 化していること。

最近は急激に当たり前となった SSL 化なので、逆に非 SSL 化しているサイトを見る方が珍しくなりましたけど、まだ SSL 化していないサイトの場合には「PWA」を導入できないので注意してください。

そして、アプリとして起動させることになるので、通常の WEB サイトを閲覧するような形とは異なります。iPhone では戻るボタンが表示されない場合もプラグインによってあるので、ある程度の設定を追加する必要もあります。

またアプリとして機能させるので、「アイコン」も用意する必要があります。デザインできるツールなどを使って、あらかじめ用意しておきましょう。

「AMP」と「PWA」に向いているサイト

「AMP」と「PWA」、どちらもスマホでの表示を早くするとうことで、SEO 的にもユーザビリティ的にも効果があると言えるでしょう。

その中でも、特にどういったタイプのサイトに向いているかということ。

「AMP」は、閲覧数を伸ばしたいような「ブログ」には向いていると言えるでしょう。

「PWA」は、「ニュースサイト」や「ファンがいるようなサイト」が向いていますね。アーティストなどの「告知」をするようなサイトなら、「PWA」を導入しておくと良いと思います。

今現在の現状として

SEO の効果があるとして「AMP」化を進めたサイト（ブログ）が数年前には多くあったのですが、「AMP」化せずとも検索上位に上がっているサイトさんがいくつもあるので、劇的に効果があるようには感じないです。

実際に色々と自分で検索して、上位10サイトを確認してもらうと分かると思います。

ただ、明らかにブログが重すぎる場合には、「AMP」化させると順位が上がって PV も増えると思いますけどね。

2020-07-17【SEO対策】サイトのページ表示速度をテスト【ツールまとめ】

「PWA」は、個人レベルで導入している人はほとんどいないですね。よっぽど毎日読んでくれるようなファンが付いているブロガーさんレベルではないと、あまり意味がない仕組みではありますからね。

ただ、ニュースレターの購読を促したいという人には、通知機能を追加した上で「PWA」を導入するのも効果があると思います。

メールでは埋もれてしまうことも、アプリの通知ならついつい見てしまいますからね。

さいごに

「AMP」と「PWA」は、導入することでデメリットになることはないです。もちろん、「AMP」では広告などが非表示ならないようにタグの切り替えを行なった上での話ですけどね。

「PWA」はアプリとして認識してくれるので、実はアプリストアに登録することも可能なんです。そのため、アプリを作るプログラミング知識がなくても、サイト作成して「PWA」を導入すればアプリとして発表することもできちゃうんですよ。

ということで、もしかすると今後は「PWA」を導入したアプリが増えるかもしれないですね。