小さな画面でも読みやすい
多くのウェブサイトは、モバイル機器で参照されたときと、パソコンのブラウザーで参照されたときに、その見かけを変えるように設計されている。パソコンのブラウザーで参照したときには、サイトの横幅が固定であることが多く、ウィンドウの横幅にコンテンツ表示がダイナミックに対応しない。ウィンドウの横幅を少しずつ縮めていくとわかるが、ある時点で横スクロールのためのバーが表示されるはずだ。
その一方で、スマホのようなモバイル機器で見ると、そのスクリーンの横幅にかかわらず、また、デバイスをタテにしてもヨコにしても、それなりにつじつまをあわせてサイトが表示される。もちろん、パソコンの大画面よりは、一度に参照できる情報の量は圧倒的に少ないが、流行の言葉でいえば、イマーシブでコンテンツに没入できる。
たとえば、Twitterのサイトは、パソコン用とは別にモバイル用のURLが用意されているが、パソコンのブラウザーでそのどちらを参照しても、ウィンドウ幅に応じてページのデザインや文字の折り返し位置がダイナミックに変更されるのを体験できる。Facebookも同様だ。
著名サイトでは、日経新聞や読売新聞などもいい感じにデザインされている。ウィキペディアなども同様だ。極端にウィンドウの幅を狭くしてもコンテンツを読むのに支障がないのだ。
これは参照した機器の画面サイズに応じてサイトの見かけを変える仕組みを実装しているからだ。業界の用語ではレスポンシブ・ウェブ・デザインと呼んでいる。もっと細かい分類もあるようだが、ここでは話を簡単にするためにそう呼ぶことにする。
ウィンドウの横幅を決め打ちするのはやめてほしい
こんなことを書いているのに恐縮だが、今、この記事を掲載しているサイトはパソコンでは固定レイアウトでの表示だ。
横スクロールがたいへんなのは、1行読むごとに行頭と行末を行ったり来たりしなければならないからだ。縦スクロールは、通り過ぎた行については基本的に後戻りすることは少ないので、下への一方通行ですむからあまりめんどうには思わない。読み返しも上方向に戻るだけでいい。
ただ、TwitterやFacebookのように、パソコンのブラウザで参照したときもレスポンシブ・ウェブ・デザインにしろというのでは、きっとサイト側に大きな負担となるだろう。だったらすでにあるモバイル用のサイトデザインをパソコン用にも開放してほしい。ブラウザーには開発者モードなどでモバイルブラウザーになりすます機能もあるのだが、あくまでもウェブデザイナーのための検証用機能であって、それを常用するようにはできていない。
だとすれば、業界標準でURLの最後に付加する何らかの合図を決めるなどして、その場合はパソコンのブラウザでもモバイル機器からの参照だとみなしてくれるようにしてもらえないだろうか。あるいはEdgeやChromeなどのブラウザーにモバイルモードを実装するか…。ちなみにこのサイトを今、パソコンのブラウザーで読んでいるなら、URLの最後に「?m=1」という文字列を付加して再読込してみてほしい。それでモバイル版が表示される。
それで何がうれしいかというと、複数のウィンドウを横に並べても可読性を確保できることだ。幅の狭いウィンドウでもちゃんとコンテンツが読める。それによって、複数のウィンドウを並べて表示するなどデスクトップを有効に使える。広告表示とのからみといった大人の事情もあって、なかなか難しいことだとは思うが、なんとかならないものだろうか。
いったんは、これまでの当たり前だったデザインが破綻するが、ウェブページは縦長の長細いページであっても横幅は可変であるという新しい当たり前を提案してほしい。世の中のあらゆるものがデジタルに向かう今、パソコンに潜在する可能性を発揮させるためにも、早期に解決しなければならないテーマではないだろうか。
