Twitter Bootstrapは素晴らしいんだけれど、何か腑に落ちない。 まずメニューバーがStickyで視野を制限してくるし、ボタンだらけになるし。 無個性のようでいて、結構主張が強いのはどうしたことか。

「使っている事を感じさせない」デザインがいいとはよく言われる通り。 ここでは、透明なWebデザインはどうであるべきか問い直す。

グラフィックが、自分自身を説明していること

シンプルなページを作ろうとするとき、 テキストＵＩ＋テキスト＋DIVによるブロックのみとすることがある。

テキストだけで情報表現を行うのは、確かに「シンプル」ではあるけれども、 「ここには何が書いてあるのか」といった点を一目で把握できる訳ではない。 まずは図表の採用を検討すべきである。

一番目に入りやすい場所でデータのビジュアライゼーションを行う。 「このページは何についてのページか？」「データの大まかな傾向」を 目視で確認することが出来るようにデザインする。

テキストＵＩに対して、デザインされていない印象を持つのは、 そのページが視覚面での自己紹介を怠っているためである。

視野を妨げる・見たいものに被さるデザインを採用しない

ボタンが沢山ある、メニューバーがある、といったデザインは コンテンツへの集中を妨げてしまう。 中立かつ透明なUI部品を使うことで、没入感のあるサイトにすることが出来る。

しかし飾りっ気のない、透過されたUI部品を使っていても没入感が妨げられることがある。 例として、ZeroWatchのコメント欄（透明度が高く普段は隠れているが、マウスオーバーで表示される）や、 Google Plusのフレーム（サイドバー、検索窓などを含む。視野を制限されている感じが強い）がある。

Stickyなメニューバーや、スクロールインしてくる UI部品などは、そこに目が行ってしまう上に、目が行ったところの情報を隠してしまう。 普段は隠して置いて、状況に応じてコントロールを出すのは、一見合理的に見えるけれど、 動きのある場所に目が行ってしまうものなので、実際は邪魔になることが多い。

なので、まずは視野を制限するようなコントロールをそもそも画面上に置いてはいけないし、 マウスオーバーで重なってもいけない。

シンプルさを追求しすぎるより、アイコンの記号性を活用する

ここでいうミニマルデザインとは、Metroや、一部のFlashサイトで使われているような、 丸とか四角でデザインされたＵＩを指す。

個人的には、単なる小さなアイコンよりも、丸とか四角の方が目立ってしまうように感じる。 ちょっとしたイラストは、「図」よりも「地」になりやすいのかもしれない。

また、素人目にも、アイコンを使った方が「デザイン」されている印象を持ちやすい。 アイコンの機能性や色の識別性、雰囲気の整合性を積極的に使っていく。

UIは、一旦決めた場所から動かさない

記憶というのは場所に紐付いているもので、 状況が変わる度にコントロールが動かれては使いづらい。

jQuery等でSlideDownが簡単に使えるようになったが、 安易に使わず、できる限り場所を固定しておきたい。

UIがオブジェクトの直接操作になっている場合に限り、 コントロールの移動が許される。 （オブジェクトの場所とコントロールが紐付いている為、別の場所への集中を必要としない）

例としては、PhotoshopやIllustratorにおける拡大縮小ハンドルなど。

ごちゃごちゃもデザインの一つ

mixiのリニューアルの際、適切なマージンを取っていたものの、「白すぎて見づらい」という苦情が出たことがあった。 理不尽といえば理不尽な感じもするけれど、マージンが無条件に読みやすさに貢献するわけではなく、 多くが無視されてしまうコンテンツ（ニュースサイトとか、日記の件名一覧とか）だと、圧縮して一度に多くのコンテンツを 一覧出来た方が「探しやすい」のではないか。

行間についても同じようなことが言えて、 広く行間を取るのは一見読みやすいけれども、 プログラムのコードの行間は詰まっていないと読みづらい。

「内容の全てを読ませる」場合のみ、行間は役立つのではないだろうか。

白すぎる、というのは、液晶というのは発光する媒体である、ということも 関わっていると思われる。文字が多くて画面が黒い方が読みやすいのだ。