ウェブページのデザインで気になること

先日社員が増えたので、「本業」のためのシステム開発にようやく人手がさけるようになって来た。今までは自分一人で何でもかんでもやっていたので、日銭稼ぎに追われるだけだったのだ。まぁ「日銭稼ぎ」とは言え、割は悪くない仕事だから、「会社回すだけでやっと」ということはなかったけど。

ということはさて置き、「本業」のためのシステム開発をしてもらうために、自分で「見る側のためにどうするか」ということを意識しつつあちこちのウェブページを見て回るのだが、気になっていることがある。

気になることはいくつかあるのだが、一番大きいのは

文字が小さい

ということだ。前はあまりそれを感じることはなかったのだが、ここ5年くらいの新しいデザインのページは、どうも文字が小さいような気がするのだ。

これは私の目が悪くなったからというのとは、あまり関係がない。そういったことが問題なら、眼鏡を換えるなり目をディスプレイに近付けるなりすればいいだけだ。ところが、最近のウェブページはそういった限界を超えて小さい文字のところが少なくないのだ。どんなことかと言えば、フォントレンダリングの時点で文字が潰れている。

まぁこのことも、フォントレンダラの問題だと言ってしまえばそれまでなのだが、ある程度よりも小さい文字だといくらレンダラが頑張っても潰れてしまう。グレイスケールを含んだフォントレンダリングという手もあるのだが、そういったものを駆使しても、ちゃんと読めるのは14dotくらいまでで、それよりも小さいと潰れてしまう。

もちろん潰れてもたいていの文字はなんとなく読めるものなのだが、困るのは数字だ。特に「8」と「3」とか区別つきにくくなるし、さらに「6」も同じように見えたりもする。英字だと「a」だか「o」だか区別がつかないとかもある。このページのサイドメニューで使っている文字の大きさでも、工夫がないとそうなってしまう。

もちろん、そういったものはこちら側で工夫すれば見えるわけだし、その手間が大きいわけでもないのだが、デフォルトで読み辛い文字を使ってしまうという意味がわからない。いや、たとえばネタバレをこっそり書くとか、自己つっこみを書くとかそういった「読めるか読めないかビミョーなセン」を狙った表現というのはアリだと思うのだが、本文の文字でそんなものを使うのがわからない。この雑文のサイドメニューの類くらいの文字を本文文字として使っているページが結構ある。ざーっと読めればいいだけ文章なら問題じゃないが、数値情報やコマンドラインのように「読み取るべき情報」があると辛い。

鉄道は、みんなを「まちづくり」の当事者にする点火スイッチ

このページみたいに「著者プロフィール」だと「○年に何をして」というのが結構重要な情報なので、それがデフォルト状態で読めないのが痛い。

このページのサイドメニューは、「読み取るべき情報」はないし、英数字も潰れにくい文字を使っているので実害はないと思うのだが。

また、そこまで小さくなくても、最近は少し小さ目のフォント使いというのが少なくない。これは第二の問題なのだが、

横が広過ぎ

なページが多過ぎるということだ。

この「広過ぎ」というのは絶対的なものと相対的なものとがある。まず文字の大きさの話の続きということで相対的な方について書く。この問題は「読むべき1行が長過ぎる」ということだ。

たとえば、mixiのページがリニューアルされた時、みんなが一番違和感を覚えたのは、「日記や掲示板の1行が長くなった」ことではないだろうか? またさっきの日経ビジネスのページの行の長さも、かなり限界的だ。

行間を開けておけば、多少長くなっても我慢出来るのだが、それでも日本語換算で40文字くらいが限界だ。通常は30文字程度に抑えておくものだとされている。ただ、理系の文章は英字や数式が入りことが少なくなく、あまり1行を短くするとそれらが切れ切れになったり禁則処理でせつないことになったりするので、ちょっと長めを許容することになっているのだが、それでも40文字が限界とされている。印刷物だと、その辺を目標にレイアウトデザインするから、A4だと2段組になっていたりする。

前述のように、本文字体を小さめにするのが最近の流行りのようだけど、最近の流行りのもう1つは後述するような「絶対値としての横幅広め」というのがあるものだから、これらが複合すると1行の文字数がやたらに多いページが出来上がってしまう。1行が50文字を超えてしまったら、いくら行間を広めにしても読めたもんじゃない。

また絶対値としての横幅が広いというのも、最近気になるところだ。

昔はウェブページは800×600くらいでデザインするものとされていたのだが、最近の標準はどんどん広くなっているらしい。

ブログの横幅を1000px弱(950px-990px)へリニューアルする理由

このページに最近のその辺の動向とか詳しい。これを見ると、今や800×600でブラウザを開くなんてのは少数派に属するらしい。また、世間のその辺の標準はYahoo! Japanらしい。まぁ日本の検索ポータルサイトのメジャーはYahoo!らしいので、これに合わせておくというのはそれなりに正しいだろう。

基本としてそれくらいの幅にするというのは世間の趨勢に合わせるという意味で悪いことじゃないと思う。だけど、私は普段はウェブは「何かを見ながら見る」のが普通だ。その「何か」はエディタだったり、他のウェブページだったりいろいろなんだけど、とにかく「ブラウザ1枚が見えていればいい」というわけではない。調べもので使うならそんなもんだろう。私は1920×1200という広いディスプレイを使っているけれど、それでも1000弱という幅は厳しいと思う。

もちろん無理にこっちがそのサイズに合わせてブラウザを開く必要はないのだが、そのせいで横スクロールバーを必要としたり、レイアウトが崩れたらダサいと思う。画像とかテーブルとかある時はある程度しょうがないとは思うけど。

ちなみにこのページは幅800くらいでデザインしていて、本文文字数はそれくらいでちょうどいい長さになるようにしている。でも、幅はいくらにしてもデザインが崩れるようなことはない。会社のページはもう1工夫してあって、ページを極端に広くしてもタイトル画像は間抜けなことにならないし、極端に狭くしてもメニューバーはおかしくならない。まぁこれは単純なデザインの話で、「いかにもデザイナーが作りました」的なページだとまた違うとは思うが、私は

見やすさ > 見てくれ

だと思うのだが。

ポータル系のページやダッシュボードだと、1ページに表示される情報は多い程良い。また、スマートなデザインは、格好いいだけでなく使いやすくもある。それは確かにそうなんだけど、ウェブページが特定のブラウザサイズに依存してしまうのはいかがなものか。

どうもこの文字サイズの問題と、レイアウトの問題は気になるところだ。

PS.

大きなディスプレイでこのページを見た時のレイアウトにつっこんでる人がいたけど、本文よく嫁。

このページは幅800くらいでデザインしていて、本文文字数はそれくらいでちょうどいい長さになるようにしている。でも、幅はいくらにしてもデザインが崩れるようなことはない

って書いてるだろ。想定した幅でなくてもそれなりに見えるというところが大事。確かに「40文字以内」も実現した方がいいけど、そうしたら余白ばかり増えちゃうので、それはちょっとね。

ウェブページのデザインで気になること” への2件のコメント

  1. firefoxとIEのフォントの扱いからIEで見ればOKだがfirefoxで見るとフォントのサイズが小さくなる、という事はあるそうです。
    (自分はIEで閲覧はしていない・出来ないので真偽のほどは分かりません)

    でも(極希に)IEでみてもフォントサイズは小さい気がするんだけどなぁ。

  2. 確かにそれはありそうですね。

    ただ、前に聞いた時には「デザイナはフォント小さ目にしたがる」とも聞いたんで、わざとやっているところも少なくないように思います。

コメントは受け付けていません。