Web サイトのレイアウトを考えたり写真や画像をトリミングする時、意識して縦横比を統一すると全体のバランスがよくなります。そんな時に、覚えておくとちょっと便利なバランスのよい「縦横比」と「国際標準バナーサイズ」を紹介します。

960 Grid Systemは、ページの幅960pxを基準にして、設計するグリッドデザインを紹介しているサイトです。

960 Grid System
デモページ

960pxを基準にする理由としては、下記の2つが挙げられています。

最近のモニターは1024×768の解像度をサポートしており、960pxを表示するには十分である。
960という数字は、2, 3, 4, 5, 6, 8, 10, 12, 15, 16, 20, 24, 30, 32, 40, 48, 60, 64, 80, 96, 120, 160, 192, 240, 320, 480と多くの数字で区切ることができ、フレキシブルにグリッドの設計を行える。
デモページでは、左右に10pxのマージンを持ち、カラム間のマージンを20pxにし、60pxをベースに12カラムと、40pxをベースに16カラムの2種類のレイアウトを見ることができます。

またサイトでは、資料としてHTML+CSSをはじめ、PDFファイル、PSD・PNG・VSDファイルが一式でダウンロードできます。

グリッドシステムの機能
情報の反復
グリッドシステムを用いて、一定の場所に一定の情報・機能・サービスの要素を繰り返し配置することにより、反復機能を生み出します。

情報の構造
グリッドシステムを用いて、さまざまな情報・機能・サービスの要素を一定の間隔・空間で配置することで、情報の構造を明確にします。

情報の伝達
グリッドシステムは、情報の受け手である利用者に、意味のある情報を気軽に取得できるよう伝達します。
配置する情報同士の空間を適度に設定することにより、視覚的な誘導効果を生み出し、情報の分類・区別、見出しや図版・テキストの可読性を確保します。

グリッドシステムをサイトに導入するメリット
アイデンティティの確立
ブランドロゴなどのCI（コーポレートアイデンティティ）の要素は、一定の場所に繰り返し配置します。
こうしたレイアウトの統一をはじめとする反復を利用したデザインは、サイトの全ページを通じて一貫したビジュアルアイデンティティを確保することができます。

また、この反復の存在自体がサイトのアイデンティティとなり、サイトの全体感・信頼感を利用者に対して感じさせる基盤となります。

利用者の学習効果
上記のようなスタイルガイドを設けることにより、利用者はサイトのどのページへ移動した場合でも、どの場所にどういった情報・機能・サービスが配置されているかを無意識のうちに認知・学習できます。
一度、サイトの配置ルールを認知・学習してしまえば、利用者はサイトでの行動において迷いを持たなくなります。

制作者の思考支援
グリッドシステムは、制作者にとって場所ごとにあらかじめ決められた情報・機能・サービスを考慮したデザインをするため、自由に配置する場合と比べ短時間で行うことができます。
グリッドシステムは、制作者の体系的な情報の整理思考を補助する効果を持っています。

制作品質の維持
グリッドシステムを採用すると、複数の異なる制作者がかかわる場合でもサイトのデザインに一貫性を保たせることができ、デザインクオリティが維持されやすくなります。
また、異なるコンテンツ同士のデザインクオリティのばらつきをなくし、新たなコンテンツの制作に要するデザイン作業を軽減し、サイト管理の省力化にもなります。

Y CombinatorのHacker Newsの場合
公式：
(p - 1) / (t + 2)^1.5

解説：
投票数を経過時間因子で除算。

pはユーザーからの投票数（ポイント）。
tは投稿から経過した時間（単位は時間）。

投稿者自身の投票を無効にするため、pから1を引く。
経過時間因子は（投稿から経過した時間 + 2時間）の1.5乗とする。

出典：ポール・グラハム氏（Hacker Newsの創設者）

Redditの場合
公式:

記事の投稿時刻をA、2005年12月8日午前7時46分43秒をBとし、その差tsを秒単位で求める。

支持票Uと反支持票Dの差をxとする。

次の条件によりyの値を-1、0、1のいずれかとする。

xの絶対値（|x|）と1のうち、大きい方をzとする。

次の関数f(ts,y,z)の値を計算し、順位を決定する。

解説:

まず、2005年12月8日午前7時46分43秒という時刻は、記事が投稿されてからの経過時間を相対的に定めるための定数だ（サイトを立ち上げた時刻らしいけど、確かめようがなかった）。記事の投稿時刻からこの定数を引いた値がtsだ。tsは記事をトップページから引き下ろす力として働く。

yは支持票と反支持票のバランスを示す。

45000は12.5時間を秒に直した定数で、ytsと組み合わせることにより、記事が投稿されてから時間が経つほど得票の影響力が減じる。

log10も得票の重み付けを行うもので、後から得た得票よりも初めの方に得た得票を重く扱う。この場合、最初に得た得票10件は、11件目から101件目の得票の合計と同じ重みを持つ。

出典：code.reddit.com、Redflavor.comおよびHacker NewsのユーザーAneesh氏。

StumbleUponの場合
公式：

最初に該当ページをStumbleしたユーザーについて
(
そのユーザーがもっているオーディエンススコア
÷
そのユーザーがそのドメイン名にStumbleで訪れた回数
)
+
そのページをプラス評価した各ユーザーについて
(
(
オーディエンススコアの1パーセント
÷
そのユーザーがそのドメイン名にStumbleで訪れた回数
)
+
オーガニックボーナス
-
知り合いからのプラス評価
)
-
そのページをマイナス評価した各ユーザーについて
(
各ユーザーのオーディエンススコアの1パーセント
+
オーガニックボーナス
)
+
N
解説:

オーディエンススコアとは、StumbleUponユーザーそれぞれがもっている点数（力）で、ファンの数や評価の数などによって計算される。

最初にそのページを評価したユーザーの「力」（最初に該当ページを見た人のオーディエンススコアを、そのユーザーがそのドメイン名をStumbleした回数で割ったもの）が、その後に続くStumbleユーザーの力の合計に加わる。

その他のユーザーの力は、プラス評価したユーザーとマイナス評価したユーザーそれぞれについて、最初のユーザーよりも少ない割合で加算または減算されていく。オーガニックボーナスとは、StumbleUponのツールバーを使用して“たまたま”そのページを訪問して評価した場合に与えられる既定のボーナスだ。

公式の末尾にあるNは、「セーフティ変数」だ。上記の推定アルゴリズムに柔軟性を持たせる。値は乱数で決定する。

出典: Venture Skills Blogのティム・ナッシュ氏。もっと詳しい情報についてはこのブログを見てほしい。

Del.icio.usの場合

公式：

ポイント = (直近3600秒の間に該当の記事がブックマークされた回数)

解説：

Del.icio.usの「Popular」ページにおけるランクは、ポイントの大小で決まる。そのポイントとは、直近1時間（3600秒）にブックマークされた回数だ。この回数が多いほど、ポイントも高い。各ブックマークは1ポイントとして加算される。

出典: Del.icio.usのPopularページに関する僕自身の長期的観察に基づく。

アルゴリズムは悪用させない（Digg.comの場合）
Diggの場合は少し様相が異なる。ここまで説明してきたサイトに比べ、Diggは透明性に欠ける。裏をかかれるのを恐れていて、そのためアルゴリズムを秘密裏に開発した。中身はどうやら競合サイトよりもずっと複雑らしい。

少なくとも、Diggのアルゴリズムには次の要素を考慮していると思う。

投稿時間
投稿カテゴリ
投稿者のDiggにおけるオーソリティ
投稿者のウェブサイト全体における活動
投稿者の友人とファン
後続Diggユーザーのオーソリティ
後続Diggユーザーの友人とファン
後続Diggユーザーの地理的位置情報
後続DiggユーザーのHTTP参照元
ソーシャルメディアに関する専門家の方々の意見を聞きたい。この記事の内容をもっと良くするには、どうすればいいのかアドバイスが頂ければと思う。個人的に僕に連絡を取りたい場合は、電子メールか、Linkedinか、Twitterを通じて、いつでもどうぞ。それではまた

All Recipes
http://allrecipes.com/
さじ加減 :
All Recipesをシェフに例えるなら: お母さん
美味い！
ポストカードサイズにプリントアウトでき、メモを見ながら料理という習慣が考慮されている - Chris
大切な隠し味のコリアンダーを買うのを忘れた！ってことがなくなる「買い物リスト機能」- Paul
「今週のコック」はユーザの参加価値を高めてくれる - Christophe
各レシピの評価が明快で比較しやすい - Eiko
国によって違う計量単位の切り替えができる - Chris
冷蔵庫の中身と相談できる優れた材料検索 - Paul
レシピごとに栄養情報を自動的計算できる - Christophe
やや塩不足
ユーザー発生型のレシピはレパートリーに限界がある - Chris
リンクが随所にありすぎて、食欲をなくす - Paul
サイト全体のオレンジ系統色は食べ物の色と近すぎる - Chris
トップエリアのデザインが寂しく、ページが持ちこたえられていない - Christophe

Cook Pad
http://www.cookpad.com
さじ加減 :
CookPadをシェフに例えるなら: 近所の奥さん（庶民的で親しみやすく、手作り感があるけどあか抜けない。）
美味い！
写真を多用した手順説明がわかりやすい - Eiko
お気に入りのユーザーのレシピが購読できる - Christophe
レシピを使って報告をする「つくれぽ」は、ユーザー間でのコミュニケーションとレシピの補足ヒントになっている - Eiko
やや塩不足
あか抜けない雰囲気がレシピの足を引っ張る場合も - Eiko
検索の絞り込み項目が少ない - Christophe
評価の高いレシピの検索にお金がかかる - Eiko
ユーザー発生型のレシピはオリジナル性に不透明さがつきまとう - Eiko

Food Network
http://www.foodnetwork.com/
さじ加減 :
Food Networkをシェフに例えるなら: Rachael Ray（アメリカのTVタレントシェフ、親しみやすいが味がない）
美味い！
材料や分野、または料理の種類で徐々に絞り込んでいく検索 - Chris
よく検索されるキーワードが表示されて便利 - Eiko
やや塩不足:
太ったjavascriptとFlashは、ブラウザーが心不全を起こしそう - Christophe
レシピページのヒエラルキーがなく、読みづらい - Chris
退屈な写真 - Chris

Open Source Food
http://www.opensourcefood.com/
さじ加減 :
Open Source Foodをシェフに例えるなら: ティーンエイジャーの弟（お母さんより実験的だけど、大勢にはできないし、火事になっちゃいそう）
美味い！
料理上手な異性と出会えるかも - Paul
個人ページに人柄が感じられるのがいい - Christophe
クリエイティブコモンズの設定があって、レシピを共有できる - Chris
使いやすいコメント機能 - Christophe
大きい写真 - Paul
レシピ以外でTipsの場で意見交換ができる - Chris
整頓されたインターフェースがレシピを際立たせている - Paul
やや塩不足
黒色が料理をおいしそうに見せてない - Eiko
シンプルなキーワードとジャンルの検索しかできない - Chris
「西洋料理」だけでも39ページもある。もっと内容を絞り込めるといい。「Sexyレシピ」「調子が良くなるレシピ」「子供を眠たくさせるレシピ」とか。 - Paul
レシピの新旧がわからない - Paul
おいしそうなデータなのにサーチエンジンで切られていない - Christophe

Epicurious
http://www.epicurious.com/
さじ加減 :
Epicuriousをシェフに例えるなら: Gordon Ramsay（ロンドンのカリスマシェフ、洗練されていてパワフルだがちょっとテンションが高すぎ）
美味い！
魅力的で鮮やかなページごとにローテーションする色彩計画 - Christophe
携帯に転送できるので、レシピを八百屋さんに持っていける - Chris
アイコンが美しい - Eiko
メモが書けるので、自分のアレンジを残していける - Chris
ビデオはコンテンツが豊富で、広告がそれに合っている - Christophe
やや塩不足
「My recipe box」のような大切なリンクが、面倒なドロップダウンメニューにしまい込まれている - Chris
スクロールしないと、材料と手順が確認できないのが不便 - Eiko
トップページに機能を詰め込みすぎて、何から食べていいかわからない感じ - Christophe
ユーザー評価が微妙、何人が評価したのかが分かりにくい - Eiko

95 美年達(北海道:2008/07/30(水) 20:12:50.79 ID:2HQW4ept0

余計な機能ｲﾗﾈ、iepgとかＧコードとかｲﾗﾈ、U局地アナBSアナ表示ｲﾗﾈな俺視点のレビュー

・yahoo　http://tv.yahoo.co.jp/
軽さがウリだったのに余計な事して重くなった。my番組表でチャンネル選んでカスタマイズ表示できるのは○
・MSN　http://tv.jp.msn.com/
軽い。ポップアップは良い、色分け薄すぎ、BSCS切り替えに2操作必要なのがマイナス
・ニッカンスポーツ　http://tv.nikkansports.com/
前のが良かった。カスタマイズできなくなった。出演者情報邪魔
・テレビ王国　http://tv.so-net.ne.jp/chart/
番組タイトルのみでシンプル。ただちょっと色が目に悪い。特集や中身知りたい時には不満
・infoseek　http://tv.www.infoseek.co.jp/
軽い、シンプル、色も見やすいが出演者情報が邪魔。1時間毎に一番上の番組表が更新されるのは◎
・goo　http://tv.goo.ne.jp/
色分けが見やすいが出演者情報がやはり邪魔。何より上の広告や余計なのが大杉ていちいちスクロールがだるすぎる
・ONTVJAPAN　http://www.ontvjapan.com/
いろいろカスタマイズは出来るが時間帯によってはやたら重い。
・テレビジョン　http://www.television.co.jp/
結構先の番組表が見れるが、何よりも時間幅表示が選べるのは地味にとても便利だ
・ネットdeナビ番組表　http://www.rd-style.com/tv/
広告が無い。軽さとシンプルさでは最高レベル。横長だが地上波CSが1画面で出るのは便利すぎる。配色がややマイナス

ビジネスパーソンの資格として人気の高い経営学修士（MBA）。だが、2年間の授業料は、日本国内の大学で200万円以上、海外に留学すると生活費などを合わせて最低でも1000万円がかかります。EQパートナーズでは、MBAで学ぶカリキュラムからエッセンスを取り出した「1-Day MBA」（1日1科目を学ぶMBA、商標登録申請中）という研修コースを作り、企業に提供しています。このコラムでは、「1-Day MBA」で取り上げているMBAの最も重要な部分を解説します。

時間をかけずMBAのエッセンスを学ぶ
【1時間目】オリエンテーション
2008年7月25日
MBAで学ぶカリキュラムからエッセンスを取り出した「1-Day MBA」（1日1科目を学ぶMBA）。さらに、その最も重要な基礎を解説していきます・・・

ところがMobissimoではいくつもの実にスマートな機能が提供されている。今までだったら旅行代理店の係員に相談しなければならなかったような旅行のオプションに関する情報が得られるのだ。たとえば、通常の検索結果に加えて、（いちいち改めて条件を指定しなくても）「いちばん安い直行便」、「いちばん安い出発日」、「いちばん安いビジネスクラス」などの情報が表示される。しかももし出発地と目的地の間に列車が通っていれば、Mobissimoは飛行機に加えて列車情報も表示してくれる。場合によるとそのほうが速く、安く目的地に着ける可能性があるわけだが、ユーザーはいちいち列車の時刻表を別途調べる必要がない。

さらに便利なことに、Mobissimoは関連した目的地への最安便を表示してくれる。たとえば、ポーランドへの旅行を検索した場合、他の東ヨーロッパの都市への価格がずっと安ければ、それも表示される。あるいはビーチリゾートへの航空便を検索した場合、Mobissimoは別のビーチ（1000マイル離れていても）の情報も検索する。（スキーリゾート、ワインの産地、etcの場合同様）。ワルシャワを検索するとき、われわれは普通「プラハの方がずっと安いかもしれない」と思って検索したりはしないから、これはたいへん便利な機能だ。

また、ちょっと休みを取って遊びに行きたいという場合、ギャンブル、ゴルフ、ワイン、ビーチなど、やりたいことによって直接検索ができる。Mobissimoは旅行の目的地に関してサードパーティーの情報を取り入れるためのウィジェットも用意している。天気やFlickrの写真、それから（近々）旅行ガイドが左側のサイドバーに表示される。

モバイルショッピングサイトのTOPページ調査　商品画像は多くすべき？少なくすべき？
【モバイルリサーチ】企業のモバイルサイトへの投資額は2極化の傾向
【モバイルリサーチ】公式サイト派？勝手サイト派？企業のモバイルサイト保有動向
【モバイルリサーチ】モバイルショッピングページの効果的なレイアウトとは？
【携帯フィルタリング意識調査】9割以上の保護者が「フィルタリングサービスは必要」と回答
【携帯フィルタリング意識調査】子供の8割が「フィルタリングを解除してほしい」と回答
【携帯フィルタリング意識調査】悪質サイトへのアクセスに保護者の6割が不安
【モバイルリサーチ】消費の“主役”である、22歳～39歳女性の携帯電話利用動向
【リサーチ】10～30代男性で株取引経験者の4人に1人は「携帯サイトでの取引」を経験
【モバイルリサーチ】モバイルショッピングサイトの利用動向、1位は楽天
【モバイルリサーチ】モバイルショッピングのピークは「暇つぶし時」と「寝る前」
「87%が大きな画像を支持」　ユーザビリティ調査モバイルECサイト編