SEO担当者なら知っておきたい《HTTP / 2》対応のメリットまとめ
ウェブサイトをより速く読み込むことができようになった場合、サーバーや開発者は、サイトの速度を上げるための努力が少ないリソースで済むようになります。そのために開発されたプロトコルがHTTP / 2です。この記事ではHTTP / 2で実現されたHTTP / 1.1からのアップデートや、SEOの順位アップにどのように影響するのかを解説します。SEO担当者や開発者はぜひともチェックしてみてください！
HTTP / 2とはなにか
HTTP / 2を理解するまえに知っておきたいのが「SPDY」プロトコルです。SPDYは2009年にGoolgeのWeb高速化プロジェクトの一貫で生み出されたものです。既存のHTTPと互換性を保ちながら、セッション層を効率化するプロトコルで、TwitterやFcebookなどの有名サイトも採用しています。
そしてSPDYに改良を加えて作られたのが、HTTP / 2です。HTTP / 2はHTTP / 1.1の仕様をそのままに内部動作を置き換えることにより実現しています。2015年5月にRFC化を果たしており、議論の様子はGithubで確認することができます。
SPDYとHTTP / 2が解決しようとした課題はプロトコルの仕様に起因するパフォーマンスの悪さでした。例えば次の2点が挙げられます。
1.非効率なリクエストの仕様
HTTPでは、1つのリクエストが完了するまで、次のリクエストが送れません。現在のWebでは1ページに対して多くのリクエストを必要とするため、この仕様は明らかに非効率です。
2.HTTPパイプラインの制限
HTTP / 1.1から、前回のリクエストのレスポンスをまたずに、次のリクエストを送ってよい仕様となりました。それがこの「HTTPパイプライン」なのですが、この仕様には、「サーバーはリクエストの順番通りにレスポンスを返さなければならない」という制限がありました。これにより、先頭のリクエストの処理に時間がかかってしまうと、後続のリクエストがブロックされてしまう課題がありました。
これらの課題を解決するために、HTTP / 2は開発されました。
《参考記事》
「HTTP/2」がついに登場！ 開発者が知っておきたい通信の仕組み・新機能・導入方法 (1/3)：CodeZine（コードジン）
ページ表示高速化を実現するHTTP / 2の6つの機能
ここからHTTP / 2の特徴を説明しています。全部で6点ありますが、すべてウェブサイトの表示を高層化するために実現されたテクノロジーです。
1.単一の接続
ウェブサイトをロードするためにサーバーへ接続しますが、そのウェブサイトがオープンしている限り、サーバーへの接続が開かれた状態で保たれます。これにより、複数のTCP接続をセットアップするために必要なやりとりの回数を減らすことができます。
2.多重化
同じ接続で、複数のリクエストを投げることを許可されています。HTTP / 1.1で、各転送が完了するために他の転送のために待たなければなりませんでしたが、その課題が解決されています。
3.サーバープッシュ機能
この機能でデータの送信を高速にできます。これまでは ページのHTMLが送信された後、ブラウザがJavsScript、画像などを要求する仕組みでしたが、サーバープッシュ機能を使うことで、ブラウザがローカルキャッシュで持っている情報を除き、ページのコンテンツ全体を同時に送ることができます。
4.優先順位付け
ウェブページの一部の要素を優先的に送信できます。どの要素の優先順位が高いかはブラウザとサーバーに依存します。ブラウザはどの要素を優先順位高くするかを伝えることができますが、最終的に決定するのはサーバー側です。
5.バイナリフォーマットの採用
HTTP / 2では、バイナリフォーマットを採用しています。これにより、サーバーとブラウザの処理が単純になるだけでなく、サイズもよりコンパクトになっています。ウェブページがコンパクトになると、送信にかかる時間も必然的に減ります。
6.ヘッダー圧縮
HTTPヘッダーにさまざまな情報を詰め込みすぎた結果、送信スピードが遅くなってしまいました。HTTP / 2では、このオーバーヘッドを解決し、ページ送信を高速化しています。
《参考記事》
ウェブを高速化する「HTTP/2」を知る - (page 2) - ZDNet apan
開発者にとっての5つのメリット
HTTP / 1.1では、開発者はページ表示速度高速化のためにさまざまな技術を駆使してきました。しかし、HTTP / 2ではそのような努力はもう必要ありません。次にあげている5つのメリットが開発者にあります。
1.ドメインシャーディング
より多くの接続を確立することができるように、複数のサブドメインからファイルをロードします。並列ファイル転送の増加は、サーバー接続のオーバーヘッドが追加されます。
2.画像の分割
要求を低減するために画像ファイルを結合します。ファイルから任意の画像を表示することができます前に、ファイルをロードする必要があり、大きな画像ファイルはRAMに結びつけます。
3.ファイルの結合
CSSとJavaScriptファイルは、多くの場合、要求の数を減らすために結合されます。これにより、追加のRAMを消費する前に、ユーザーがファイルを待つことができます。
4.インライン化
CSSとJavaScriptコード、あるいは画像は、HTMLに直接配置されています。HTMLがダウンロードが終了するまでの接続を減らすことで、追加のRAMや遅延ページ・レンダリングを防ぎます。
5.Cookieなしのドメイン
画像、CSSやJavaScriptファイルなどの静的リソースがクッキーを必要としないので、多くの開発者は、帯域幅と時間を節約するために、Cookieを使用しないドメインを使用し、送信を開始しました。HTTP / 2ではCookieを含むヘッダは圧縮され、HTTP / 1.1に比べて非常に小さいため、リクエストを減らすことができます。
HTTP / 2対応によるSEO順位アップへのメリット
GooglebotがHTTP / 2 を追加サポートすることにより、HTTP / 2をサポートするウェブサイトは、おそらくページの表示速度の観点からランキングで後押しされる可能性があります。ChromeとFirefoxで、まだHTTPSにアップグレードしていない多くのウェブサイトが、HTTP / 2対応することによりランキングの順位アップが予想されます。
ブラウザとサーバーの対応状況
HTTP / 2への対応状況は下記のとおりです。すべてHTTP / 2 over TLSのみです。
Webブラウザ
・Google Chrome
・Mozilla Firefox
・Windows 10
・Microsoft Edge
・Opera
・Safari9より
サーバー
・llS（Windows 10）
・OpenLiteSpeed
・Akamai Edge Servers
・nginx 1.9.5
・Apache 2.4.17
※この記事はSearch Engine Landに掲載された『Why Everyone Should Be Moving To HTTP/2』をもとに作成した内容です。
最後に
いかがでしたでしょうか？これから普及することが予想されるHTTP / 2ですが、事前に対応方法を把握しておくことは重要かと思います。SEOに効くだけでなく、開発側の負担も減らせる技術なので、ぜひ頭の片隅においておくことをおすすめします。
※この記事は以前投稿したものの再掲になります
人気・おすすめ記事
ページの表示高速化に関連する記事はこちらです。ぜひチェックしてみてください！
