Quality Websites Need Quality Typography

What is a font? What is a typeface? Are these words interchangeable? If you don’t know the answer to these questions, this one is for you. If you ever question how important typography is to any design, this one is for you also.

Font describes the weight and variation of a typeface. Attributes such as bold and italic are different fonts. Typeface refers to a “family” of fonts. Times New Roman, Verdana, and Helvetica are all separate typefaces. It is important to know these terms correctly because many experts swear by the notion, type makes up more than 95 percent of web design.

Typography Today

Websites all convey a particular mood, whether the mood is intentional or not is up to the designer. A website may unintentionally spur a bad mood if it is cluttered, lacks visuals, or requires a magnifying glass to read the text. A website may surely elicit a positive mood if it is easily navigable, legible, readable, and does not appear as an endless spew of text. All these factors contribute to a better user experience, or UX. Another thing these factors all have in common: typography.

Typography greatly effects on the success of a website. A user’s reaction to the appeal of text is a reflection of the site’s visual appeal. Think of how a website visitor might interpret the italicized words in the sentence, “You do not want to miss this sale!” The italics here stress the value of the sale for products sold on a website. The type in the sentence, “You do not want to miss this sale!” is common and does not differentiate the value of the sentence from any other sentence on the website. This reaction is something a word alone cannot accomplish. Visual Hierarchy says, typography is what enhances and changes the meaning of the language.

Future Typography

Joint-innovators Google, Apple, Adobe, and Microsoft will soon introduce variable fonts to the design world. They have named the new technology “OpenType Variable Font”. These four companies recognize the importance of impeccable, versatile font, causing them to develop responsive design for fonts.

The problem is, fonts quickly increase both file size and load time for websites. Since each typeface has several different fonts, a separate file is required for each. Many websites do not want to jeopardize loading time speed and, as a result, will sacrifice the number of fonts they use. This means developers would rather manually manipulate one font to appear bold, rather than to carry the extra file for bold font. As a website appears on different platforms, including smartphones, desktops, and tablets, the manipulated font will appear distorted because it is not intended to adapt to different devices and weights.

The solution lies in variable fonts. One font will be adjustable to different weights, sizes, and viewing platforms based on mathematical data. The benefits of variable fonts are faster websites, higher quality websites, and smaller app sizes. Although no variable fonts are on the market yet, designers and developers are preparing to use them in the near future.

Importance of Typography

Brand recognition is largely tied to quality typography. At the earliest ages, children are able to recognize McDonald’s just by the company’s signature yellow “M”. Color and fonts all come together to create brand awareness for viewers. Too many typefaces are distracting; however, this does not mean only use one typeface throughout an entire website. As a rule of thumb, use between two and three typefaces to create a consistent, engaging design. Typography is also used to navigate visitors through a website. Large fonts distinguish important information from general content, and font alignment shows the eye what it should view next. Good typography has the ability to bring a website to life while also sparking a flare of character.