Webデザイントレンド定点観測 サイトのフッターでコミュニケーションを図る
東京都渋谷区でフリーランスWebデザイナーとして働く、黒野明子（くろのあきこ）と申します。
「Webデザイントレンド定点観測」第3回では、フッターで積極的にユーザーとのコミュニケーションを図っているサイトをご紹介します。
Webページのフッターには、サイトマップ的に整理されたリンク群やナビゲーションなどがよく見られますが、それ以外にもしばしば、下記のような「コミュニケーションに関連する要素」が設置されているケースがあります。
【ユーザーからのコンタクトを受け付けるもの】
– メールアドレスのリンク（クリックでメーラーが起動）
– 問い合わせフォームへのリンク
– 電話番号
– 住所
– チャットウィンドウ
【継続的な[購読や]情報取得を促すもの】
– TwitterやFacebookをはじめとするSNSアカウントへのリンク
– メールマガジン購読用のメールアドレス収集フォーム
いずれも、Webページを読み終わったユーザーに、次のアクションを促すための要素です。
Webサイトでは、情報発信を一方通行にすることなく、訪問者との接点を確保することも重要な要素となります。そのために、こういった要素をページ内に効果的に配置していきたいものです。
今月は、これらの要素を効果的にデザインし、「私（たち）とコミュニケートしましょう！」というメッセージを明確に伝えているWebサイトを集めてみました。
Cultivated Wit | We Make Fun
アメリカにある制作会社のサイト。フッターには、クリックするとメーラーが起動するメールアドレス、Facebook、Twitter、YouTube等へのリンクが配置されています。右側のYOUR EMAILという文字をクリックすると、ニュースレター購読用メールアドレスを入力することが可能です。PROPAGANDAという単語をわざわざ消して、NEWSLETTERにしているところに、ユーモアを感じさせます。
Manual
コーヒーメーカーやソルトミルを制作する、スタートアップ的メーカーのサイト。このサイトのフッターでも、ニュースレター購読用のメールアドレス入力欄が大きくデザインされています。余白がたっぷり取られた暗い背景の中の、真っ白で大きな入力欄が、非常に目を引きます。またその上には、TwitterとInstagramへリンクされたアイコンが配置されています。
Niche Creative | Helping brands find their place to thrive.
テキサスのクリエイティブエージェンシーのサイト。とにかくフッターにはシンプルに、ニュースレター購読用のメールアドレス入力欄が目立って設置されています。余談ですが、ページ右上の3本線のアイコンをクリックすると右側に開くメニュー部分に、他ページへのナビゲーションやSNSアカウントが設置されています。
Niche Creative | Helping brands find their place to thrive.
Friends of The Web
Webとモバイルアプリの制作会社のサイトですが、こちらもフッターに大きなニュースレター購読用のメールアドレス入力欄を設置しています。その下部には、ニュースレターの特徴説明と、この会社がスパムを送らないことが明記されています。最下部には、電話番号、メールアドレス、Twitterへのリンク等が設置されており、電話番号をクリックすると外部の電話アプリ（Skype等）が起動するようになっています。
Handcrafted website design and development agency based in Southsea, Hampshire
イギリスのWebデザインおよびデジタルマーケティングエージェンシーのサイトです。フッターでもっとも強調されているのは、お問い合わせフォームへリンクされているアイコン。その上部には、問い合わせを促すためのメッセージが書かれています。また、Twitter、Facebook、dribbble、Instgramへのリンクを設置し、自社に関連するビジュアルを、様々な角度から紹介するようにしています。
Handcrafted website design and development agency based in Southsea, Hampshire
HR Software | Kin HR
Webサービスの紹介／販売サイト。このサイトで特徴的なのは、フッター左隅に設置されたチャットです。タグのようにデザインされた「CHAT WITH US」をクリックすると、OLARKというチャットサービスで作られたチャットウィンドウが開き、サポートの人とコンタクトすることが可能になっています。
Chris Wilhite
テーブルやベッドを制作するデザイナーのサイト。このサイトのフッターは、他とは異なり、連絡手段として電話番号のみを非常に大きく掲載しているのが特徴的です。問い合わせフォームのページは独立して用意されているものの、メールアドレスが掲載されていないのは、今回観測した範囲では珍しい感じです。ちなみにInstagramやFacebookへのリンクは、ヘッダーのグローバルナビの中にあります。
Chris Wilhite | Chris Wilhite Design
Playground Inc.
トロントにあるクリエイティブエージェンシーのサイト。フッターにはシンプルに住所、SNSアカウント、電話番号、メールアドレスが設置されており、そのこと自体にはまったく目新しい要素はありません。ただ、その上に短い会社の紹介と、連絡を促すテキストが置かれているところに、着目しました。今回の観測範囲ではこのパターンがかなり多く、フッター部分での言葉による誘導が定番化している印象です。
Numbrs Office and Contact Details – Numbrs
フリーランスで働くデザイナー／フロントエンドエンジニアのサイト。フッターには、Twitter、dribbble、Behance、GitHub、LinkedInへのリンクアイコンがシンプルに設置され、自分の作品とコードと履歴を見てもらうように誘導しているのが、いかにも個人クリエーター的な雰囲気です。
Sam Markiewicz | Web and graphic design – Front-end development
Whiteboard | We empower visionaries to lead meaningful brands.
写真と動画がふんだんに使われたクリエイティブエージェンシーのサイト。フッター右側に、「@whiteboardis」、「Say Hello →」というテキストリンクが配置されています。これらは本文に比べるとかなり小さな文字ですが、余白および背景色と文字色の明度差が十分に確保されているので、きちんと視線が誘導されます。それぞれをクリックすると、Twitterへのリンク、メーラーが起動するリンクになっています。また、このサイトでは、「Say Hello →」というボタン状にデザインされたリンクが、あちこち繰り返し掲載されているのが特徴的です。
Whiteboard | We empower visionaries to lead meaningful brands.
Richard Photo Lab
ちょっと番外編です。ハリウッドの写真ラボのサイトですが、フッターではなく左右脇に縦に並べられた文字にご注目ください。「SEND ELECTRONIC MAIL」をクリックするとメーラーが起動し、「CALL 323 939 8893」をクリックするとSkype等が起動します。レトロな香りを漂わせた、非常に個性的なデザインですね。
今回のように、フッターに着目してサイトを観察していくと、サイトとユーザーのコミュニケーションが細やかに設計されているサイトなのかどうか、よく判断できる気がします。
いつもの制作案件のフッターもじっくり見直していきたいと、個人的に感じた今月の観察でした。
（了）