WEB販促アーカイブ > デザイナーComaCoの東奔西走

文字だらけのWEBサイトを華やかに、わかりやすくするには?

私達が普段目にする機会の多いサインは、「一時停止」や「パーキング」などの交通標識、「男性用・女性用トイレ」「非常口」などの公共マークを代表として、ぱっと見て誰でもわかりやすい形や色で表現されています。
例えば、非常口のマークは日本で考案されたものとして有名ですが、出口から人が出て行く様を表したデザインは世代や国を問わず様々なところで使われています。
他にも、イエローにブラックが使われているマークや模様は、ご存知の通り危険あるいは注意という意味。イエロー×ブラックの組合せで視認性を高めていることから、一般には警戒色と言われているようです。
0881008comako_01.gif
コンピュータ上で使われているアイコンもそのわかりやすい一例です。
フォルダはフォルダ。
テキストファイルは文字が書かれている紙。あるいは鉛筆と紙。
ごみ箱はそのままごみ箱。などなど
ひと目でわかりやすい“アイコン”が並んでいます。これを使い出してからパソコンを様々な人が使えるようになり普及したと言っても過言ではないくらい、ステキなUIです。
0881008comako_02.gif
これらはもちろん、WEBサイトでも同様のことが言えます。
ちょっとしたアイコンをプラスするだけで、わかりやすくなり目に留まりやすくなるので様々なサイトで様々なデザインのアイコンを見ることができます。
その作り方も千差万別、立体的なものからドットのみで構成されたシンプルなもの、Web2.0風のものまで・・・サイトに合わせて制作されアイコンはそのWEBサイト全体のデザインを表現していて見るだけでデザインの勉強になります。
実際に、コンテンツタイトルに「文字」プラス「ちょっとしたアイコン」を加えるだけで、ぐっと視認性が増しわかりやすくなります。
実際に例を出して説明すると・・・。
↓アイコンを使用せず、タイトルのみでナビゲーションを作成。
0881008comako_03.gif
↓では次に、タイトル+アイコンでナビゲーションを作成。
0881008comako_04.gif
ひと手間加えるだけで、上記のようなナビゲーションに変身します。
このほかにも、携帯サイトの誘導バナーに携帯電話アイコンを加えたり、プレゼントキャンペーンのページにプレゼントマークを付けたり・・・。
ただ、そのコンテンツを表現するアイコンを選んだり作成したりするのは、WEBサイトのデザインにも合わせなければいけないため、実際は時間のかかる作業です。
さらにアイコンは表現できる“枠”が小さい分、できるだけ要素を単純化しなければならないという問題もあります。
アイコンは便利でひと手間かければ導入できる反面、使いすぎると逆にゴチャゴチャ見えてしまったり、サイトのデザインと統一性がなくなってしまったりと、もちろんデメリットもあり、使い時を考えてデザインしなければいけないと思います。
それらをふまえた上で、より使いやすい、わかりやすいWEBサイトを制作していければと考えています。