1

タイポグラフィーは、CSS で Web ページをデザインするときに決してうまくいかないものの 1 つです。見出しと本文のテキストは、私が Web で見る他のほとんどの Web サイトほど見栄えがよく、感じもよくありません。これにより、私のタイポグラフィはこれらのウェブサイトほど読みやすく広々としていないと思います。

私はこれらの見栄えの良い Web サイトの css をコピーしようとしますが、同じ結果が得られることはないようです (少なくとも、これらの手法を自分のものにして、将来使用できるようにすることは決してないようです)。さらに、タイポグラフィに関して言えば、私の CSS はいたるところにあります。後でスタイルを変更する必要がある場合、関連する値を探すのに長い時間を費やします

私が最初にcssを学び始めたとき、ページレイアウトを正しくする方法（静的、流動、左/右のナビゲーション）に関する多くのチュートリアルを見つけましたが、適切なルックアンドフィールを取得する方法について役立つものは何も見つかりませんでした。タイポグラフィに。一方、タイポグラフィに関する本はたくさんありますが、タイポグラフィをウェブ上で見栄えよくする方法についてはあまり役に立たないようです。

いくつかのリソース、またはタイプが Web 上で適切に表示されることを常に保証する固定アプローチを提案していただければ幸いです。

ありがとう

4

1 に答える 1

2

この記事は役に立つかもしれません: http://ilovetypography.com/2008/02/28/a-guide-to-web-typography/

お気に入りのサイトを調べたり、CSS を試したりすることで、あなたはすでに正しいことをしています。それは学ぶための最良の方法の1つです。

一般的に、私がタイポグラフィを扱うとき、見栄えを良くするためにできる最善のことは、コントラスト、色、視覚的階層の 3 つを考慮することです。

  • コントラスト: コントラストの低い色の背景にテキストを表示すると、見栄えが悪くなります。実際、非常に悪いため、「アクセスできない」と見なされる可能性があります。カラー コントラスト チェックなどのツールを使用して、テキストがWeb コンテンツ アクセシビリティ ガイドラインに準拠していることを確認できます。
  • 色: あなたが楽しんでいるサイトのほとんどは、真っ黒なテキストを持っていないことにおそらく気付くでしょう。純粋な黒は自然界ではあまり見られず、白い背景に黒いテキストが得られる最高のコントラストであり、少し粗く見えることがあります。ほとんどのサイトでは、次のようなcolor: rgb(30,30,30);
    css を使用して、黒のテキストをわずかに灰色にすることでトーンを下げます。それか、素敵な暗い色を選んで黒に固執してください.
  • 視覚的階層: 基本的に、重要な見出しには大きなフォントを使用します。したがって、h1はおそらく最大のテキスト部分であり、各サイズは まで小さくなりh6、タグ内の他のものpは、ここに表示されるテキストとほぼ同じサイズになるはずです。Webdesign Tuts は最近、ビジュアル階層に関する非常に優れた記事を投稿しました。

それが役立つことを願っています!

于 2011-03-06T06:37:11.023 に答える