研究者が使用するパソコンの画面の大きさを考慮しよう(font-size:42pxは控えめに)

バイオの買物.comにアクセスする人の画面の解像度を分析しました。
特に最近のパソコンの画面は横長のが多く、余裕がありますが、縦方向には余裕がありません。そのため縦方向で分類しています。

大学と企業では傾向が違うことが予想されましたので、ac.jpドメインから来るユーザとco.jpドメインから来るユーザを分けています。

Access by resolution

ここから例えば以下のことが読み取れます。

  1. 大学(ac.jp)では自由にパソコンを選択できますので、幅広い画面解像度のパソコンが選択されています。大きな画面を使っている人も多いです。特に縦1440pxや1600pxのものは、非常に専門的なものを除けば(ディスプレイ単体で30万円近く)Apple社の製品にしかありません(市販の24インチモニタも1920×1080がほとんど)。
  2. 大学のパソコンは研究室支給ではなく、個人のパソコンが多いでしょう。そのため自宅と研究室の両方で使えるようにノート型の1366×768とか1280×800のパソコンが多くなっています。最近の主流であるワイドディスプレイのノートです。
  3. 1024×768のパソコンはワイド画面が普及する前の比較的古い規格です。企業(co.jp)で縦768のものが多いのは、ネットブックの1280×768やワイドノートの1366×768によるのではなく、古いデスクトップ用15インチディスプレイもしくは古いノート型を使っているためです。catalog.castle104.comのアクセスログを見ると企業はWindows XPの使用率が82%なので、ここから見ても企業は古いPCを好んで使っているのがわかります。
  4. 企業で1024の解像度が多いのは、1280×1024のデスクトップ用17-19インチディスプレイによります。

企業ユーザはどうも大学のユーザに比べてPC環境が貧弱のようです。

さて研究者向けにウェブサイトを提供している人間としては、このようなパソコン環境でウェブページがどのように見えているかが気になります。

ちょっと極端な例ですが、シグマアルドリッチの新しいウェブサイトを見てみましょう(1024×768, Windows XP, Internet Explorer 8)。

Parallels Picture 3

製品名はデカデカととても大きい字で書いてあるのですが、なんと価格も容量もカタログ番号も見えないのです。スクロールをしない限り、基本情報が見えません。

わざとじゃないですよね???

ウェブデザイナーは大きい画面を使っている

僕も新型のiMac 27インチ(2560×1440 px)を先日購入してつくづく実感しているのですが、とても作業がしやすいです。23-24インチ(1920×1080 px)も最近では1万円ちょっとで買えますので、内勤をしているデザイナーがこれ以下のサイズの画面で作業をしていることはまず無いと思います。

そういうデザイナーはややもすると、小さい画面を使っているユーザのことを忘れてしまいます。縦方向800px以下の画面で自分のデザインがどのように見えるかを気にせずにデザインしてしまうのです。

シグマアルドリッチのウェブデザインなんて全く不必要に製品名フォントを巨大にしている訳ですから(CSS上はfont-size:42px)、誰かが気づけばすぐに修正できたはずです。でも内勤の人ばかりが確認作業をしていると、普通のノート型パソコンでどう見えるかは軽視されるか忘れられてしまうのです。

それでもこれは忘れてはいけないと思います。ウェブデザイナーもマーケットコミュニケーションの人も、画面の解像度を1024×768に落としてテストすることをくれぐれも忘れないようにしてください。

バイオの買物.comではどのように工夫しているか

バイオの買物.comでは、ネットブックでも最低限の使い勝手を保証するように工夫しています。メニューバーとロゴを含めたトップナビゲーションバーをなるべく狭くして、何か追加のナビゲーションが必要な場合はそれを画面の横におくようにしています。

もちろんページにたくさんの内容があればスクロールダウンする必要はありますが、画面に表示されるすべてのコンポーネントの少なくとも一部はネットブックでも表示されるようにして、「この画面には何があるのか」はぱっと見てわかるように心がけています。

もちろんすべてがうまくいくとは限りません。バイオの買物.comでなかなか難しいのは「まとめてカタログ」のカテゴリー表示です。カテゴリー階層が深くなったときの見やすさを考えると、どうしても横長のナビゲーション部品にせざるを得なくて、その結果画面の上部におくことにしました。苦肉の策ですが、一応高さを変えられるようにしてあります。滅多に気づいてもらえないかもしれませんが。

以下のスクリーンショットは、1024×768 px, Windows XP, Internet Explorer 8の環境で撮ったものです。

まとめてカタログの例

Parallels Picture 1

まとめて抗体検索の例

Parallels Picture 4

セミナー情報の例

Parallels Picture 2

Tags: , , ,

One Response to “研究者が使用するパソコンの画面の大きさを考慮しよう(font-size:42pxは控えめに)”

  1. 福田雅人 says:

    非常にためになりました。ありがとう。

Leave a Reply