e-bike
ウェブデザインの配色によって文字のみやすさは決まってくる。
その代表的なものが白地に黒文字という明暗コントラストの強い配色。
それ以外に文字を見やすくするのが「補色関係」の配色。
このページのように青地に黄色文字も補色に近い関係で、文字が読みやすくなる。
反面、補色関係はアクセントにはなっても、統一感に欠ける傾向があり注意が必要。
ちなみにこのページは、メニューなどにマウスを合わせると青地→赤地にロールオーバーする。これではちょっとみにくくなりNG。
前回はテンプレートを使ったページ作りを行いました。
今回はページの使いやすさ「ユーザビリティ」について考えてみましょう。
ホームページのデザインというのは自分のパソコンでやるものですが、そのデザインは見るPC環境によって大きく変わってしまうものです。
例えば・・・
・ブラウザの違い(Internet explorer,Netscape,,)
・ディスプレイの違い(色数・画面の大きさ)
など。
まずは左の項目をチェックしてみましょう。
・画面の大きさはどうか。
・特殊なフォントを使用していないか。
ちなみにこのサイトのアクセス解析結果では
ユーザーの約9割がInternetexplorer
95%以上が日本語環境
95%以上がwindows
約70%が解像度1024*768
約15%解像度1280*1024
99%がカラー数16bit以上。
・・・ということは少なくともこのサイトでは
「WindowsでInternetexplorerを使い、日本語環境で、解像度が1024*768、色数は16bit」
の人に合わせれば9割の人が正常にページを見られることになります。
これをチュートリアルサンプルページに当てはめてみると。
<Windows/IE>
ウェブデザインをする側からしてみれば、Windows/IE環境に合わせてデザインするなら、Windows/IE環境で開発するのがベストです。
もし違う環境であれば完成したページをその環境のPCで確認するなどの作業をしておけば良いでしょう。
<日本語>
このページは日本語の分かるユーザーに向けて発信しているので日本語環境はなんら問題なし。
<解像度>
1024*768なら最長でも1000ピクセル幅にしなければならない。
IEなどでネットサーフィンするときユーザーの多くは「お気に入り」などサブウィンドウをページ横に開いている。
そのため実際に表示される幅は700〜800、もしくはそれ以下と考えた方が良い。
横幅は約700ピクセルに設定しよう。
<カラー数>
16bitとはHigh colorと呼ばれる色数で、最大で65,536種類の色を表現できる。
これはサンプルページのグラデーションも十分に表現できる値で問題はない。
ちなみに8bitだと256色なのでグラデーションはキツイ。
