こんにちは。シナジーマーケティング デジタルマーケティンググループのTANAKAです。ご飯食べるより検索が大好きです。

最近は生成AIの台頭により「教えてもらう」機会が格段に増えました。（なぜわかった？）と聴きたくなるくらいピッタリな情報を出してくるので、検索の仕方も変わってきました。

早速、本題です。
以下、LPをランディングページと表現します。

第3回は（第4回があるかどうかは不明です）「ランディングページは作った！興味を持ってもらえそうなおトク情報も載せてるのに…反応が薄い。」という悩みに効果があるかもしれない方法をお伝えいたします。

普段、サイトを見ていると、小さな文字や行間が詰まった文字列に（読みづらい…めんどくさい…）となることありませんか。わたしはあります。
どうしても読まなければならない場合は読みますが、そうでなければ読まずにスルーしてしまうことが多いです。

もし、これがせっかく作ったランディングページで起こっていたら？
もったいないですよね。早速チェックしてみましょう。

（１）PCとスマートフォンで同じように読みやすいかどうか。

（２）注意事項や特記事項の表記はわかりやすいかどうか。

（３）太字や下線、改行、句読点は適切に使用されているかどうか。

01．PCでもスマートフォンでも読みやすいレイアウトを目指そう

最近はPCよりスマートフォンからのアクセスが圧倒的に多いというサイトも増えており、スマートフォンで読みづらいことが大きな機会損失につながっている場合があります。PCでもスマートフォンでも同じように情報を得られることは重要です。

スマートフォンでの文字サイズは、最低でも14px（14ピクセル、1.4rem）はあったほうが良いと言われています。
それより小さい文字でレイアウトしていると、読みづらいと感じる方が多いかもしれません。

テキストのことばかり語ってしまいましたが、説明図など図表についても同じことが言えます。
PCで見られることを想定した図表が、スマートフォンでは小さく表示され、何を表しているのかわかりづらいということもあります。図表の中のテキストについても、PCでもスマートフォンでも同じように読めるかどうか確認しておくと良いでしょう。

02．注意事項も読まれることを意識したレイアウトをしよう。

注意事項は、メインのコンテンツに比べて小さく書かれていることが多く、「サイト上に情報があればOK」「とりあえず免責で入れた」といった感じで、見やすいかどうかまで十分に検討されていないことがあります。
昨今、景品表示法などサイトでの表示を巡るさまざまな法律が厳しくなっていることを考えますと、注意事項や特記事項などはユーザーに正しく伝わる状態になっていることが望ましいでしょう。

内容に応じて、フォントのサイズやウェイト（文字の太さ）を検討したり、行間を調整したりして、見やすくわかりやすい状態にすることは大切です。
「こういうコンテンツでは、注意事項はこの文字サイズと行間で、行頭に※をつける」などサイト内で注意事項の表現パターンを作っておくのも良いと思います。

注意事項のテキスト量が多く、ネガティブな印象を与えそうという場合は、注意事項のテキストを画像として作成し、ページ内にレイアウトすることで見やすくなります。
内容に合わせて、PC用／スマートフォン用で画像を2枚用意し、デバイスで切り替えて表示するようにしても親切でしょう。

03．太字や下線、改行、句読点は適切に使われているかチェックしよう。

テキストの装飾で太字や下線を使用することはよくありますが、太字が多すぎると読みづらくなりますし、下線はクリックできると勘違いされがちで、意外とスマートフォンでは見づらいという懸念もあります。こういった点に配慮して、ユーザーにとってわかりやすい表現になっているかチェックすることは重要でしょう。

改行も盲点になりやすいです。
『レスポンシブサイトあるある』で、PCでは読みやすい位置で改行できていても、スマートフォンでは見づらい位置での改行になっていることがあります。その場合はページでの見映えを定義しているスタイルシートでの調整や、テキスト部分をまるっと画像化をするなどで読みやすくすることができるでしょう。

句読点も多用しすぎるとわかりづらくなります。
わたしがチェック方法のひとつとして実践しているのは「声を出して読む」ことです。声を出して読んでみると（あれ？なんでココに読点入ってるんだろう？）と気づくことがあります。
2024年は『障害者差別解消法の改正法施行』が予定されており、Webアクセシビリティへの対応義務化があります。サイトの読み上げも重要なポイントです。ぜひ音読でのチェックもしてみましょう。

04．必ず実機での検証はしよう

最後に、公開前・更新前の確認時に配慮していただきたいことをお伝えいたします。

なるべく実機で確認を
実機（スマートフォン）を使わず、PC用ブラウザの開発者モード※などで確認されている方もいらっしゃると思います。実機とほぼ同じように見えることも多いのですが、コンテンツの構成などにより想定以上に違いが生じているケースもありますのでご注意ください。
※開発者モードなどでの検証について詳しく知りたい方は「開発者モード スマートフォン 検証」あるいは「スマホ chrome 開発者ツール iphone」などで検索すると役立つ情報を得られるはずです。

ルールに沿って実施、なければ新たに作る
実機での確認については、ランディングページ作成時に定義した「動作保証要件」として決めているものに沿って実施するのが良いでしょう。
詳細に決めていなかった、あるいはリリース当時から年数が経っていて最新ではないという場合は、改めて策定して実施されることをオススメします。

当事者だけで確認しない
当事者だけで確認するとページを見慣れすぎて、チェックすべき箇所を見落す可能性があります。
できれば、社内で協力者を募ってランディングページにアクセスしてもらい、気づいた点を挙げてもらうのがオススメです。
ページを一度も見たことがない人も良いでしょう。新たな視点による気づきを得られるかもしれません。

実際にこんなことがありました

ランディングページではなく、FAQコンテンツでのお話です。
そのサイトでは、FAQコンテンツを経由したユーザーのコンバージョン率が高いという結果が出ていたので、内容を充実させるなどしていたのですが、なかなか数値が上がらないことが悩みでした。
そこで再度、複数人での検証を実施したところ「スマートフォンで表示した時の文字サイズが小さすぎるのでは？」という、これまで出たことのない意見が出ました。適切な文字サイズと行間のサイズを再策定し、FAQコンテンツに適用しました。スマートフォンでは、以前よりも大きな文字で表示されるようになりました。
修正後1.5ヶ月目くらいから徐々にコンバージョン率が上昇し始めました。1年経過する現在、2倍近いコンバージョン率になっています。
元々スマートフォンからのアクセスが多いサイトだったこともあり、読みやすくなったことで、ユーザーも安心して申込へ進むことができるようになったようです。

まとめ

文字サイズや行間を見直すだけでコンバージョン率が上がる、という経験は嬉しかったと同時に（ユーザーの立場に立った設計ができていなかったんだなぁ）という反省もありました。
公開してから少し時間が経過しているランディングページや、コンバージョンへの貢献度が高いランディングページなどについて、改めて見直してみると良いのではないかと思います。

シナジーマーケティングは、データに基づいたランディングページやサイトの制作・改善を得意としています。今回のようなコンバージョンにつながる小さな対策についてもデザイン・ライティングなども含めたご提案と実践を行っています。業界別にさまざまな知見を持ち、画期的な戦略を提案できるメンバーが揃っています。小さなご相談からでも、ぜひお気軽にお寄せください。