Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> CSS

Khi nào nên dùng Bold vs Italic trong Typography?

Trong typography, có nhiều emphasis techniques, italics và bold là hai phổ biến nhất. Italic và bold là font variations khác nhau của typeface design gốc. Hãy tìm hiểu khi nào dùng italic hoặc bold trong typography, và có nên dùng cả hai trong cùng document không.

Phần lớn text bài này dùng typeface Alegreya, regular font-weight. Trong CSS, default font-weight property có giá trị 400 (regular).

  • Bold font-weight có cùng style regular font, với chữ dày hơn.
  • Italic font là phiên bản nghiêng trái sang phải của regular font typeface.
  • Bold italic là cả nghiêng & dày version của typeface.

Set font-weight bold trong CSS:

p { font-weight: bold; }

Có thể dùng numeric values, thường 700 cho bold.

Để set font-weight bold với HTML tags, wrap từ muốn emphasize với tag <strong>:

<strong>Text here</strong>

Set font-style italic trong CSS:

p { font-style: italic; }

Để set font-style italic với HTML tags, wrap từ muốn emphasize với tag <em>:

<em>Text here</em>

Set bold-italic trong CSS:

p { font-style: italic; font-weight: bold; /*or 700*/ }

Để dùng bold-italic với HTML, wrap từ muốn emphasize như sau:

<strong><em>Text here</em></strong>

Side-by-side comparison từ regular, đến bold, đến italic, đến bold-italic:

Text Text Text Text


Khi nào dùng italic vs. bold

Một school of thought cho rằng vì italic và bold đều dùng emphasize certain parts của text block, bạn nên chỉ dùng một trong hai, ít nhất trong cùng text block. School of thought khác cho rằng italic dùng cho mild emphasis, bold cho strong emphasis.

Tôi nói nó depends on typeface (font-family) vì emphasis level của bold hoặc italic sẽ vary significantly từ typeface đến typeface.

Một số typeface designs, đặc biệt sans-serif, có italics yếu. Yếu, nghĩa là bạn hardly notice chúng slanted/tilted, do đó không work tốt như emphasis tools. Nếu typeface có weak italic, dùng bold.

Một số typeface designs, đặc biệt serif, có italics mạnh và noticeable, nổi bật gần như bold font. Trong trường hợp này, bạn tự quyết định dùng cái nào, và nếu muốn simple, dùng một emphasis style trong cùng text block, tránh confuse reader.

Nếu typeface có strong italic nhưng rõ ràng stronger bold bạn có thể dùng italics cho mild emphasis và bold cho strong emphasis. Ví dụ typeface như vậy, là cái bạn đang nhìn, Alegreya. Chú ý italic text trong paragraph này noticeable, nhưng không bằng bold.

Ở đâu có nhiều pixels nhất, mắt thường đi trước, đó là lý do bold, với nét chữ dày hơn, thường best option cho strong emphasis, trong khi (well-designed) italics work tốt cho mild emphasis.

Khi nào dùng bold-italic?

Mỗi lần trong khi bạn muốn combine bold và italic để extra-emphasize important piece of text, có bold-italic.

Theo tôi, dùng bold-italic fonts là artistic choice hơn practical design choice. Nếu typeface có beautiful bold-italic font, work tốt trong documents, by all means, dùng nó. Nhưng thử work với individual bold và italic fonts trước, vì bold-italic có thể too much of a good thing (quá emphasized).

Alegreya has a beautiful italic

Alegreya has a beautiful bold

Alegreya has a beautiful bold-italic

Tôi dùng bold-italics thận trọng, cho one-off text elements.

Khám phá options của typeface

Bạn phải test font variations của typeface, từ italic đến bold, trước khi quyết định. Cũng nhớ một số typefaces có nhiều font-weights, từ "hair" (thinnest) đến "black" (thickest). Cho context cụ thể, "medium" font-weight có thể best, hoặc "extra-bold". Test, test, test!

Tôi tend to dùng italic cho mild emphasis trên single words. Đôi khi, tôi dùng bold trên multiple words liên tiếp, ví dụ nếu tôi strongly muốn highlight phần của câu. Tôi thấy style này work tốt cho typeface này (Alegreya) — nhưng có thể không cho của bạn.

Đừng bao giờ dùng bold và italic interchangeably — có lý do, và stay consistent với chosen style trong cùng document. Bất cứ gì bạn làm, nhớ ít emphasis luôn tốt hơn.

Nếu bạn emphasize everything, bạn emphasize nothing.