ホームページ制作

魅力を並べる前に、選ぶ理由をつくる。

一つの商品やサービスを詳しく伝えるページの考え方。画像、説明、確認事項を、検討の順序に沿って組み合わせます。

誰の、どの場面のためのページかを決める

商品紹介ページを作るときは、商品の特徴をすべて書き出す前に、読む人がどんな状況で訪れるかを考えます。初めてサービスを探している人と、具体的な機能を比較している人では、必要な説明の順序が変わります。たとえばホームページ制作の道具なら、「作り始める方法が分からない」「文章や画像を差し替えたい」「スマートフォンで見えるか確かめたい」といった場面が考えられます。扱う場面を決めると、見せる画面と説明する機能を選びやすくなります。幅広い人に役立つ商品でも、最初の一段では中心となる用途を明確にします。ページの冒頭と末尾で異なる対象を想定していないかも確認します。 読み手の作業と商品の特徴を結びつけることが、抽象的な便利さを並べることより、具体的な理解につながります。

冒頭は、画像と短い要点で判断できる形にする

最初の画面には、商品の姿や使う場面が分かる画像と、何を提供するかを示す見出しを置きます。強い言葉だけで興味を引こうとすると、詳しく読んだあとに内容とのずれを感じさせることがあります。見出しは実際に案内できる範囲に合わせ、画像にも同じ役割を持たせます。制作ツールなら、完成例だけでなく実際の制作画面を示す方法があります。完成例を使う場合は、制作例なのか、実際に提供した仕事なのかを区別します。冒頭の説明を長くしすぎず、詳しい情報は次の段へ配置します。見る人が最初に判断したいのは、何の商品で、自分の目的に関係するかということです。背景の装飾や動きは、その判断を助ける範囲で使い、画像の主役や見出しを探さなければならない配置は避けます。

機能の一覧を、使う流れへ組み替える

機能名だけが並ぶ一覧では、実際にどの順序で使うのかが伝わりにくい場合があります。素材を用意する、内容を編集する、結果を確認する、完成物を使うという流れに沿って整理すると、利用前に必要な準備も分かります。それぞれの段で、入力する物、行う作業、得られる結果を書き分けます。たとえば画像を選ぶ場面なら、写真を準備することと、選んだ画像がページへ表示されることを一組で説明します。自動化される部分と、利用する人が確認する部分も区別します。「自動」という一言で全工程が終わる印象を与えないようにします。現在の製品にない機能を、一般的な制作工程から推測して加えてはいけません。利用する流れの説明は、製品の実画面と確認できた機能に合わせて作り、構想や予定は別の案内にします。

商品写真の全体と特徴を組み合わせるイメージ

最初の写真で商品を示し、細部や使用場面の写真で選ぶ理由を補います。価格や条件は写真の近くで確認できるようにします。

比較に必要な条件を、近くに置く

読む人が利用を検討するときには、機能だけでなく、対象となる作業や必要な素材、出力の用途なども確かめます。条件をページの離れた場所へ隠すように置くと、画像や見出しから受けた印象と、実際の利用条件にずれが生まれます。説明する機能の近くに、判断に必要な条件を添えます。料金や提供内容が確定している場合は、その対象と含まれる範囲を分かる形で示します。まだ一般提供の準備中なら、利用開始できるページのような案内を置かず、紹介として読める内容に整えます。複数の製品を比較する場合は、同じ観点で情報を並べます。一方には機能、もう一方には雰囲気の説明だけを書くと、違いを判断できません。確認できていない項目は推測で埋めず、掲載情報を整えてから案内を更新します。

よくある疑問は、説明の不足から選ぶ

よくある質問を作るときは、検索されそうな言葉を大量に並べることを目的にしません。 本文を読んでも残る疑問を選び、回答はその製品で確認できる内容にします。たとえば、何を準備するか、作成した物をどこで確認するか、提供開始の案内はどこにあるか、といった質問です。一般的な答えしか書けない場合は、本文の説明を改善した方が役立つこともあります。まだ決まっていない提供日や料金に、仮の回答を作らないことも大切です。質問の数をそろえるためだけの繰り返しは避けます。各回答が別の判断を助けているかを読み直します。質問と回答を折りたたむ場合でも、重要な条件まで見えない状態へ押し込まないようにします。読み手が申込みや利用へ進む前に必要な内容は、通常の説明の中でも確認できる位置に置きます。

読み終えたあとの行動を一つずつ案内する

商品紹介の末尾では、次に何をすればよいかを明確にします。利用できる製品なら利用案内へ、比較中の人には一覧へ、素材を準備する人には関連ガイドへ進めるようにします。すべての行動を同じ強さの大きなボタンで並べると、中心となる案内が分かりにくくなります。ページの役割に合う主な案内を決め、補足のリンクは区別します。まだ利用先が確定していない製品では、利用ボタンを仮置きせず、現在の状態を伝えます。公開後に内容を直す場合は、見出し、写真、機能説明、条件、末尾の案内を通して確認します。途中だけ新しい商品名へ変えると、別の商品についての条件が残ることがあります。ページの完成は、文章を書き終えることだけでなく、紹介している内容と案内先が一つの流れとしてつながることです。

魅力を並べる前に、 選ぶ理由をつくる。