『マジックナンバー7±2(4±1)』の概念をウェブデザインに取り入れる

Wait for feeding…


先日ご紹介しました、『デザインにひそむ〈美しさ〉の法則』っちゅう本

この本でも、ちらっと、触れられている『マジックナンバー』っちゅう概念。ウェブデザインにも応用できそうなのでメモ。

そもそも、この『マジックナンバー7±2』(最近では、4±1との説もございます。)というものは・・・

1956年に心理学者のジョージ・ミラーさんが発表されたもので、
人間が短期的に記憶できるかたまりの数を指すそうです。。
無意識のうちに短期記憶の中に記憶できる数が5~9もしくは、3~5つのかたまりだそうですわ。。

電話番号とかがいい例っす。0312345678って書かれるよりも03-1234-5678って書かれる方が記憶しやすいですよね。。。(わたくしこれでも記憶できませんが。。。)3~5つの数字のかたまりに分けることで、短期記憶に記憶しやすくするように工夫されているようです。

何の気なしにボ~っと見てることの多いウェブサイトにも、この『マジックナンバー7±2(4±1)』の概念は、もちろん取り入れられております。。

1. wikipedia
wikipediaのナビゲーションは7つにまとめられてますね。

wikipedia

2. 楽天
楽天のサーチ横のナビゲーション部分も7つ。。。

rakuten

3. YAHOO! JAPAN
YAHOO! JAPANは、ロゴを挟んで左右に3つずつですね。

YAHOO! JAPAN

4. Google
Googleの場合は、5つにまとめて、残りはmoreってしてます。

Google

5. Apple
Appleのメインメニューもやっぱり7つ。。(アメリカは最近iPhoneが追加されて、8つになってます。。)

Apple

やはり、普段よく見られるサイトは、この『マジックナンバー7±2(4±1)』の概念を取り入れてるのでしょうね。。

ウェブやデザインの知識が乏しいクライアントさんの多くは、サイトのメニュー部分をやたらと多くしたがる傾向にあります。。。

自分たちのビジネス内容を少しでも多く見せたいというのは良く分かるのですが。。この『マジックナンバー7±2(4±1)』の概念からすると、メニュー部分を10も20も設けるのは(ちと大げさか。。。)、逆効果なのかもしれませんね。。。

デザインblogランキングデザインblogランキング

デザインblogランキング

コメント No Comments »   はてなブックマーク   del.icio.us

この記事に関連する記事



No Responses to “『マジックナンバー7±2(4±1)』の概念をウェブデザインに取り入れる”

  1. johannes Says:

    「マジックナンバー7±2(4±1)」は後付け理論なので、wiki、apple、google等のサイトメニュー数が3~9なのは「マジックナンバー7±2(4±1)」を取り入れているという記事内容は違うと思います。

    wiki、apple、google等のサイトメニュー数に限らず3~9という数は1や2、または10以上の数よりもはるかによく使用される数なので、大概の事柄に当てはまります。

    英単語の数(Stadium・rabbit・card・・・)会社名(yahoo・資生堂・フジテレビ・・・)

    3~9という数が多く使用されているから「マジックナンバー7±2(4±1)」という考えが成立するのであって、「マジックナンバー7±2(4±1)」という考えがあるから3~9という数が多く使用されているのではないと思います。

  2. 管理人 Says:

    johannesさん
    コメントありがとうございます。確かにおっしゃられるとおり、「マジックナンバー7±2(4±1)」は後付け理論なのですが。。。ほとんどの大企業のサイトでは、メニュー数が3~9以内に上手くまとめられいるので、大概の事柄に当てはまります。
    わたくしが、担当する個人や、中小企業のクライアントさんは、どうもメニュー数を多くしたがる傾向があるのです。。
    こんなときに、実際にいくつかのサイトを見せながら、この「マジックナンバー7±2(4±1)」の理論はなかなか、ウケがいいのです。
    デザイン的にもすっきり見せて、ユーザーの方々にも認識されやすいデザインを追求した結果、この理論で落ち着いたのではないでしょうか?

  3. マジックナンバー8×3 : クレアトゥールスタッフのブログ Says:

    […] ホームページは第一印象が命 (All About) 『マジックナンバー7±2(4±1)』の概念をウェブデザインに取り入れ… (DesignWalker) ホームページの表示を高速化するための14のルール (Ecommerce […]

この記事に対するコメントを残す




この記事のトラックバックURL

広告掲載のお問い合わせはこちら

検索

Google

カテゴリーアーカイブ

最近の記事

タグ・クラウド

月別アーカイブ

Agile Media Network パートナーブログ