縦横カラー見出し
商品名1 | 商品名2 | 商品名3 | 商品名4 | |
---|---|---|---|---|
商品画像 | ||||
◯× | ||||
特徴 | 商品名1の特徴 | 商品名2の特徴 | 商品名3の特徴 | 商品名4の特徴 |
星評価 |
縦見出し、横見出しともにカラーのテーブル
横カラー見出し+縦ホワイト見出し
商品名1 | 商品名2 | 商品名3 | 商品名4 | |
---|---|---|---|---|
商品画像 | ||||
◯× | ||||
特徴 | 商品名1の特徴 | 商品名2の特徴 | 商品名3の特徴 | 商品名4の特徴 |
星評価 |
横見出しをカラーにして、縦見出しは白い見出し(左から右にかけて薄くグラデーション入り)のテーブル
縦カラー見だし+横ホワイト見出し
商品名1 | 商品名2 | 商品名3 | 商品名4 | |
商品画像 | ||||
マルバツ | ||||
特徴 | 商品名1の特徴 | 商品名2の特徴 | 商品名3の特徴 | 商品名4の特徴 |
星評価 |
縦見出しはカラーで、横見出しは白(上から下にかけて薄くグラデーション)のテーブル
横見出しのみ
商品名1 | 商品名2 | 商品名3 | 商品名4 |
---|---|---|---|
商品名1の特徴 | 商品名2の特徴 | 商品名3の特徴 | 商品名4の特徴 |
横見出しのみカラーのテーブル
縦見出しのみ
商品名1 | 商品名2 | 商品名3 | 商品名4 | |
商品画像 | ||||
マルバツ | ||||
特徴 | 商品名1の特徴 | 商品名2の特徴 | 商品名3の特徴 | 商品名4の特徴 |
星評価 |
縦見出しのみカラーのテーブル
スマホでも本文と文字サイズを同じにする
商品名1 | 商品名2 | 商品名3 | 商品名4 | |
---|---|---|---|---|
商品画像 | ||||
◯× | ||||
特徴 | 商品名1の特徴 | 商品名2の特徴 | 商品名3の特徴 | 商品名4の特徴 |
星評価 |
スマホでは、一覧性を高めるために通常本文よりも2回り小さい文字サイズになりますが、通常本文と同じ文字サイズも可能です。
横線のみ
商品名1 | 商品名2 | 商品名3 | 商品名4 | |
---|---|---|---|---|
商品画像 | ||||
◯× | ||||
特徴 | 商品名1の特徴 | 商品名2の特徴 | 商品名3の特徴 | 商品名4の特徴 |
星評価 |
横線のみのテーブル
縦線のみ
商品名1 | 商品名2 | 商品名3 | 商品名4 | |
---|---|---|---|---|
商品画像 | ||||
◯× | ||||
特徴 | 商品名1の特徴 | 商品名2の特徴 | 商品名3の特徴 | 商品名4の特徴 |
星評価 |
縦線のみのテーブル
外枠のみ
商品名1 | 商品名2 | 商品名3 | 商品名4 | |
---|---|---|---|---|
商品画像 | ||||
◯× | ||||
特徴 | 商品名1の特徴 | 商品名2の特徴 | 商品名3の特徴 | 商品名4の特徴 |
星評価 |
外枠のみのテーブル
枠線なし
商品名1 | 商品名2 | 商品名3 | 商品名4 | |
---|---|---|---|---|
商品画像 | ||||
◯× | ||||
特徴 | 商品名1の特徴 | 商品名2の特徴 | 商品名3の特徴 | 商品名4の特徴 |
星評価 |
枠線のないテーブル
左揃え
会社名 | トヨタ自動車株式会社 (TOYOTA MOTOR CORPORATION) |
---|---|
代表取締役社長 | 豊田 章男 |
本社所在地 | 〒471-8571 愛知県豊田市トヨタ町1番地 TEL(0565)28-2121(代) |
創立 | 1937年(昭和12年)8月28日 |
左揃えのテーブル
スクロール
スマホ閲覧時のみスクロールするテーブル
これは何?
サイト用(特にサイトアフィリエイト)のテーマなので、比較訴求に必須のテーブルデザインのパターンを充実させました。
- 横の見出しだけカラー
- 縦の見出しだけカラー
- 縦横ともにカラーの見出し
- スマホ閲覧時の文字サイズ変更
- 横線のみ
- 縦線のみ
- 外枠のみ
- 枠線なし
- 左揃え
- スマホ閲覧時はスクロール型
など、比較対象物や閲覧環境に応じてテーブルの見た目をカスタマイズすることができます。スクロール型以外は、各テーブルごとに個別にデザインを適用できます。
効果
- わかりやすい比較コンテンツを提示して、ユーザーの理解を助ける
- テーブルデザインを個別に変更できるので、比較対象物に合った訴求ができる
Related Article関連記事だよ!