ランディングページ大切な「余白デザイン」の考え方

余白

@よしみです。

先日、とある打ち合わせ(僕はアドバイザーとして参加している)で、

業者さん
こんなデザイン古くさくて駄目ですよ。もっといいもの作ったほうがいいですよ(w
という会話をされている方がいたので、

ヨシミ
では、○○さん(○○企業さん)であれば今の成果(単価○○円)より確実によい成果が出せるランディングページをこの予算内で制作可能とうことなので、過去の実績を今、みせていただけますでしょうか。さぞかし、すばらしいLPガよにでていることなのでしょう。で、どれですか?
と質問したところ
業者さん
えっと・・・。すいません。確実とはいいきれませんし、その予算では保障ができないです・・・。
という回答。

その方も、業者なのでお仕事を獲得しにくるのはわかるのですが、クライアントが色々なりゆうがあるなか運用されているデザインなどを頭ごなしにけなすのは良くないと思います。やはり改修させる理由をしっかり伝えなくては行けないと思うのです。

今回は、ランディングページには実はかかすことのできない「余白の大切さ」についてご紹介したいと思います。

ランディングページに求められるもの

ランディングページに限らずですが、LPに求められるものは「お問い合わせ」「お申し込み」「売上」などコンバージョンと呼ばれる成果です。

物品の販売であればその良さを一生懸命、くまなく紹介して、素晴らしさを理解してもらうことが制約につながることでしょう。求人サイトであれば会員登録したあとの「転職のし易さ」「年収アップが見込める」などの内容を記載することになるでしょう。

しかし、全てを掲載するにはかなり縦長になってしまい見ている方も疲れてしまいます。逆を考えれば上から下まで見ないと理解しにくい商品やサービス内容であるということになってしまいます。長過ぎてしまうと最初に目に入った内容を忘れてしまいますし、飽きてしまいます。つまり離脱につながる可能性も高くなると考えられます。

長いLPが全て悪いというわけでもなく、しっかり戦略が組まれているLPなどもあります。しかし、ただ、単純に情報を詰め込みすぎて長くしているページは要注意です。

余白の効果で「読み易さ」をプラス

グラフィックデザインには「余白」の取り方は非常に重要で、むしろあえて余白をとるには難しい部類にはいると思います。「余白」の有無は「見やすさ」を大きく左右します。

「余白デザイン」の効果は

  • コンテンツの切り分け(区切り)
  • 情報のまとまり感をだしてくれる
  • 高級なデザイン、ポップなデザインなどへ変化させる

が上げられます。

余白の取り方・設計の仕方で雰囲気が変わります。

余白で情報・コンテンツの区切りをする

yahoo!引用:http://smartphone.yahoo.co.jp/
Yahoo!携帯ショップのランディングページです。区切り線やカラーでのコンテンツ区切りなどありませんが、余白を多めにとることとタイトル(見出し)でコンテンツ部分をしっかり表現されております。ヘッダー部分は全体がクリッカブルになっており、動画が再生されます。キャッチーなタイトルの周りにはこれといったテキストもなく、タイトルが強調されております。

にぎやかさを出すのであれば情報は密にコンパクトに

神輿引用:http://www.mikoshi.or.jp/kodomo/
上州神輿製造業協同組合の神輿のランディングページです。神輿の購入を促すランディングページで、ターゲットは各市区町村の町内会でしょう。黒と白を基調に質実剛健を思わせるイメージです。画像、テキスト、余白のバランスでにぎやかさが伝わります。

高級感を出すには多めな余白がポイント

smheadaalp引用:http://mogans.jp/
自然派コスメの(mogans)モーガンズ 公式オンラインストアさんのページより拝借いたしました。メインビジュアルはテキストと画像ではありますが、画像の周りに多くのテキストを含んでおりません。コンテンツ部分もタイトルが開業されているとしても行間が大きくとられております。説明文も行間が大きく感じ、せかせかするというよりゆったり感が伝わってきます。コンテンツ間でも余白がしっかりとられており区切りがしっかりしているので読み易いページです。

最後に

余白の調整はデザインするかのごとく難解です。しかし、ビシッときまったときの安定感は素晴らしいものがあります。黄金比、白銀比、青銅比など数学的要素が盛り込まれているデザインなども多数あります。その比率ではありませんが意識することで最終的な仕上がりが大きく変わってくることでしょう。

もちろんデザインは「余白デザイン」が全てではないです。

ペルソナやカスタマージャーニーを取り入れて読み物として設計する事も大切です。ただ情報を詰めるというデザインをなされている、提案をうけている場合は、一度でいいので、クリアな状態で遠目で、客観的にチェックしてみることをおすすめします。

Webを事業の成果につなげたいとお考えであれば、ぜひ一度ご相談ください!

ソフィーリサーチ&コンサルティングは、事業の成果を伸ばすため、実践的な戦略思考力と実行力で徹底的に成果を追求し、クライアントのパートナーとしてWebコンサルティングをさせていただきます。