Webデザイナーに役立つWebデザインのネタ、Webデザインに関連するテクニックやツールを紹介しています。随時人気の話題だけをピックアップしているので、Webデザイン業界の動向をまとめ読みするのにも最適です。Webデザイナーの日々のWebデザイン業務にどうぞお役立てください~。
ライフハッカー(日本語版)の記事の最後に関連記事が表示されていますが、これがいろいろうまい、というお話です。↑ これね。まず、既読かどうかをCSSで判定して、読んだものにはチェックがつくようになっています。人は何かとコンプリート感を目指しますからね。チェックがついていないものにはチェックをつけたく... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
ハイパーテキストリンクをデザインする上で知っておきたい基礎知識から、実用的なチップス、やってはいけない間違いなど、すぐに役立つテクニックをSmashing Magazineから紹介します。The Definitive Guide To Styling Web Links以下は、各ポイントを意訳した... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
ウェブサイトの表示にかかる時間(読み込み)を計測することができるサイトやツールを調べてみました。こうしたサービスを利用すると、自分のブログ、自社のサイトの表示はユーザが見ると、速いのかしら、遅いのかしら、というのを客観的に見られるでしょうか。自分が関連しているブログなりサイトなりを繰り返し見ている... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
トップページに多くの要素を盛り込まねばならず、情報の整理に悩んでいる方も多いのではないでしょうか。そんな時、ユーザの文脈を考慮することで情報整理方法が見えてきます。 上の画面例はBtoB向け製品を主に扱っているメーカーサイトのトップページです。各製品カテゴリへのテキストリンクがトップページに配置さ... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
|
55 Spectacular Login Form Designsすぐれたログインスクリーンを 55 つも集めたリンク集。特に目立つのがページの中央に大きくログインフォームを表示させているのが多数を占めています。まるで、OS やデスクトップアプリケーションのようなログインスクリーンのようですね。今... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
ホワイトの背景にブラックの文字、ブラックの背景にホワイトの文字の組み合わせがベストでしょうか?ウェブデザインにおいて、背景と文字の色の組み合わせ方で可読性を考慮するきっけかになるスタディをDevloungeから紹介します。ホワイトとブラックを使用したコントラストのスタディです。 上段の1と3はホワ... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
ウェブサイト 実はユーザー中心設計やユーザビリティ、インターフェースについてちゃんとまとまったサイトは国内には少数です。 ここに挙げたサイトはどれも大変充実したものだと思います。 ※残念ながら、海外の記事を紹介しているブログでよいものは見つからず。 劣化コピペサイトを紹介するのも気が引けるので割愛... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
今日は、Webページのデザイン、特にページを開いたときにまず見える「ファーストビュー」とスクロールの関係について、ユーザーテストの調査データから考え方やちょっとしたノウハウを。ファーストビューで重要なメッセージが全部見えるようにこういうデザイン指示をすることはありませんか? ユーザーはなかなかスク... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
ウェブサイト制作において、多くの情報をいかに整理してユーザに伝えるかは重要なポイントの1つです。よく使われる方法として表組みがありますが、今回は実際の事例をもとにしたケーススタディを通じて、ユーザを混乱させない表組みのコツをご紹介します。表1はよく見かける表組みの例ですが、実際にユーザの立場に立っ... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
今や月間で訪れるユーザーが800万人を超えるという日本最大の料理サイト「クックパッド」を創業した佐野陽光氏。Rubyをいち早く採用するなど、先進の技術を積極的に活用しているテクノロジーカンパニーを率いている人物だ。クックパッド株式会社 代表執行役社長 佐野 陽光氏書籍『600万人の女性に支持される... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
jQuery Form Tips Plugin フォーム要素にうっすらデフォルト値を入れてヒント表示できる「jQuery Form Tips」 フォームにデフォルト値を入れておくことで利用者が何をいれていいのか、というのが直感的にわかり、かつスペースもとらないのでよく使われる手法ですが、実装も超簡... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
ここのところ、Google App Engine上でアプリを作っている私だが、iPhoneアプリとかを作り慣れている私としては、単純なHTMLページの組み合わせでUIを作るというのでは面白くない。そこで、サーバーがModel、クライアントがViewとControllerというアーキテクチャととこと... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
2010/01/07現在ロンドンの地下鉄の案内図や路線図で全面的に使われているアルファベットフォント「New Johnston」をデザインしたのは実は日本人――。こう言ったら驚くだろうか。その日本人とは、イギリス在住のグラフィック・デザイナー、河野英一氏だ。河野氏はまた、Windows Vista... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
“文具王”の異名を持ち、文具メーカーでユニークな商品を生み出し続ける高畑正幸氏が、最新文具の奥深〜い世界をナビゲートする。今回は、収納・携帯に便利なハサミ、「ペンカット」を紹介。ペン型のハサミでカットするから、ペンカット。意外にも大人に人気のペン型コンパス「ペンパス」に続く、ペン型文具シリーズの第... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
本実践メモでも以前に取り上げたように、ここ数年、横幅900px以上を採用するサイトが増えてきています。画面横幅を900px以上にするメリットとデメリット。右端が欠けることに注意横幅の拡大によって、情報を掲載できるスペースは拡大し、実現できる表現の幅も広がります。 もちろんそれらは喜ばしいことですが... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
IE・Firefox・Safari・Google Chrome・Operaといった各ブラウザのウィンドウを好きなサイズに変更することができるかなりお役立ちなフリーソフトがこの「Sizer」です。ブラウザ以外にもWindows上で動くなら大抵のソフトに適用することが可能で、通常はリサイズできないよう... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
ニュースGoogle、ページの表示範囲シミュレートツール「Browser Size」発表「何%の人がページのどこまで表示できるか」を視覚的に見せてくれるWebデザイナー向けのツールがGoogle Labsに登場した。2009年12月17日 14時48分 更新米Googleは12月16日、Webペー... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
年の瀬が迫り、今年も残りわずかとなりました。ちまたではクリスマスや年の瀬の準備など、イベント事で賑わっています。そこで今回はイベント行事で幹事を務めることが多い人に、ぐるなびとFooMoo by HotPepperという主要グルメポータルサイトの忘年会特集を見て忘年会で利用するお店の候補探しをして... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
ボックス要素をレンガ状に綺麗に整列させる「jQuery Masonry」が凄いです。 普通、高さの違うボックス要素を float とかで並べると次のような、どう見ても見れない崩れたデザインになってしまいます。 が、今回紹介するjQuery Masonry を使うと、次のように、綺麗にテトリスっぽく... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|
登録や申し込みページの入力フォームにおいて、郵便番号を入力すると住所欄が自動入力される機能は、ユーザの入力負荷を軽減する便利な機能です。実はこの機能、正しく郵便番号を入力してもある条件下ではエラーとなってしまうことがあることをご存知でしょうか。今回は入力フォームでの「郵便番号」の意外な盲点について... [ 詳細を見る ] [ 関連 ] [ ニコニコ風 ]
|