Online typography largely adheres to the same principles as typography in print design. However, while print has had centuries to develop and standardize, web design often still has to “make compromises.” So, what is typography, really? It’s simply the design and application of typefaces as a means of communication. This includes not only the font itself but also the arrangement of letters or numbers, symbols, the layout of entire lines and paragraphs, and finally, the white spaces.
Good typography in web design can ensure that a website communicates effectively with its audience. However, if it’s not well thought out, even the best graphics, color palettes, and images won’t guarantee that the message will be received as intended. Often, though, this element is overlooked in favor of visual communication. But is that really the right approach?
The example of the website mentioned earlier shows there’s something to it—more and more people are getting interested in design, and communication, even for amateurs, is becoming widely accessible (memes mocking someone are now commonplace, and there are countless memes about the infamous Comic Sans). Did using Comic Sans affect business performance in any way? I don’t know, as I don’t have access to reliable data. However, from a branding perspective, it was certainly not beneficial.
This question has probably been answered by many blog posts, articles, and even memes 😉, but I’ll venture to add my own brief opinion on the matter.
I’m deliberately placing this first because we often deal with multilingual projects. A website may target audiences in different countries, and suddenly, the chosen font doesn’t support certain language characters. It’s crucial to ensure that the typeface you’ve selected includes the necessary characters for all the languages you need so that your audience doesn’t see awkward words with substituted characters from a different font.
The wide range of available font families and variations (italic, bold) today is certainly tempting, and it’s easy to get carried away. But remember, text needs to be readable, and the form shouldn’t distract from the content. If you want to use more than one typeface, stick to two, and choose them wisely—if one is bold and attention-grabbing, the other should be more subdued, less decorative, and easy to read. The typefaces also need to visually complement each other. If you’re unsure, you can use one of the many available resources that help match fonts, like Font Combinations or fontpair.co.
Dividing text into blocks and columns on a website can differ from print design—here, we need to consider that users are reading on screens, so the text shouldn’t stretch from edge to edge in a single column, as it’s easy to lose track and reading becomes cumbersome. Also, avoid splitting text into more than two columns, as readability becomes an issue. Generally, for optimal comfort—without excessive eye movement—a line of text should have about 66 characters (around 9 words).
As with anything, fonts need to be tested—especially when using web fonts—to see how they display across different browsers. Often, a font looks perfect in a design file, with everything aligning beautifully in Photoshop, but the live version may not be as flawless. This is especially true for thin or Light versions of fonts, where the result may not be as impressive as in the design. Google Fonts allows you to preview all fonts in a web environment, so it’s worth using this tool before making your final typeface decision.
Designing for the web involves combining many different disciplines to ensure that the final product meets its objectives, and typography is one of the most important elements. You need to find that sweet spot where color schemes, graphics, images, fonts, tone, and overall aesthetics come together, and that’s not always easy. So, is typography the most important thing? In most cases, no. But does it matter? Absolutely!
O AUTORCE
Członek Zarządu i Dyrektor Kreatywny Yetiza. Zafascynowana typografią zwolenniczka powiedzenia 'lepsze wrogiem dobrego’. Lubi stonowane kolory i jednopikselowe linie.
© 2024 YETIZ INTERACTIVE Created with ♡ by Yetiz
PRIVACY BELEID