ネットへのアクセスの、2020年6月の調査結果を見ると、60％程度がモバイル機器となっている。モバイル機器の内訳は、スマートフォンが約55％、タブレット端末が約5％だ。パソコンのシェアは40％程度しかない（参照：NetMarketShare）。 　しかし、4年前の2016年6月は違う。モバイル機器は約30％。そのうちスマートフォンが約25％で、タブレット端末が約5％。パソコンのシェは70％ほどあった（参照：>NetMarketShare）。この数年でパソコンのシェアは激減して、世の中はモバイル中心に移行した。この傾向は、今後戻ることはないだろう。 　こうした背景からこの5年ほど、ネットの入り口となる検索エンジンを押さえている Google は、ネットの世界をモバイル中心に組み替えるように、Web業界に圧力をかけてきた。 　同社は、2015年2月にモバイル フレンドリーを宣言した（参照：Google）。そして同年4月にモバイル フレンドリー アップデートを開始した（参照：Google）。このアップデートにより、モバイル版の検索結果では、モバイル フレンドリーなページの掲載順位が引き上げられるようになった。 　翌2016年11月、Google は、モバイル ファースト インデックスを宣言した（参照：Google）。モバイル ファースト インデックスでは、モバイル版のページのインデックスがランキングに使用され、パソコン版は切り捨てられる。そして、2018年3月、1年半の実験期間を置き、Google は、モバイル ファースト インデックスに移行した（参照：Google）。 　そして、2020年3月、Web全体のモバイル ファースト インデックス登録化を宣言した（参照：Google）。2020年9月以降、全てのウェブサイトを、モバイル ファースト インデックス登録に移行するという内容だ。具体的に言うと、モバイル版のページは、Googolebot が頻繁にクロールに来るが、パソコン版のページは来ることを保証しない。その結果、検索結果には、モバイル版のページが多く登場して、パソコン版のページは基本的に無視されるか、価値が低いものと見なされていくだろう。 　過去には多くのWebサイトが、パソコン版とモバイル版で違うページを用意していた。しかし、モバイル ファースト インデックスでは、モバイル版のページが優先され、かつパソコン版とモバイル版のWebページが同じであることが求められる（参照：Google）。 　文章中心のコンテンツでは、この変更はそれほど大きな影響を受けない。しかし、ユーザーが操作するWebアプリケーションでは問題が発生する。パソコン画面全体を使って操作していたアプリケーションを、スマートフォンの画面で操作しやすいものにしなければならないからだ。 　画面の面積が違えば、情報の一覧性も、置けるボタンの数も違う。スマートフォンに合わせればパソコンで使い難いものになる。 　このモバイル版とパソコン版の統合の要請は、開発会社にもメリットがある。2つ画面を作れば製品開発コストがかかる。テストも2倍時間がかかる。そうなると改良速度が落ちて競争力が低下する。パソコン版のユーザーが少ないならば、スマートフォンに注力して、パソコン版を切り捨てる方が得ということになる。 　モバイル ファースト インデックスを実現するために、Google はレスポンシブ ウェブ デザイン（Responsive Web Design）を推奨している（参照：Google）。このデザイン手法は、1つのWebサイトやWebページを、複数の機器や画面サイズで自動で調整して、閲覧可能にするものだ。 　この言葉は2011年頃から使用頻度が上がり、2013年の半ば頃に使用のピークを迎えた（参照：Google トレンド）。Google の要請の少し前に、Web開発者に普及していった言葉だと分かる。つまり、Google の要請がなくとも、Web開発者たちは、モバイル版とパソコン版という2つの画面の開発に悩み、その解決手法を模索していたことになる。 　レスポンシブ ウェブ デザインを体験するのは簡単だ。最近では、多くのWebサイトで取り入れられている。パソコンを使っている場合は、Webブラウザの横幅を徐々に小さくしていってみるとよい。レスポンシブ ウェブ デザインに対応したサイトでは、コンテンツの幅やサイズ、レイアウトが、画面サイズに応じて変化していく。 　こうしたデザインは、CSS3（Cascading Style Sheets, level 3）のメディアクエリ（Media Queries）という技術で実現されている。メディアクエリでは、媒体の種類や、画面サイズなどの属性と、対応したレイアウト設定をファイルに書く。「パソコンやモバイル機器の画面で、横幅が○○以下はこの設定で」「印刷時は、この設定で」といったように、細かに条件を分けてデザインを変更可能になっている。 　メディアクエリを利用すれば、表示する要素のサイズを変えたり、メニューの位置を調整したり、表示・非表示を切り換えたりすることで、それぞれの画面に合わせたデザインを実現できる。 　CSS3のメディアクエリは、2012年の7月に勧告された（参照：W3C）。ネットでの言及は2011年頃から増えて、2013年の半ばから2015年の半ばぐらいにピークを迎える（参照：Google トレンド）。2015年は、Google がモバイル フレンドリーを宣言した年だ。そして、翌2016年にモバイル ファースト インデックスを宣言した。多くの技術者に問題意識が行き渡っていた時期だったというわけだ。 　レスポンシブ ウェブ デザインは便利なものだが、万能薬というわけではない。全ての要素を読み込んで、機器や画面サイズによって切り換える方式は、ファイルサイズが膨らみやすい。また、モバイルを中心に作れば、パソコンの画面がスカスカになるなど、全ての条件で最適なデザインになるように作るのは難しい。 　現実の世界を見てみれば、各所に応じた最適な物の作り方はそれぞれ違う。モバイル機器だってそうだ。タブレット端末と時計型端末の画面や操作方法は違う。同じにすれば、どちらかが使い難くなる。 　パソコンとモバイル機器で言えば、画面サイズだけでなく、マウスと指のタッチという操作方法の違いもある。レスポンシブ ウェブ デザインは理想ではあるが、それぞれの機器や画面サイズに応じて作ったものに比べれば、劣ったものになりやすい。 　誰もが使える物は、誰かにとっての最適解ではない。理想と現実のあいだの駆け引きは、まだまだ続きそうだ。 ＜文／柳井政和＞