How To Create An Effective Web Typography
Basics of typography
First things first "" let me start with the basics. All the fonts can be classified into two broad categories - serif and sans serif. Serif fonts have small feet at the bottom, while sans serif fonts have clean cut offs. Times New Roman is the popularly used serif font, while Arial is the most common sans serif font. Switching from serif and sans serif fonts multiple times per page will do a site more harm than good as it affects the readability.
Site hierarchy
Your visitor may want to quickly scan the content and find the most important items. Therefore, you need to utilize a great hierarchy for your web pages. A well-developed hierarchy will have indicators like where to start reading and how to proceed. Varying type size is one of the best ways to differentiate content. You can also use different colors and spacing to vary the hierarchy for your pages.
Use of secondary fonts
You may like to use a certain font in your site. But what will happen when a visitor opens your site in a computer that doesn't have the font you used? The site may lose its effect as the browser will display it in another font available on that computer. The concept of primary and secondary fonts can resolve this issue to a certain extent. If a computer does not have the primary font installed, it will check for the secondary font and show the web page in that font. The key is, you need to set a well-known font as your secondary font so that most computers will have it.
Typography as an art
A good web designer must think of typography as an art that can improve the user experience by improving the web design. It is a fundamental component of designing and is the backbone of any web design. Therefore, typeface selection decisions in web design shouldn't be done randomly or resort to browser defaults.
Use of a typographic scale in CSS codes
You can control your web page fonts through many ways. As declaring font size in CSS is simple, you can use it to take control of your fonts. It can provide easy consistency between your typography across the entirety of a website. If your CSS is solid, you can let visitors move between pages of your website seamlessly.
Web typography is a broad topic and we hope that this article would have given you a basic idea about it.