Webデザイン分析まとめ｜Webサイト100選 一覧

「うぇぶ、ひゃっくり｜Webサイト100選」で公開している、企業・団体の公式サイトを実際に見ながら、使いやすさ・色の使い方・情報の並べ方の3つの見方でまとめた「デザイン分析」記事の一覧ページです。学びの記録として、No.001から順に足しています。

はじめて読む方へ

どれから読めばいいか迷ったら、知りたいことに近い記事から読んでみてください。

• 色の使い方を知りたい：No.004 ユニクロ、No.012 資生堂
• 情報がたくさんあるサイトの整理のしかた：No.001 東武百貨店 池袋店、No.017 東京大学
• だれでも迷わない役所のサイト：No.005 東京都、No.025 名古屋市
• 写真で魅力を伝えるサイト：No.008 くら寿司、No.014 IKEA

デザイン分析記事一覧（全26件）

• No.001 東武百貨店 池袋店公式サイトのデザイン分析
• No.002 キユーピー公式サイトのデザイン分析
• No.003 無印良品「店舗・ネットストア」ページのデザイン分析
• No.004 ユニクロ公式サイトのデザイン分析
• No.005 東京都公式サイトのデザイン分析
• No.006 トヨタ公式グローバルサイトのデザイン分析
• No.007 びっくりドンキー公式サイトのデザイン分析
• No.008 くら寿司公式サイトのデザイン分析
• No.009 スターバックス公式サイトのデザイン分析
• No.010 コメダ珈琲店公式サイトのデザイン分析
• No.011 Apple公式サイトのデザイン分析
• No.012 資生堂公式サイトのデザイン分析
• No.013 Nike公式サイトのデザイン分析
• No.014 IKEA公式サイトのデザイン分析
• No.015 Netflix公式サイトのデザイン分析
• No.016 マクドナルド公式サイトのデザイン分析
• No.017 東京大学公式サイトのデザイン分析
• No.018 ソニー公式サイトのデザイン分析
• No.019 Panasonic公式サイトのデザイン分析
• No.020 日本科学未来館公式サイトのデザイン分析
• No.021 国立科学博物館 公式サイトのデザイン分析
• No.022 東京消防庁こどもページのデザイン分析
• No.023 ベネッセ公式サイトのデザイン分析
• No.024 Proglab公式サイトのデザイン分析
• No.025 名古屋市公式サイトのデザイン分析
• No.026 POPOPO公式サイトのデザイン分析

各記事では、サイトの基本情報のあとに、そのサイトならではの工夫を画面のスクリーンショットや構成図といっしょに整理しています。そのうえで「このサイトから取り入れたいこと」、ほかのサイトとの比べ、学んでいる立場から「私が気づいたこと」「自分ならこう作る」をまとめ、最後によくある質問を載せています。