Home > HTML&CSS > 素敵でクールなテーブルデザインのサイトいろいろ

素敵でクールなテーブルデザインのサイトいろいろ

2010年03月18日

ウェブサイトを作成する際にテーブルデザインって結構悩む所ですが、クールなテーブルデザインが組まれているサイトがまとまっていましたのでご紹介。

テーブルデザインをおこなう際の基本的なコードも紹介されています。Showcase of Excellent Tables and best practices

Domestika

sshot2010-03-18_13.35.20.png
カラーリングはシンプルですが文字の大小濃淡がうまく利用されていてすっきりと見やすいですね。

Shopify

sshot2010-03-18_13.37.16.png
価格の表記をこれでもかと言わんばかりにデカく表記。サイト側が伝えたい、ユーザが1番に知りたい部分をこうやって大胆なデザインにするとわかりやすいですね。

ExpressionEngine

sshot2010-03-18_13.39.59.png
できる事とできない事をチェックアイコンで表す。定番化していますが非常に見やすいですね。

Notable.

sshot2010-03-18_13.41.36.png
オススメするブロックをデザイン変更してわかりやすく。

その他にも素敵デザインのテーブルが多数紹介されています。テーブルを組む際に参考にしたいですね。

なお、テーブルデザインの基本的なコードも紹介されていました。こんな感じのデザインが組めます。コードはダウンロードもできます。
sshot2010-03-18_13.44.08.png

Showcase of Excellent Tables and best practices

HTML&CSS

  1. No comments yet.
  1. No trackbacks yet.