素晴らしいロゴをデザインするための45の法則 | CREAMU
ロゴをデザインしたい。 そんなときにおすすめなのが、『45 Rules for Creating a Great Logo Design』。素晴らしいロゴをデザインするための45の法則だ。 以下にご紹介。 3つ以上の色を使わない。 絶対に必要というわけでないものはすべて除外する。 文字はあなたの祖母でも簡単に読めなければならない。 ロゴとはっきり認識できなければならない。 ロゴにユニークな形やレイアウトを取り入れる。 あなたの親や配偶者がデザインについて思うことを徹底的に無視する。 3人以上の人にロゴが魅力的に見えるかを確認する。 有名なロゴの要素を使ってオリジナルだと主張しない。 どんな場合でもイラスト集を使わない。 ロゴは白黒でもかっこよく見えるべき。 逆さにしても認識できること。 リサイズしても認識できること。 ロゴがアイコンやシンボル、テキストを含む場合、それぞれ良さが引き立つよう
第13回 Webページで読みやすいテキストとは：ITpro
今回のポイント 1行あたりの文字数の目安 1段落の文字数の目安 段落に含む文字数 行間調整の考え方 字間調整を使ったロゴ風味見出し 日本語というのはもともと縦書き文化です。文字も筆で縦書きしていくときに書きやすいように作られています。現在PC画面上で見るフォントは，活字印刷物のフォントとは違い，横書きで読みやすいようにもともとの字体から若干形を変えられています。それでも起源である縦書きの形を完全に壊すことができないので，やはり横書きでは読みづらいようになっています。 日本人が苦痛を感じることなく読める横書き1行あたりの字数は20字＋α程度だと言われています。意識して雑誌などを見るとたいていが!)25文字から28文字程度です。用紙，つまり本のサイズがA4を超えるような大判になると，1ページを左右2段組に分けて25～28字程度に調整されています。 一方，縦書きの場合には識別許容量はグンと増加し
手動と自動のバランスがサイトの質へと繋がる
カテゴリをエントリーのタイプと見なし、それぞれのエントリーに関するキーワードをタグとして書き込むという分類方法は多くの方にとってもしっくり来たといえるかもしれません。しかし、まだ考える余地が幾つかあるといえます。その代表格にあたるのが「タグの役割を考えた見せ方」でも話題になった「Follow-up」という分類。 Follow Up はサブタイプ Toruさん ArticleのFollow Upならば、ArticleとFollow Up。AnnoucementsのFollow Upならば、AnnouncementsとFollow Up。と言う具合に、両方にタイプ付けはどうでしょうか？個人的にはFollow Upは必要無いのでは？ Toruさんが提案しているように、２つのタイプをチェックしておいたほうが良さそうです。また、「Follow Up」のリンクをクリックして、そのタイプのみを読むという
富士通さんの「キッズコンテンツ作成ハンドブック」のペルソナを見て: DESIGN IT! w/LOVE
不確実な時代をクネクネ蛇行しながら道を切りひらく非線形型ブログ。人間の思考の形の変遷を探求することをライフワークに。 先日公開された富士通さんの「キッズコンテンツ作成ハンドブック・ペルソナマーケティング編」のペルソナを見て思ったことをすこし。 富士通キッズ キッズコンテンツ作成ハンドブック：http://jp.fujitsu.com/about/kids/handbook/ まず、思ったのは「んっ、なんだ？ このペルソナ」ってことです。 みても、何のためにペルソナをつくったのかわからなかったわけです。 いったい、これをどう使うんだろ？って。 で、最初は出来がよくないのかなとか勘ぐったりしました。 でも、そうじゃないんですよ。 他人がみてわかるペルソナのほうがおかしい自分が関わっていないデザインのためのペルソナをみてもわからないのがとうぜんなんです。 だって、ペルソナに描かれるのはデザインの
Pagination Gallery: Examples And Good Practices | Design Showcase | Smashing Magazine
Structure and hierarchy reduce complexity and improve readability. The more organized your articles or web-sites are, the easier it is for users to follow your arguments and get the message you are trying to deliver. On the Web this can be done in a variety of ways. Structure and hierarchy reduce complexity and improve readability. The more organized your articles or web-sites are, the easier it i
ペルソナで「普通のユーザー」をつくろうとしてはいけない: DESIGN IT! w/LOVE
不確実な時代をクネクネ蛇行しながら道を切りひらく非線形型ブログ。人間の思考の形の変遷を探求することをライフワークに。 昨日も「ペルソナを使ってWebデザインの評価を行う」でペルソナに関するエントリーを書きましたが、今日もちょっとペルソナに関して気づいたことがあったので、またまたペルソナ関連の話題で。 気づいたのは、ユーザー調査に基づいて複数の実在のユーザーからペルソナをつくる場合、気をつけないと「そんな人いねえだろ」っていうペルソナができてしまうということです。 もちろん、実際にいないような人のペルソナをつくって、それをデザインに活かそうとするのは無駄です。 だって、実在しない人がデザインされたものを使うということは永遠に訪れないわけですから。 普通の要素だけを切り張りしただけのペルソナ実在のユーザーを対象にしたコンテキスチュアル・インクワイアリーによる調査を行った結果のユーザー・データを
自治体サイトWebアクセシビリティ調査 | 有限会社ユニバーサルワークス
miCheckerなど3つのチェックツールを使ってみた 自治体サイトと言えばユニバーサルワークス。自治体サイト調査のユニバーサルワークスが、毎年9月1日にお届けする、都道府県、政令指定都市がドキドキする、Webアクセシビリティ愛好家がニヤニヤする、「自治体サイトWebアクセシビリティ調査」です。 21回目となる今回のテーマは「miCheckerなど3つのチェックツールを使ってみた」です。世の中にさまざまなウェブアクセシビリティチェックツールはあれど、ツールだけでウェブアクセシビリティ検証を完結させることはできません。チェックツールと目視とで評価が異なるのか、チェックツールによって違いは生じるのか、公的機関の場合miCheckerで「問題あり」がゼロであれば良いのかなどについて考えるきっかけとなれば幸いです。 ➡ 調査概要
MOONGIFT: » ついに登場！CSSフレームワーク「Blueprint」:オープンソースを毎日紹介
誰かがきっと作ってくれると思っていた。 prototype.jsのようなライブラリを利用するのは、便利な機能が多いという事もあるが、各ブラウザ間での相違を吸収してくれるという点も大きい。 その点において、CSSもまた各ブラウザ間での表示の差異が大きい。そこで試してみたいのがこれだ。 今回紹介するオープンソース・ソフトウェアはBlueprint、ブラウザ間の描画差異を吸収して簡単にマルチカラムを実現してくれるCSSライブラリだ。 Blueprintはヘッダ、コンテンツ、サイドバー、フッターのようなテンプレートをクラス指定するだけで簡単に作成できる。デフォルトのフォーマットはリセットされているので、ブラウザ間の違いが出るマージンやパディングの差異も吸収してくれている。 また、印刷時のCSSも用意されている。これを使えば印刷時やプリンタ経由でのPDF作成時に綺麗なものが仕上がるようになる。今後の
14 Tab-Based Interface Techniques | Developer's Toolbox | Smashing Magazine
A module tab is a design pattern where content is separated into different panes, and each pane is viewable one at a time. The user requests content to be displayed by clicking (or in some instances hovering over) the content’s corresponding tab control. A module tab is a User Interface (UI) design pattern where content is separated into different panes, and each pane is viewable one at a time. Th
Welie.com - Patterns in Interaction Design
A Pattern Library for Interaction Design This site contains a lot of best practices in Interaction Design. Over the years I have collected examples and insight on their applicability that I share with you here on this. So there is really no 'original' design to be found here, sorry. It has all been done before... See it as a reference or basic 'toolkit' you can use when design user experiences. It
HOWTO: spruce up your search box with CSS and a background image � d’bug
Posted by Brian Posted on August 13th, 2007 View Comments Very few designers appreciate the aesthetic of a text input field, and styling form fields cross-browser on any Web site can be a tedious and frustrating experience. The compromise typically involves applying a simple colored border and background to the fields. I think this is the right approach for Web sites and applications that are form
ヤコブ・ニールセンの考えをまとめたWebユーザビリティガイドライン::ホームページ制作::NPO法人しゃらく
ヤコブ・ニールセンの考えをまとめたユーザビリティガイドライン ユーザビリティのグル、ヤコブ・ニールセン氏の考えや調査を元にユーザビリティガイドラインを作りました。 デザインやコーディングをしている際に、このガイドラインを元に自分のデザインを一度チェックしてみるのもよいかと思います。 TRANS - ヤコブ・ニールセン氏の考えを元に、ユーザビリティガイドラインを作った。
コマンドリンク
アプリケーションで用いるコマンド（命令）は、ボタンでもリンクでも表現できるようになってきたので、どちらが適しているかを決めるには、昔よりも多くの説明が必要とされる。しかしながら、重要なコマンドにはやはりボタンを用いるのが一番だ。 Command Links by Jakob Nielsen 2007年5月14日 今よりも物事がシンプルだった時代には、ウェブサイト向けガイドラインの数々が存在し、その一方でアプリケーション向けガイドラインの数々が存在していた。そして両者は明らかに別物だった。たとえば、ユーザーの選択肢を表現するためには、以下のような別々のルールが示されていたのだ： ウェブサイトでは、リンク（アンダーラインを引いた色つきテキスト）を用いてナビゲーションを提供すること。 アプリケーションでは、メニューやボタンを用いて機能を提供すること。 ウェブサイト向けとアプリケーション向けのガイ
Web読解のユーザビリティ測定
※ユーザのウェブの読み方に関するJakob Nielsenのコラムへの補足記事 ウェブサイトの各バージョンのユーザビリティは、5つの面から測定した。 タスク時間。ユーザが、そのコンテンツに関する特定の問題に対する、回答を探し出すのに要した時間。 エラー。決まった答えのある問題に対して、ユーザが誤答した回数をパーセンテージで表したもの（ある問題は、一番気に入った観光地をユーザに選んでもらうというものだった。これには決まった答えがない。こういった問題では誤答は算出しなかった）。 記憶。サイト利用後にユーザに出された試験から得られた2つの数値。短期記憶は、5つの選択肢式設問に関して、正解数から誤答数をマイナスした数字をパーセント表示した。長期記憶では、テスト後にきちんと思い出せたアイテム数から思い出せなかったアイテム数を差し引き、パーセント表示した（ユーザには、このサイトに出てきた観光地をできる
Webデザインで最も愛されているフォント16選『16 Best-Loved Font Bits In Web Design』 | CREAMU
Diary Webデザインで最も愛されているフォント16選『16 Best-Loved Font Bits In Web Design』 Webデザインでよく使われるフォントはなんだろう。 そんなときにおすすめなのが、『16 Best-Loved Font Bits In Web Design』。Webデザインで最も愛されているフォント16選だ。 以下にご紹介する。 1.Helvetica, Helvetica Neue, Arial 2.Verdana 3.Georgia 4.Trebuchet MS 5.Century Gothic 6.Lucida Sans Unicode, Lucida Grande 7.Palatino 8.Garamond, Baskerville, Caslon 9.Univers Condensed, Linotype Univers 10.Myriad
MOONGIFT: » 不要なCSSの洗い出し「CSS Redundancy Checker」:オープンソースを毎日紹介
CSSははじめこそきちんと定義しながら進めるのだが、修正が重なったり、日々の運用の中で徐々に肥大化していく。HTMLと同じで多少間違っていたり、不要な情報が紛れ込んでいてもそれなりに表示されるので気にならないのだ。 だが不要な情報が紛れ込んでいると、ちょっとした修正が全く無関係と思われる場所に影響を及ぼしたり、管理しきれなくなってくる。そこで使ってみたいのがこのソフトウェアだ。 今回紹介するオープンソース・ソフトウェアはCSS Redundancy Checker、不要なCSSチェッカーだ。 CSS Redundancy CheckerはRubyで作られている、CUIベースで動作するアプリケーションだ。また、gemでhpricotをインストールする必要がある。そのため、若干敷居が高いかも知れないが、便利なアプリケーションだと思うのでぜひトライしてみて欲しい。 使い方は簡単で、CSSファイル
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://www.openvista.jp/archives/note/257/?257/
http://www.gucci.com/jp/index2.html
Stripe Generator - ajax diagonal stripes background designer
blueprintcss - Google Code