faviconを作るときに参考にしたいデザインアイデア

Webサイトの構築をする上で、Faviconのデザインを考えることがあるかと思います。
Favicon(ファビコン)とは、ウェブサイトやウェブページに関連付けられたアイコンのことである。とWikipediaにはあります。
16×16pxという領域ではありますが、ちょっとした主張ができますし、ブランディングにもつながると思います。
そして、小さい領域だからこそクリエイティブのセンスが問われる部分でもあるのではないでしょうか?
今回は、過去にロゴストックで紹介したサイトの中からいくつかのFaviconを集めてみました。
ロゴとFaviconの対比でどうぞ。

1.ロゴそのまま、マーク部分のみ取り出し
ロゴ使用のレギュレーション上、加工ができなかったりするところは多いでしょうね。
その場合は、正方形に近いロゴマークは、やっぱりキレイに収まります。
また、マークと社名(またはサービス名など)といった場合は、マーク部分が正方形に近い場合が多く、そこをFaviconにするということが多いようです。

■アップル

ロゴ Favicon
apple_fav.gif

■スターバックス コーヒー

ロゴ Favicon
stb_fav.gif

■Fedex

ロゴ Favicon
fedex_fav.gif

■eyeVio

ロゴ Favicon
eyevio_fav.gif

■CONVERSE

ロゴ Favicon
converse_fav.gif

2.一部分にフォーカス
上記のマーク部分取り出しとの違いは、そのロゴの特徴的な部分にフォーカスしていると言う点。
より印象深くなるような感じがします。

■鎌倉どんぶりカフェbowls

ロゴ Favicon
bowls_fav.gif

どんぶりの部分をフォーカス。

■アイデアマンズ

ロゴ Favicon
ideamans_fav.gif

アイデアが生まれる部分(?)をフォーカス

■SHOOTI

ロゴ Favicon
shooti_fav.gif

顔っぽくなってる部分にフォーカス

■Wikipedia

ロゴ Favicon
wikipedia_fav.gif

頭文字「W」にフォーカス

3.ロゴにない要素をつかう
Faviconということを意識してかどうかは、わかりませんが、
色々な要素を組み合わせて作っているものたちです。

■amazon

ロゴ Favicon
amazon_fav.gif

頭文字「a」とにっこり口元を組み合わせています。

■ホットペッパー

ロゴ Favicon
hotpepper_fav.gif

ナイフとフォークの部分にしそうですが、
何故か「.jp」の部分。

■The Animal Kingdom

ロゴ Favicon
animalkingdom_fav.gif

こ、これは、いったい。。
輪になってる一つひとつが象の顔に見えるような見えないような。
最後に、ロゴストックでは紹介していませんが、
個人的に面白いなと思っているのは、

■任天堂

ロゴ Favicon
nintendo_logo.gif nintendo_fav.gif

Faviconはマリオです!
うまいブランディングだなと思います。

いかがでしょうか?
faviconのデザイン制作の参考になれば幸いです。

posted by ロゴストック on 2008年3月7日

人気のあるロゴマーク一覧

スポンサードリンク