Typography is a very interesting and crucial filed in web design as it reflects your website’s tone and affects its visual impact. Every web designer must have basic knowledge of typography. In this article, I have described the basic concepts of web typography in simple language so that you can understand it easily.

What is Web Typography?



Basically Web Typography means the art and process of organizing texts in webpage. In simple words, Web typography means the use of fonts on the website.

What Is The Purpose of Typography?

Because of the fact that typography is closely related with web design, a lot of individuals have a misconception that the aim of typography is to make a website beautiful.

However, the primary objective of typography is not anything related with beauty. Actually the aim of typography is increasing the readability. This doesn’t imply that it shouldn’t look beautiful, but this is only an additional bonus. The primary purpose of the typographer is to ensure that the type is easy to read. Typography involves every possible component that can impact the design of a website, such as typeface selection, color scheme, line length, point size, design integration and much more. Typographers or information designers are mainly concerned with readability of a webpage.

Why Typography Is Important for Web Design?

About ninety five percent of a general website is filled with content. And typography is the art of showing readable content in the web page. So it is really an important part of web design. Your selection of fonts and how you make it perform with your color schema, layout, grid or design theme will differentiate between a good, bad and great design. Your website visitors need to be capable of understanding what messages you are trying to display. If you make your text too small to read or cramp all of them together, your website will not get a second view and consequently the number of your website visitors will be dropped. Typography is crucial for website because it is used to convey a particular mood or feeling, or make visitors react in a particular way.

Basic Elements of Web Typography:

The key elements of web typography are the typefaces we use in our web pages. And there are a number of CSS font properties that we can utilize to change typefaces:

font-family : This property specifically describes the typeface that you wish to use. If you do not use this property, CSS will use the default font of your web browser.

font-size : This property is used to define the size of your webpage’s font. You can also define what kind of measurement to use.

font-weight: It is used to define boldness of the font.

font-style: Used to make your font italic.

font-variant : This specifies whether or not a text be shown in a small caps font.

Typography Spacing

After defining a particular typeface and font, you have to define the spacing around the letterforms or text. There’re a number of CSS properties that you can utilize to change the default spacing of your typography:

line-height: manage the leading of every line of text.

letter-spacing : This property adjusts the space between letters in a text.

word-spacing: manage the space between every word in a text.