2020年5月29日 レスポンシブWebデザイン、生誕10周年

取締役兼CTO
木達 一仁

Webは今から31年前の1989年3月、当時CERNにお勤めだったTim Berners-Lee氏の執筆した『Information Management: A Proposal』により、その産声を上げたというのは比較的よく知られたエピソードでしょう。そこまで細かくは覚えていなくとも、Berners-Lee氏のお名前は、Webに関する業務に携わる方であればきっと、一度は目にしたことがあると思います。

いっぽう、モダンなWebデザインに共通する特徴のひとつ、レスポンシブWebデザインの由来を知る人は、多くないのではないでしょうか。そのアイデアは、発案者であるEthan Marcotte氏が2010年5月25日にオンラインマガジンのA List Apartで公開した記事『Responsive Web Design』により、世界中の知るところとなりました。

そういうわけでつい先日、レスポンシブWebデザインは生誕10周年を迎えたわけですが、Marcotte氏が当時を振り返って書かれたBlog記事『Responsive web design turns ten.』を、私は大変興味深く読みました。中でも、「レスポンシブ」という言い回しを着想するくだりが印象的です:

A light went off in my head. Responsive felt right for what I was trying to describe: layouts that would just know the best way to fit on a user’s screen. A user wouldn’t have to tap or click on anything to get the best design for their laptop or smartphone; rather, the design could fluidly adapt to the space available. It’d just respond.

(閃きました。「レスポンシブ(応答しやすい)」という言葉は、私の説明しようとしていたものに違いないと感じました。それは、ユーザーの画面に収まる最善の方法を知るレイアウトです。ユーザーは、ラップトップを使っていようとスマートフォンを使っていようと、最適なデザインを手に入れるのに何かをタップしたりクリックする必要は無いのです。むしろ、デザインは利用可能なスペースに対して流動的に適応できます。それはまさに、応答です。)

スマートフォンの急速な普及により、Webにアクセスする手段の主流がデスクトップからモバイルへと移行し始めた時代背景はもちろんですが、フレーズのキャッチーさや意味内容に対する的確さ無くして、レスポンシブWebデザインがこれほど広く「当たり前品質」として業界に定着することはなかったのでは……と思います。うまいネーミングだなぁ、などと改めて感心しました。

「当たり前品質」と書きましたが、ここで当社のレスポンシブWebデザインとの関わりを簡単に振り返りますと、2012年2月に当社Webサイトをリニューアルしています。その際、レスポンシブWebデザインの考え方を取り入れたことで、同年4月にレスポンシブWebデザインの提供を本格化、さらに翌年9月にはマルチスクリーン・デザインの標準提供を開始する流れを作ることができました。

レスポンシブWebデザインは今や、アクセシブルにコンテンツを実装するという目的においても、欠かせないアプローチとなっています。実際、Web Content Accessibility Guidelines(WCAG)2.1(ウェブアクセシビリティ基盤委員会の日本語訳)には達成基準 1.4.10 リフローが存在し、これを満たす効果的な方法として、レスポンシブWebデザインが紹介されています(達成基準 1.4.10: リフローを理解する参照)。

デザインがユーザーの閲覧環境に応答できる対象は、既に表示スクリーンのサイズだけではなくなっています。昨今話題になることの多いダークモード対応(OSのカラースキームにWebページのそれを適応させる対応)ですとか、アニメーションなどの動きの最小化ニーズに応えるためのprefers-reduced-motionの活用も、拡大解釈をすればレスポンシブWebデザインの範疇と私は考えます。

たとえ将来そう呼称されなくなる(わざわざそう呼称する必然が無くなる)日が訪れようとも、Marcotte氏の生み出したレスポンシブWebデザインのエッセンスは今後も進化しつつ受け継がれ、また広く浸透していくことでしょう。