A brief discussion on the font settings in web pages

Setting the font for the entire site has always been a simple yet difficult task, because when you go deeper, there are too many things involved.

This article mainly wants to talk about how to choose fonts according to your needs for an ordinary website.

1. Required knowledge

First of all, we should make it clear that just because you set this font, it does not mean that the user's computer will display in this font.

If the user's computer does not have this font installed, it will be rendered in the second font you set. Look at a common setting

If the above code is set on a machine without Tahoma font, the machine will render with Arial font. If neither is available, then use the latter. If the font you specify is not available, a font from the sans-serif font family will be used.

Then, we should talk about what sans-serif is.

Sans-serif means sans serif font. It is not a type of font, but a general term for a type of font.

Correspondingly, serif means using serif fonts.

(To explain: serifs are very small modifications on the font. You can search Baidu for details. It is not relevant to this article, so I will not elaborate on it.)

Regarding common font families, here is a summary:

•serif: font with serifs. Times New Roman is the default serif font. For Chinese fonts, it is Songti, Fangsong and the like.

•sans serif: sans serif font. Arial is the default sans-serif font. Among Chinese fonts, Microsoft YaHei and Heiti are all of this type. English fonts include Helvetica, Geneva or Verdana.

•monospace: monospace font. Every letter in this font has the same width. Usually used to display program code, etc., Courier is the default monospace font. For Chinese, each character is of equal width.

2. How to set the font

After reading the necessary knowledge above, you must have a more systematic understanding of fonts.

So how do you set the website font?

Some people are used to using Songti, Arail or Tahoma as their first font. However, there is a big problem here. For larger font sizes (above 16px), the rendering is quite ugly. However, I use the font optimization tool under Windows on my computer, so I can’t show it to you. All in all, for large fonts, this setting is pretty ugly.

Some people say that Microsoft YaHei looks good when the font is large. How about setting up Microsoft YaHei completely?

There is a big problem here. YaHei is only available in Windows Vista. For XP users, which have a user share of 65%+, setting up YaHei is the same as not writing it. They still use Songti or something like that to render it. Except when you are comforting yourself or dealing with your boss (your boss usually follows the trend and uses Windows 7 or above). Really useless for most users. Moreover, Microsoft YaHei is not as good as Songti when rendering 12px fonts.

So, regarding how to set the font, I think it should be set according to the actual business and situation.

3. Conclusion

After the above analysis, I summarized a setting method that I think is pretty good

1: Best overall

The font settings for the entire site are as follows

Then use images for large and important text (such as navigation). Because after using pictures, you don’t have to worry about whether the user has installed this font, and you can make it more beautiful, with more scalability and possibilities.

2: Best performance

The font of the whole site is still

Then for the large font (it doesn’t matter whether it’s important or not here). Set up individually

This setting can save a lot of work on the front end, but many XP users will be annoyed by the large font size.

3: The easiest solution

direct

The above brief discussion on font settings on web pages is all the content that the editor shares with you. I hope it can give you a reference. I also hope that you will support 123WORDPRESS.COM. </p>

Original URL: http://www.cnblogs.com/qqziyuan8/archive/2016/08/01/5726310.html