文章だけのページは、読まれる前に閉じられます｜画像で視線を引く、ヘッダー画像の選び方と使う前の3つの確認

ランディングページやセミナーの案内ページを作ったのに、思ったほど読まれていない。中身には自信があるのに、登録や申し込みにつながらない。そんな悩みを持っている方は多いです。

こういうとき、多くの方は文章を書き直そうとします。でも、読者が文章を読み始める前に、すでに「読むかどうか」を決めているとしたらどうでしょうか。

結論から言うと、読者の視線を最初に引きつけるのは、文章ではなく画像です。文字だけがぎっしり並んだページは、一目見ただけで閉じられてしまうことがあります。特に大切なのが、ページを開いて最初に目に入る「ヘッダー画像」です。

この記事では、画像で視線を引く理由と、ヘッダー画像で伝えるべき3つのこと、作り方の手順、そして素材を使う前に確かめておきたいことをお伝えします。

画像は、文字より先に目に入る

ページを開いたとき、読者の目はまず画像に向かいます。文字は一つずつ読まないと意味が分かりませんが、画像は一目で「何のページか」「どんな雰囲気か」を伝えられるからです。

ページに画像があると、次のような良い変化があります。

• 文章の区切りができ、飽きずに読み進めてもらいやすくなる
• ページ全体が丁寧に作られている印象になる
• おしゃれさや親しみやすさなど、ページの雰囲気を伝えられる
• 最初の一瞬で、印象に残るきっかけを作れる

反対に、文字だけで作られたページは、どれだけ内容が良くても、読む前に「大変そうだ」と感じさせてしまいます。画像は飾りではなく、読者に「読んでみよう」と思ってもらうための入り口です。

読者の視線がページのどこから動き始めるかは、ウェブサイトの読者の視線で解説しています。

最初の1枚で伝える3つのこと

ランディングページやセミナーの案内ページでは、ページの一番上に置くヘッダー画像が、視線を引く役目を担います。この1枚で、次の3つが伝わるかを考えます。

たとえば、起業したばかりの方向けのオンラインセミナーの案内ページなら、ヘッダー画像に「対象の人」と「セミナーで分かること」を短い言葉で入れ、講師の写真や落ち着いた色づかいで雰囲気を伝えます。

大切なのは、きれいな画像を選ぶことより、3つが一目で伝わることです。どれほど美しい風景写真でも、ページの内容と関係がなければ、読者は「何のページだろう」と迷ってしまいます。

ヘッダー画像を作る4つの手順

ヘッダー画像は、次の順番で作ると迷いません。

1. ページで一番伝えたいことを、一文で書く
2. その一文から、画像に入れる言葉を短く絞る（見出しと、補足の一言くらい）
3. 雰囲気に合う写真やイラストを選び、言葉と組み合わせる
4. スマホの画面で表示して、文字が読めるか、何のページか一目で分かるかを確かめる

特に見落としやすいのが4つ目です。パソコンで作ると、スマホでは文字が小さすぎて読めないことがよくあります。今はスマホでページを見る人が多いので、必ずスマホの画面で確かめましょう。

自分では分かりやすいつもりでも、作った本人は内容を知っているので、伝わっているかを正しく判断できません。できれば、ページのことを知らない家族や知人に最初の画面だけを数秒見せて、「何のページだと思うか」を聞いてみてください。答えがずれていたら、画像か言葉のどちらかを直す合図です。

ヘッダー画像の下には、キャッチコピーや本文が続きます。画像と見出しで伝える内容がずれていると、読者は混乱します。ランディングページ全体で何を伝えるかは、高成約率LPに必須の「4大要素」も参考にしてください。

ページの途中でも、画像で視線を止める

ヘッダー画像で読み始めてもらえても、長いページでは途中で視線が流れてしまいます。そこで、読んでほしい場所の手前にも画像を置きます。ランディングページや案内ページなら、次の3か所が候補です。

1. 特典や内容を紹介する場所：受け取れる資料や動画の表紙を画像で見せると、「これが手に入る」と具体的に想像してもらえます
2. 発信している人を紹介する場所：顔写真や、仕事をしている様子の写真があると、文章だけより人柄が伝わります
3. 登録や申し込みのボタンの手前：ここまで読んできた内容を一目で思い出せる画像を置くと、ボタンに目が向きやすくなります

どの場所でも、画像は「その場所で伝えたいこと」を助けるものを選びます。画像の数を増やせば良いわけではありません。関係のない画像が続くと、かえって大事なところが目立たなくなります。

一つの目安として、スマホで1画面ずつ下へ送っていったとき、文字だけの画面が何画面も続いていないかを見てみてください。続いているところがあれば、そこが画像を足す候補です。

画像を使う前に確かめる3つのこと

画像を使うときに気をつけたいのが、著作権です。インターネットで見つけた画像を、許可なくそのまま使うと、著作権の侵害になるおそれがあります。

自分で写真を撮ったり、イラストを描いたりする方法もありますが、時間がかかります。多くの場合は、有料の素材サイトや、無料の素材サイトを使うことになります。有料の素材サイトは商用で使いやすい画像が多く、無料の素材サイトは「写真 無料 素材」「イラスト 無料 素材」などで検索すると見つかります。

どちらを使う場合も、使う前に利用規約で次の3つを確かめてください。

1. 商用で使ってよいか（ビジネスのページや広告に使えるか）
2. 素材サイトの名前やリンクを書く必要があるか
3. 文字を入れるなどの加工をしてよいか

素材サイトによって決まりは違うので、「前に使ったサイトと同じだろう」と思い込まないことが大切です。 画像の手に入れ方や、安心して使える素材の選び方は、LPの反応率を上げる「画像」の力で詳しく解説しています。

画像で視線を引くときによくある失敗

最後に、つまずきやすいところを整理しておきます。

最後の失敗も見落としがちです。画像を変えたことで反応が良くなることはありますが、変わらないこともあります。変える前と後の数字を記録して、どちらが良かったかを確かめながら直していきましょう。

まとめ

• 読者は文章を読む前に、画像を見て「読むかどうか」を決めている
• 文字だけのページは、内容が良くても読まれる前に閉じられやすい
• ヘッダー画像では「誰のためのページか」「何が手に入るか」「どんな雰囲気か」の3つを伝える
• 素材を使う前に、商用利用・表記の要否・加工の可否を利用規約で確かめる
• 画像を変えたら、変える前と後の数字で結果を確かめる

まずは、あなたのランディングページや案内ページをスマホで開き、最初の画面だけを見て「誰のための、何のページか」が伝わるかを確かめてみてください。伝わらなければ、そこが最初に直す場所です。

無料プレゼント｜電子書籍

登録ページを飾る人ほど、登録されない

AIで作る「1ページの登録LP」と登録後の最初のメール

何がもらえるかを3秒で伝える1ページと、サンクスページ・最初のメールまでを、AIと作る方法をまとめました。メールアドレスの登録だけで、すぐに受け取れます。

電子書籍を無料で受け取る ▶