タブの「切り替わってる感じ」をしっかり出すなら、ナビゲーションとコンテンツの周囲にダークカラーを適用して、背景と明確に区別してしまう処理が効果的だ。この工夫のお陰で前のタブと後ろのタブの関係性も強調できる。 このレイアウトは2つの異なるタブ用画像を、ラベルの後ろに背景として読み込んで作る。他の色要素はブロックレベル要素に対する背景色やボーダーなど、編集中の画像をみると、さほど大きな違いは無いように見える。しかし、よく見ると、閲覧中のページのラベルはのっぺりした扁平な作りになっている。一方で閲覧中ではないページ用のラベルは左端に1ピクセルの、背景のダークカラーと同じ色のラインと、画像下部のグラデーションによる影を付けている。このちょっとした工夫によって、閲覧中が手前に、そうでないものが後ろにひっこんで見えるわけだ。【図1】と【図2】をよく見比べて欲しい。