たこすけのサイト100選

サイト100選です。ぼちぼちがんばります。

公式

【No.40】東芝 REGZA【これぞ日本】

www.toshiba.co.jp 【気がつきリスト】 ・まず、情報量がめちゃくちゃ多い。パッと見ただけで目がチカチカしてしまった。情報量が多い上に、知らない商品のことばかりなので、アラビア語を見ている気分になってくる。 ・4kや高画質が売りの商品を紹介するの…

【No.39】Dyson japan 【過度にシンプル】

www.dyson.co.jp 【気がつきリスト】 ・情報が表にほとんど出ていないし、動きもほとんどないデザイン。美が強みのダイソンなのにウェブサイトは驚くほどシンプル。 ・ただ、見たいコンテンツは探しやすくなっている。製品のキャンペーンや保証状況は一目で…

【No.35】OZmall オズモール【女性らしさというデザイン】

www.ozmall.co.jp 【気がつきリスト】 ・レストランやホテルから、レジャーやエステまでなんでも予約ができて便利なオズモール。特に若い女性がターゲットのサイトなので、男が見ると世間の動きがわかって面白い。世のオッサン達は毎日欠かさず見た方が良い…

【No.31】レストランカラオケ シダックス【大きな画像でわかりやすく】

【気がつきリスト】 ・ファーストビューでスライドするキービジュアルが大きく見える。画像自体の文字も大きいし色数も少ないので情報がドーンと入ってくる。 ・ナビゲーションも大きめサイズで全部日本語表記されている。区切りはないけど、アイコンがある…

【No.30】ニュース速報:読売新聞【情報をレイアウトするということ】

www.yomiuri.co.jp 【気がつきリスト】 ・普段はSPから見ているニュースサイトのPC版でした。とにかく文字が多い。一瞬うわっ!と文字の多さに驚くけれど、自然と真ん中の最新ニュースに目がいく。なぜだろうか。 ・コンテンツがあまりにも多いので、ほとん…

【No.29】ツルハドラッグ【見る人を考える】

www.tsuruha.co.jp 【気がつきリスト】 ・医薬系のような信頼感が大切にされる業界はカラーが青系統になることがおおい。しかしツルハのコーポレートカラーは赤で、ウェブサイト内も赤が前面に押し出されている。 ・この赤色を見るとお店のことが頭に浮かん…

【No.27】Procter&Gamble【世界の大企業デザイン】

http://us.pg.com/ 【気がつきリスト】 ・色が白と青の二色で統一されていて、赤やオレンジなどは画像で使われている。 とても綺麗な対比になっていて目を引く。 ・最新情報が一番下の段に来ている。基本はニュースリリースのはずだけど、ブログ記事がトップ…

【No.26】栃木レザー株式会社【迫力と熱意】

栃木レザー株式会社 【気がつきリスト】 ・横幅いっぱいでブロックを区切っただけのレイアウト。 ・あかとおれん ・黒とオレンジがテーマカラーになっている。全体が暗すぎて少し見にくい気がする。 ・画面をスクロールするとコンテンツが浮かび上がってくる…

【No.25】SHURE【シンプルで美麗】

www.shure.co.jp 【気がつきリスト】 ・ファーストビューの背景は黒になっていて、スタイリッシュに見える。少し下にスクロールすると明るいグレーになり、雰囲気は残したまま情報のみやす状態になる。背景色でイメージを切り替えるというのも一つの選択肢。…

【No.24】ドン・キホーテ【左メニューでみやすく】

www.donki.com 【気がつきリスト】 ・キービジュアルの上に出てくる矢印ボタンが、立体的な可愛いボタンになっている。 ・最新情報のボタンがフワフワと浮かんでいる表現になっている。 ・左側に縦のナビゲーションは初めてのパターン。なんだか違和感がある…

【No.23】コカ・コーラ【予想外のデザイン】

www.cocacola.jp 【気がつきリスト】 ・すごい。トップが画面サイズだけ。スクロールができなくて驚いた。コカコーラくらい載せるコンテンツが多いと、逆にトップページはシンプルな方がいいのかもしれない。どうせ載せきれないほど新商品も出ているしキャン…

【No.22】プラチナ万年筆【これぞグリッド】

プラチナ万年筆 【気がつきリスト】 ・グリッドレイアウト!大きさも大中小と揃っていて綺麗。だけどなんとなく見にくい気がする。文字が多いのと、各ボックスの中身に統一感がないからかもしれない。 ・ヘッダーに検索ボックスとSNSのボタンがついている。…

【No.20】KOKUYO【カラーの統一】

www.kokuyo.co.jp 【気がつきリスト】 ・大企業のサイトでは珍しくグレーの背景。黒文字が少し見にくいけど、落ち着いた印象に見える。 ・注意喚起の広告は赤背景に黄色文字。色がパッと目に入って思わず読んでしまう。 ・フッターのサイズがかなり大きい。…

【No.19】nepia【やさしい感触】

ティシュ, トイレットペーパー, やわらかハート ネピア 【気がつきリスト】 ・青系の色使いにナビゲーションのピンクがアクセントになっている。 ・キービジュアルの上に乗っているリンク、はじめてみた。一目に入る情報が多くて、リンクになっているので便…

【No.18】Huawei Japan【枠からはみ出す】

www.huawei.com 【気がつきリスト】 ・ほとんど飾りがなく、商品の立体的な画像があるだけ。最近はこのパターンのシンプルな広告がよく目につく。 ・アイコンで表すだけじゃなく、商品画像をサムネイルとして使ってわかりやすく内容を表している。 ・ブロッ…

【No.15】高倉町珈琲【店のカラーを出す】

takakuramachi-coffee.co.jp 【気がつきリスト】 ・シンプルで高級感ある、お手本のようなデザイン。 ・キービジュアルとナビゲーションがくっついている。 ・ナビゲーションのボーダーがホバーすると遅れてついてくる。 ・店舗画像の上でホバーすると住所が…

【No.14】珈琲所コメダ珈琲店【味のあるデザイン】

www.komeda.co.jp 【気がつきリスト】 ・キービジュアルが立体的になっている!これはすごい! ・和風テイストのお店なのでテキストコンテンツは縦書きになっている。とても目を引く。 ・レイアウトが斬新。画像がはみ出したり、横長と四角のバナーリンクで…

【No.12】ZOZOTOWN【探しやすいEC】

http://zozo.jp/ 【気がつきリスト】 ・セールの広告がヘッダーで帯のようになっている。クーポンも同じ。人が最初にきになるのは、「今どんなキャンペーンをやっているのか」ってことなのか? ・商品紹介の画像は、全部縦が長い長方形になっている。どうし…

【No.11】マクドナルド【動いて楽しい】

www.mcdonalds.co.jp 【気がつきリスト】 ・背景に黄色が使われている部分がある。食品系で派手な色が使えるのはイメージが浸透しきっているマクドナルドの強み。 ・商品は切り抜いて、影をつけてというスタイルが多い。 ・動きが多く、見ていて飽きない。 …

【No.10】東武百貨店 池袋店【統一感を重視】

www.tobu-dept.jp 【気がつきリスト】 ・キービジュアルが特徴的。二分割して二種類の宣伝が目に入るようになっている。 ・2番目のコンテンツは動画。音無し自動再生。上側は動きのあるものが集まっている。 ・百貨店だけあって、取り扱っている商品が多いの…

【No.9】サカゼン【バナー推し】

【気がつきリスト】 ・とにかく見やすいデザイン ・白と濃紺がメインカラー、合わせる色は黄色と赤 ・キービジュアルは目を引くタイプではなく広告的。季節商品、セール品情報と最後に就活商品。 ・縦の列として数えると偶数になっている。奇数の方が選ばれ…

【No.8】ロート製薬株式会社【信頼の青】

www.rohto.co.jp 【気がつきリスト】 ・キービジュアルがおしゃれ。幅が1:2くらいになっているのか。空欄に手書きで文字を書き込むデザインが目を引く。 ・大きめのサムネイル、見出しに短い下線というボックス内のデザインは、前に調べたセルリアンタワ…

【No.7】JetStar【テーマカラー重視】

www.jetstar.com 【気がつきリスト】 ・コーポレートカラーのオレンジを基準に作っている ・ヘッダーにフライト検索がある。ここにあったら下の方のコンテンツはあまり見られない気がする。だけど、ここで最初に検索されなかったら別の会社に流れてしまうか…

【No.6】三菱鉛筆【カラフルでも良い】

www.mpuni.co.jp 【気がつきリスト】 ・キービジュアルのペンを並べる表現、どんな意味があるのだろうか? 円を描くようにして、カラフルに並べている。 ・ヘッダーに文字サイズを三段階で変えることができるボタンがある。文房具は受ける年齢層が幅広いから…

【No.5】丸亀製麺【おしゃれな縦書き】

www.marugame-seimen.com 【気がつきリスト】 ・キービジュアルに少し大きめのサムネイルが付いている ・Gナビに公式アプリのページがある。よっぽどDLしてほしいようだ。 ・商品単体の切り抜き画像で統一されている。陰影や光が強調されている。 ・店舗検索…

【No.4】福砂屋【スタイリッシュな和の心】

福砂屋オフィシャルサイト 【気がつきリスト】 ・キービジュアルに動きがあってそこがナビゲーションも兼ねている ・動画が用意されている。職人『芸』は言葉よりも動画の方がよく伝わる。 ・日本向けページは最新情報がメイン ・背景が単色じゃなくてうっす…

【No.3】サンマルクカフェ【シンプルに】

www.saint-marc-hd.com 【気がつきリスト】 ・すごくシンプルでわかりやすいレイアウト ・なぜか余白が多い ・キーヴィジュアル、次の画像が少しだけ見えている(わざと?) ・ツイッター、インスタ。訴求したいのは若者なのか?その割にデザインはお堅い大…

【No.1】東急セルリアンタワー【大人デザイン】

www.tokyuhotels.co.jp 【気がつきリスト】 ・幅のあるコンテンツに、画面幅のキーヴィジュアル ・白が基調 ・見出しなどは明朝体(黒)、それ以外やナビゲーションはゴシック体(グレー) ・画像をホバーすると薄く白になる ・ボックスには薄く影がついてい…