色彩の意味は統一しよう

2016年11月25日 公開

グラフィックデザインにおいて時々話題になるのが色覚障害者への配慮。そのごくわずかなヒトにも配慮しましょうという動きはフォトPとしても共感していますが、それ以前にやることがあるでしょ! 色彩を容易に見分けられる大多数のみなさんへの配慮!

色彩の配慮のないログイン画面

色彩を統一しよう

「色」対「意味」の組み合わせはサイト内で統一しないと混乱が生じやすいということです。くわしく見てみましょう。まずは画面上部にはこんな表示でした。

画面上部のログインボタンまわり
そして、画面下部はこんな感じ。

画面下部のログインボタンまわり

画面上部と下部で、色の意味が変わっています。とにかく無料トライアルがよく目立ち、新規獲得したい意気込みは伝わってきます。しかし、このサイトの特徴として釣った魚には餌をやらない方針らしいので、【ログイン】ボタンの色が統一されていません。

ただでさえ、ウェブフォントを使っている表示が遅いサイトなのに、文字が表示されるまでボタンの意味を推測することが難しいのです。敢えて難しくして文字表示まで待たせようという作戦ならばそれは間違いです。ログイン画面に長時間とどまるのは、玄関先で待たせるのと同じくらい悪いことです!

よく、電話番号や住所等が画像になっていてコピペできないじゃん! という困った構成のページを見かけます。制作者の意図としては、<img>タグでも alt 属性を書いておけば検索にひっかけられるからOKということですが、利用者としては他人にメール等で伝えたかったり、住所録登録したかったりするのにコピペ出来ないのはNGだったりします。

しかし、「ログイン」とかコピペの必要もなく、ずーっと表示されることなくその1画面だけの表示なんだから、数KBの画像にしておけばいいのです。表示頻度が激低でもどうしても見た目にこだわりたければせめてSVGZにでもしておけばいいのです。わざわざウェブフォントを読み込むタイムラグを利用して長時間滞在させる意味はありません。

敢えて弱点の紹介画面なのかも!

このたび紹介しましたのは、ウェブフォントを多用していますが、実際にはウェブフォントのサイトです。つまり、ウェブフォントはちょっとしたことで読み込み時間が多くかかってイライラしますからねー、という問題提起をしているのかもしれませんw ……でもね、違いますよね。顧客になるまでは親切な顔をしているのに、カネ払い始めると上から目線に豹変するのがこの企業グループの特徴ですからww

.