

In its most general terms, screen resolution refers to the number of pixels a screen contains horizontally and vertically, such as 1024×768. The need for responsive typography often stems from the need to consider the website visitor’s circumstances of how and where he will be viewing the text on your website. Once you have a deeper understanding of these individual typography components (as well as how they fit together in the web design process), you’ll be able to apply your knowledge to designing a flexible layout that includes responsive typography choices.Īnd don’t forget the relationship between typography and user experience. This priority can trickle down to font color, typeface, font weight, font size, and many other design choices. Often, this will mean that you’ll need to craft a typography scheme that is flexible in that it can accommodate multiple screen sizes. You have a smaller screen to work with, but not necessarily less text. In terms of our design process, it makes things a little bit more complex. It means that your designs, including your text’s (be it titles, headings, paragraphs, button texts, etc.) typography - all need to look good on mobile. So, even if your site targets desktop use-cases, it’s still just as important for it to be mobile-friendly, at least if you want it to stay on Google’s good side. In practice, this means that the Google search engine predominantly uses the mobile version of the content for indexing and ranking. It’s more than that - since as of March 2018, Google announced its “mobile-first indexing” initiative.

And when we say responsive design, we don’t just mean websites that look great on both desktop and mobile sites. In terms of speed, studies performed by Nielsen Norman Group have even found that people read 25% slower when reading from a screen compared to when reading from paper.Īs web creators, the moment we hear the words “different screen sizes”, many of us will often immediately think of responsive design. This could be because we’re looking for keywords - in order to get as much information as possible in the shortest amount of time. But that’s a topic in and of itself, which we will discuss shortly.įrom a behavioral perspective, when we read digitally, we do more scanning and jumping around. When designing content for a screen (whether imagery, accents or textual elements), we are designing for a range of what can be - such as different resolutions, sizes, and devices). This means that each piece of paper has a definitive, constant size that doesn’t change, and we know in advance what that paper size is. Alternatively, on-screen content is dynamic, constantly changing, as the screen is an adaptive medium. Logically, the most fundamental difference between print design and web design is that print is a physical, tangible object with fixed, static content. The differences between print design vs web design and their respective reading experiences are indeed plentiful. After all, they’re both visual processing experiences where you consume information by reading letters of the alphabet upon a background. Just as a website’s visual design, interactive features, and overall functionality determine the quality of a website, the same is true for its typography.Īfter reading this article, you’ll be equipped and empowered to implement your knowledge and understanding of the essence of web typography and how it can make or break any and every website.Īt first, you may think that there isn’t much of a difference between reading from a screen and reading from paper. Ultimately, when people visit a website to read its text, they’re looking to find out information about you - and we know that words matter.Īs web creators, we can definitely appreciate that presentation is of equal value to a website’s content. We’re talking concepts, principles, terminologies, guidelines on choosing the best fonts, and of course, action items.īefore we embark on understanding the ins and outs of typography for web design, an important topic to cover is why typography is so important. But before we begin, what is web typography and why is it important? In this article, we will cover everything you need to know about typography as a web creator. Although its strong significance may often be overlooked, typography plays a fundamental role in web creation - this means branding, visual design, user experience, user interface, content strategy … the whole entourage.
