プログレッシブ エンハンスメントとは？Googleの推奨するサイト構築法

2014年10月末にGoogleはウェブマスター向けに技術に関するウェブマスター向けガイドラインを更新しましたというアナウンスをしました。

今回はこの公式発表内にもありました『プログレッシブ エンハンスメント』についてです。

プログレッシブ エンハンスメントとは？どんな意味？

プログレッシブ・エンハンスメントとは、言葉を分解すると次のような英語です。
■プログレッシブ・・・進歩的、進行形の、進行性の
■エンハンスメント・・・改良、強化

余計に意味がわからなくなりそうですね。

プログレッシブ・エンハンスメントとは、IE7やIE8で表示した場合も最新のChromeで表示した場合も、同様のテキストコンテンツを確認できるようにしましょう、そんな考え方です。
最新のCSS3を取り入れてビュンビュン動くサイトも良いけれど、IE8から見た時にビュンビュン動かないけど文章や指し示す画像はきちんと確認できるようにしましょうという事で、最新の進化したブラウザ向けにサイト改修を行う際に、旧ブラウザをフォローするべしとなりますね。

Googleが推奨するプログレッシブ エンハンスメントの考え方を実行するには？

重要なポイントをまとめます。

ブラウザ間における
・html
・css
・js
・フラッシュなど
で、一部ブラウザではフォローされていないマークアップを行う場合、非対応ブラウザ用の代替マークアップを用意する、又はマークアップを再構築する

css等の対応状況を確認する

参考にしたいサイトがいくつかあります。
ここでは、サイトの最適化を行う方々に知っておくべき2サイトを掲載しておきます。

ブラウザ別のHTML5 & CSS3 サポート状況一覧（英語）

http://fmbip.com/litmus/
動きのあるサイトやcssでリッチなグラデボタン、擬似クラスを用いたマークアップ時にどのブラウザへのフォローが必要かさっと確認できる便利な一覧表です。
現在ドラフト仕様であるcss3。今後のW3Cの発表にあわせ編集が継続されることを願っているページです。

ブラウザ別の対応状況を検索（英語）

http://caniuse.com/
先のサイトは一覧でしたが、こちらは検索できることがメインのサイトです。
マークアップ中に気になったらさっと検索できることがこのサイトの魅力です。

誰でも閲覧できることが最重要

以前Googleがレスポンシブデザインを推奨し、日本でもレスポンシブデザインでのサイト構築が増えていると聞きます。
今回のプログレッシブ エンハンスメントと共通して言えることは
『誰でも閲覧できること』

ブラウザやデバイスにとらわれず、同一のコンテンツを正しく見せることがSEOの基本となってきました。
あまりに当たり前といえば当たり前の事ですが、多くのサイト管理者にとってSEOがより分かりやすい存在となってきていることは良いことだと思っています。

ということで、今回はここまで。
読んでおしまいではなく、是非自社サイトをIE7等のブラウザでチェックして下さい。