大きく見せて大きく訴えるランディングページのWebデザイン
tripmii
Webデザイン3つの良いとこ : 3 Good Point!
- サービスの魅力を大きな文字で大きく訴える
- 1スライドで効果的に伝える
- 中途半端は許さない-必ず切り替わるスライド
私はWebデザインのココを見た!
ランディングページって、詳しくしなければユーザーに訪問者を納得させられないし、反対に情報を多く詰めればゴタゴタした印象を与え最後までスクロールしてくれない、とかとてもデザインが難しいですよね。
今回紹介するのはtripmiiという旅に関するWebサービスのランディングページのWebデザイン。その特徴は、「大きく見せて、大きく訴える」という点。1スライドごとに伝えたいことが的確に述べられています。
大きな文字で大きく訴える
スライドごとに文字を大きく、そして背景に「旅」と「写真」という伝えたいことをダイジェストに連ねています。
軽いパララックス効果も利用しているので、視覚的にも面白いです。このように「大きな文字で的確に物事を伝える」Webデザインは、コンセプトが明確なWebサービスにはもってこいのランディングページ用のデザインですね。
ですがこの点でいうと、英語は単語一つだけを利用してもクールに視えるので良いですよねー。日本語でこのような単語を表現するのっていわゆる「ダサく」映ることがありますよね。上の画像でいえば、日本語だったら、なんでしょう。「閃きを手に入れろ」でしょうか(かなり意訳ですが(;´Д`))。・・・あれ、意外と良いかも。
けど、「GET」という単語が大きく表示されていますが、同じ体裁だとして「手に入れろ」を大きく表示させ、「閃きを」を小さく表示するっていうのは変な感じがしますよね。やっぱり、GETという文字に動詞として目的語をとる力があるので、1単語で伝えたいことを表現しやすいのかなーと思いました。
ちょっと英語の話になってしまいましたが、日本語ベースでページを作るときも、このようにキャッチーな物言いで物事を伝えるデザインをしてみたい。
効果的にサービスを伝える
世界を股にかける「旅」に関するWebサービス。その紹介をするために最も効果的な方法は?そう考えると、「世界の様々な箇所でこれだけ使われているよ」という訴えは効果的な訴求力を持ちそうです。
グーグルマップAPIを利用して各所でどれだけの写真がシェアされているのか表しています。このようにサービスの一端を1つの画面で表現するのは良い。
必ず切り替わる縦スライド
Webサイトを見ているとあたかもサイト全体が縦にスライドしているような感覚を覚えます。それはコンテンツによって1ページを区切り、まったく違う背景や文字を入れているから。そんなスライドを見せるために工夫している点が、この必ず切り替わるスライドです。
上図のように途中の時点でスクロールをやめると、必ずどちらか多く表示されているスライドに移り変わります。この演出は良いですよね!訪問者に的確にメッセージを伝えるために無駄な時間は作らせないで毎回ピッタリとした情報を伝えている。
強い訴求力を持ったシンプルなランディングページだと思いました。勉強になります。
今日参考にさせて頂いたサイト
Twitter/FacebookではWebデザインにまつわることから、Web制作に関することを日々配信しています。ぜひフォローしてください!
@webhoonetさんをフォロー