もう一度言います。タイポグラフィはウェブデザインの基礎です

あなたは何年もこの質問を探し続けており、夢の中でこの質問を聞くこともよくあります。そして、あなたはインディ・ジョーンズのように答えを求めて旅をしています。答えが分かると、天井から紙吹雪が降ってきて、バンドがあなたの好きな曲を演奏し始め、愛する人から甘いキスまで受けます。それで、これはどのような問題なのでしょうか?

さて、Webデザインの秘密は何でしょうか?

これは難しい質問であり、答えがないかもしれません。 2006 年に Oliver Reichenstein は、「Web デザインの 95% はタイポグラフィである」と書いています。タイポグラフィを気に入った人もいれば、気に入らなかった人もいました。

ウェブデザインがタイポグラフィに大きく依存しているのなら、他のことを学ぶ意味は何でしょうか? タイポグラフィの要素を理解すれば、上手にできるようになります。

もちろん、タイポグラフィはフォントの選択だけではありません。Typekit、Webtype、Fontdeck、Google Web フォントなどの @font-face テクノロジーやサービスの登場により、タイポグラフィのスキルは向上しています。望めば、1 つのフォントだけで一生使える優れたデザインを簡単に作成できます。これは、ずっと昔、Photoshop をガイドとして使用していなかった人々 (デザイナー) が行わなければならなかったことです。むしろ、フォントの選択肢が増えると状況は悪化します。選択肢が増えると、創造性や美的感覚を高めることが難しくなるからです。

おもちゃが多ければ、楽しさも増えますよね? その方向に進みたいなら、全力を尽くして、実現するために必要なことは何でもしてください。私は使用されているさまざまなフォントを見るのが大好きで、自分の Web サイトで新しいフォントをうまく使用できる人を尊敬しています。しかし、開発ソリューションが一般に公開されると何が起こるかを何度も見てきましたが、それは良いことではありません (Myspace など)。また、Typekit では、フォントを使用する前にタイポグラフィを使用して本を読むことができます。ユーザー契約がなければ、これは素晴らしいことです。もしそうであれば、サイトは 10 倍良くなります。

私は皮肉を言うつもりはなく、ほとんどのサイトではそれが知っておく必要があるすべてだと言うつもりはありません。気に入っているウェブサイトのデザインをすべて見直し、画像をすべて削除してから、「テキストと空白だけのウェブサイトはどうなるだろうか」と自問してみてください。デザイナーが「テキストはインターフェースである」と言うとき、それは本心です。 iA サイトは優れた例です。

私のお気に入りの作品の一つに「A Working Library」があります。テキストを使ってインターフェースを表示しており、適度な余白があり、テキストのデザインも非常に優れています。

このようなデザインは退屈でつまらないと考え、デザインはもっとポップなスタイルであるべきだと考える人もいます。最終的には、デザインの残りの部分はおそらく、無関係な視覚的な趣味によって占められることになるでしょう (デザイン自体には関心がなくなるでしょう)。そのため、デザインの最初の 95% を完成させる必要があります。しかし、あなたが今この記事を読んでいるウェブサイトは、画像に頼らずに視覚デザインを美しくできることをうまく示しています。

画像をまったく使用せずに素晴らしい Web ページをデザインすることは可能です。おかしいように聞こえるかもしれませんが、可能です。私はこれが事実であるべきだとは思っていませんが、タイポグラフィと空白だけで優雅さを実現できるのであれば、画像、ビデオ、その他の効果を挿入して優れたものを作り出そうとしない理由はありません。

画像を使用する場合、アイコンのように実際に何かを伝える画像ではなく、注意を引くためだけに使用します。時には、一枚の写真が千の言葉に値することもあるので、画像を使用するのが最適です (ただし、空白の使用も考慮する必要があります)。ここでは、デザイン全体に活気を与えるためにタイポグラフィを重視した美しい Web サイトの例をさらに 2 つ紹介します。最初のウェブサイトは Blake Allen Design、2 番目は The Harriet Series です (どちらのウェブサイトもテキスト デザインを表現するために画像を使用しています。この点に注意してください)

上記の 2 つのデザインで私が興味深いと思うのは、タイポグラフィがプロセスをガイドするだけでなく、独自のスタイルでガイドする点です。テキストデザインはデザイナーの表現であるかのように感じられます。 Blake Allen は Helvetica を使用して、ページに新鮮で整然としたスイス風のスタイルを表現しています。一方、Harriet のサイトは、もう少し遊び心があり、実験的です。それが、タイポグラフィによって生み出される秩序立った混沌の美しさです。

残りの 99% のデザイナーにとって、タイポグラフィと余白は基本的な基盤です。なので、修正内容をよく理解しておかないと、その後のデザインは根拠がないようなものになってしまいます。デザインについて心配するのをやめて、まずはデザインを目立たせることに集中しましょう。デザインの装飾を始める前にこれを完了する必要があります。

Clear は iOS 用のシンプルなタスク管理リスト アプリです。ジェスチャーを使用してインターフェースを制御することが主な魅力ですが、テキスト デザインだけでもすべてが解決され、アプリを楽しめることがわかります。もちろんこれは Helvetica ですが、いたるところにひどい間隔がある Comic Sans はどうでしょうか。優れたタイポグラフィは美しく目立つ必要はありませんが、だからといって、ネガティブに目立って十分な害を及ぼす必要もありません。

Art of the Menu は素晴らしいメニューデザインのウェブサイトです。

「The Art of the Menu」のウェブサイトでは、メニュー デザインにおけるテキスト デザインの重要性をわかりやすく説明しています。一部のレストランでは、メニューを目立たせるために画像やイラストを追加することは喜んで行いますが、メニューをざっと読みやすくするための適切なテキストデザイン構造を使用していないため、大きな失敗となります。

あなたがデザイナーであれば、きちんとしたデザインを望まない理由はありません。しっかりとした基盤のないデザインに何かを追加すると、デザインがさらに悪くなるだけです。あまりにも多くのデザイナーが、自分のデザインを価値のないもので救おうと盲目的に試みますが、これは間違いなく火に油を注ぐことになります。

タイポグラフィについて理解が深まりましたか? 少し前に、Smashing Magazine がトップクラスのタイポグラフィ ツールとリソースの包括的な概要を作成しました。ぜひご覧ください。

翻訳者注：タイポグラフィの項目の説明は、百度百科事典とWikipediaおよびその英語版にあります。Wikipediaではタイポグラフィと訳されていますが、翻訳者は国内のほとんどの翻訳の翻訳方法を参考にしてフォントデザインと訳しています。

出典: http://article.yeeyan.org/view/344362/306754

元のタイトル: もう一度言います: テキストデザインはウェブデザインの基礎です

キーワード: かつて、テキスト、ウェブページ、根本的に、探している、この問題、長年、よく聞く、夢の中で、ウェブマスター、ウェブサイト、ウェブサイトの宣伝、お金を稼ぐ