スマホ対応を見越したスライド型のランディングページ

SP対応を考慮したランディングページを作成を行うときにはパソコンの画面とスマホの画面の違いや閲覧時のユーザーの動作の相違点について理解しておく必要があります。手間をかけずに両者に対応できるようにするためには、基本的には制限が多いスマホに合わせてデザインを行うことが肝心です。パソコン向けのランディングページをスマホ対応にする際に問題になりやすいのが文字や画像の厳選と再配置です。同じ有効な素材を使用してパソコン版でもスマホ版でも首尾一貫した宣伝を行えるようにするのは重要ですが、その際にうまくレイアウトできなくてスマホ対応に苦労することはよくあります。ランディングページのスマホ対応を仕事として請け負ってくれる会社に任せてしまうこともでき、あまりに複雑なときには特に有用な選択肢になります。しかし、予めスマホ対応を見越したランディングページの構成にしてあると比較的簡単に制作することが可能です。

ランディングページの構成をスライド型にするのは解決策の一つです。一画面で一つの内容が完結するようにランディングページをデザインしておくとパソコンでもスマホでも同じ視点でランディングページをレイアウトすることができます。最初に興味付けを行い、実際に商品などを使ったときに得られる結果を伝え、その根拠となっている理由について示すといった形でランディングページの基本的な流れを踏襲して一つ一つの要素を一画面で収めるように作り上げるのです。すると、そこから情報量を削ってスマホ対応をすることができるようになるのです。パソコン版の場合には一画面よりもやや広くなってまっても問題はありませんが、明確な区切りを持って構成しておくとスマホ対応のときにレイアウトに困ることがありません。

この方法でデザインを行ったときには各々の要素をつないでいくことも重要になります。指マークや矢印などを使って次の内容へとユーザーを導いていくようにするのが基本です。これはパソコンでもスマホでも同じように行うことができます。そのガイド部分を一画面内に収めても画面外にしてしまっても問題はないので、見やすいように大きさも調節して区切りごとに配置することが大切です。このような技巧も組み合わせることによって両対応が可能なランディングページに仕上げることができます。