画面解像度とページレイアウト

ウェブユーザビリティ教室で最も多い質問の内の 1 つは、「どの画面サイズに合わせてデザインすればよいのか」だ。この質問に完全に答えようとすると、少し複雑になるが、基本的な考え方は簡単だ：

• 現在最も使われている画面サイズ 1024 × 768 に最適化する。もちろんこのガイドラインの基本的な考えは、ターゲットユーザたちの間で最も一般的な解像度に合わせて最適化することであるため、ときとともに具体的な解像度は変わり続ける。現在でも、例えば全従業員に大きなモニタを使わせている企業のイントラネットをデザインしている場合などは、この大きさとは異なることもある。
• ユーザごとに画面サイズは異なるため、特定の解像度に固定したデザインにしてはいけない。ウィンドウのサイズになると、さらに多様性がある。ブラウザを最大化して使うとは限らないからだ（特に大きな画面では）。
• ユーザのウィンドウの大きさに合わせて、幅を流動的に変えるリキッド・レイアウトを使う（つまり特定のサイズに固定してはいけない）。

現在全モニタの約 60 ％が解像度を 1024 × 768 ピクセルにして使われている。それと比べ、800 × 600 のものは、約 17 ％ しか使われていない。そのため、それら解像度の低いユーザたちに合わせて完璧にする必要性は比較的低いことは明確だ。しかし、高解像度用に固定したレイアウトを使用し、17 ％の顧客を単純に無視できないことも、同じくらい明確だ。

1024 × 768 への最適化

「最適化する」ということは、最も一般的な解像度で見た目も機能的にも最良の状態にするということだ。他の解像度でも正しく見え、正しく機能しなければいけない。そのためにも、リキッド・レイアウトを推奨する。だが、あくまでも 1028 × 768 に最適化しなくてはいけない。

特定の画面解像度に合わせてページレイアウトを最適化する場合に必要なことは：

• 初期画面の見え方：スクロールしなくても見える範囲に、重要な情報が全て収まっているか。これは、項目数と各項目に付随するディテールの量とのバランスだ。
• 読み易さ：縦割りのコラムの数と、各コラムに割り当てられた幅で、読みやすいかどうか。
• 見た目の美しさ：この解像度でみて、各要素が正しいサイズで、正しい位置に表示されているとき、きれいに見えているだろうか。各要素はきれいに端がそろい、写真のキャプションなどは、きちんと写真の隣に表示されているかなど。

これら必須項目を、ブラウザのウィンドウサイズを変えて、800 × 600 から 1280 × 1024 までの間の解像度で確認するべきだ。800 × 600 から 1280 × 1024 の間では、全ての項目において、よくできていなければいけない。

もっと大きい解像度や、小さい解像度でも機能するべきだが、そのような極端な環境への対応は比較的低い。解像度 640 × 480 をまだ使っているユーザは、0.5 ％にも満たない。もちろんそういったユーザたちも、サイトにアクセスできるべきだが、完璧でないデザインであっても、妥協できる。

最初の必須項目が示すとおり、スクロールには常に気をつけておかなければいけない。ユーザはスクロールするのが嫌いだ（これについては私の新刊で、様々な種類のページで、どのくらいのユーザたちがスクロールするかといった統計値を交えて、詳しく説明している）。そのため、デザインを行う場合、1 画面分、または 2 画面分しかユーザがスクロールしなかった場合、何が見えるかに気を配っておかなければいけない。

もちろんスクロールと初期画面は、どちらも画面サイズに依存する。画面が大きければ、それだけ初期画面で見えるものも多くなり、スクロールも少なくなる。ここが 1024 × 768 に最適化しなければいけないところだ。最も見せたいコンテンツを、この解像度でスクロールしなくても見えるように納めよう（そして、さらに重要な必須情報は 800 × 600 でもスクロールせずに見える場所に納めよう）。

では、携帯機器などについている、もっと小さい画面には、どう対応すればよいのだろうか。リキッド・デザインは、電話機の画面サイズまで対応できるはずだが、それがあなたの会社が提供すべき、携帯機器向けのユーザ体験と考えてはいけない。携帯機器の環境は特種だ。携帯機器に最適化するには、機能を削り、より注意深く言葉を選び、よりコンテキストを意識して、専用サービスをデザインしなければいけない。

大きい解像度

多くの人たちが、大きなモニタを使っている。現在、約 18 ％のユーザが最低でも解像度 1280 × 1024 を使っている。大きな画面を使っているユーザの割合は増加しているが、私が願っているほどの増加率ではない。

大きな画面は、ホワイト・カラー労働者たちの生産性を向上させる、最も簡単な方法だ。そして、年間 5 万ドル以上稼ぐ人は、最低でも 1600 × 1200 の画面解像度を使うべきだ。そのような解像度のフラットパネル・ディスプレイは、500 ドル以下で買える。つまり、大きな画面が生産性を最低でも 0.5 ％以上向上させ続ける限り、回収には 1 年かからないことになる。（企業のオーバーヘッドは、一般的に従業員 1 人あたりのコストの倍だ。生産性を計算するときは、従業員にかかる費用を給料の手取り金額ではなく、オーバーヘッドも含めたコストとしていくらかかるかで計算するように。）

Apple と Microsoft は、どちらも大きなモニタから得られる生産性の向上を数値化しようと試みたレポートを出している。残念ながら、様々な方法論的な間違いによって、双方とも正確な値を出しているとはいえない。経験からいうと、大きなモニタで知的労働を行った場合、生産性は 5 ～ 10 ％あがる。これは 1 日の 10 ％を、画面をみながら思考労働する人でいえば、全体的な生産性の向上は 0.5 ～ 1 ％になる。大きな画面には、それにかかる費用だけの価値があることは、間違いない。

私自身は 2044 × 1536 の画面を使っているが、それでも大して大きな画面だとは思わない。今後 10 年で 5000 × 3000 くらいの解像度が、最低でもハイエンドのビジネス使用では、ある程度一般的になるのではないかと思う。

1600 × 1200くらいから、ユーザたちはブラウザをほとんどフルスクリーンで使うことはなくなってくる。そのような大きなウィンドウを有効に活用できるウェブサイトが少ないからだ。大きなウィンドウは、表計算やグラフィックデザインなどを行う場合には、信じられないほど便利だが、現在一般的なウェブページではそうでもない。今日、大きな画面を使っているウェブのユーザたちは、余った画面スペースを、マルチウィンドウや並行閲覧に活用している。

将来的に本当に大きい画面を使っているユーザたちに合わせるためには、個々に別れたページではない、別のパラダイムが必要になってくる。例えば新聞に似たやりかたや、それともまた異なる情報の折り畳み方法が、将来的には優位になる。

どちらにせよ、新しいパラダイムの必要性は、現在のレコメンデーションになんら影響を与えない。1024 × 768 に最適化しよう。だが、その解像度だけに合わせてはいけない。800 × 600 から 1280 × 768 の間ではもちろんのこと、それ以外の解像度でも機能しなくてはいけない。

2006 年 7 月 31 日