HPの比較表、目立つ列が「一番よい」に見えていませんか?

HPの比較表、目立つ列が「一番よい」に見えていませんか?

記事
デザイン・イラスト
HPの比較表で、自社の商品や主力サービスの列を目立たせたい方へ。

色で読み始める場所を示すだけでなく、何を基準に選ぶかも言葉で添えましょう。濃い色の列が、すべての人に向く選択肢とは限りません。

強調する列と、選ぶ条件を分ける


body_numbers_full.png


制作例

この制作例では、特長の説明に続いて比較表を置き、その後に向いている用途と注意点を案内しています。

主な選択肢を目立たせつつ、用途に合うかを別の説明でも確かめられる構成です。比較表だけを見て選ぶ人にも、詳しく読む人にも、判断する材料を残します。

濃い色の列にも、項目ごとの違いを残す


hp1_compare_intro.png


hp1_ld_column.png


制作例

「黒アルマイトとの違い」の表では、「LD処理」の見出しが濃い背景になっています。比較欄には、「導通が要るか、耐摩耗性が要るかで選びます」という説明もあります。

表の中も、膜厚、導通、耐摩耗性などを行ごとに分けています。目立つ列を先に読んでも、何を重視するかによって選び方が変わると分かる見せ方です。

自分のHPで比較表を依頼するときも、「おすすめの列をこの色に」だけでなく、「誰が、どの条件で選ぶ表か」を伝えましょう。

たとえば、短期間で始めたい人と、細かな仕様を選びたい人では、重視する項目が違います。どちらにも同じ「おすすめ」を付けるより、選ぶ目的を表の近くに示す方が判断しやすくなります。

色を外しても、意味が残るかを確かめる


初稿では、色の印象をいったん脇に置き、列名と本文だけで違いが分かるかを見ます。

・色が付いた列は、何を表しているか

・「おすすめ」なら、どんな人に向くのか

・ほかの選択肢が向く条件も読めるか

・比較条件や補足が、表から離れすぎていないか

色は目印に使えます。ただし「上位」「人気」「効果が高い」といった意味まで、見た目から推測させないことが大切です。そうした表示を使うなら、根拠と対象の条件を別に確認します。

強調しない方がよい比較もあります


複数のプランを同じ立場で比べてほしいなら、各列を同じ見た目にそろえる方法が向いています。特定の利用目的に合うプランを案内するなら、目的を明記したうえで強調する方法を検討できます。

また、説明条件が大きく異なる商品を、無理に一つの表へ押し込む必要はありません。概要だけをそろえ、詳しい条件は別の説明へ分ける選択肢もあります。

デザインを整えても、性能や適合性の判断そのものは確定しません。比較に使う事実や根拠は、事業の担当者が確認したものをご用意ください。

比較表を依頼するときのメモ


比較する商品・サービス:____

読者が選ぶときに重視すること:____

各選択肢が向く条件:____

目立たせたい列と、その理由:____

比較に使える確認済みの資料:____

まだ確認が必要な項目:____

HP制作では、支給情報の見出し整理やデザインを通して、比較の目的に合う見せ方をご相談いただけます。

このメモと比較資料を添えて、HP制作サービスへご相談ください。掲載量やページ構成、制作範囲は購入前に確認します。


サービス数100万件のスキルマーケット、あなたにぴったりのサービスを探す