You must have heard a lot about Reactive Web Design (RWD), as it is one of the most talked about subject areas on the net nowadays.

Yet , most of the situations, grids and pictures, fluidity and flexibility grab all of the attention and barely virtually any discussion relating to the typography.

Although it’s one of many essentials that demand importance but most designers somehow tend to dismiss this factor. In this article, my singular focus is certainly on receptive typography with regards to the website style.
Content, even though the most important ingredient of any website, blog, forum or submission site, is the content as well as the way it is actually presented. However the focus of designers is mostly on the site design. This is where the problem comes up.

The adaptable web design previously takes care of this kind of aspect to some degree, by including some level of responsive typography. Yet this cannot be named complete but it comes packed with numerous typographic options. However , before all of us go into the details, let us earliest understand what receptive typography is.

What is Reactive Typography?

Reactive typography ensures that the text online is not only resizable depending upon the screen size from the device, nevertheless is also enhanced in order to boost readability. At present, we typically only apply desktops or perhaps laptops gain access to internet and browse websites but also make use of tablets and androids.

For quite long, the designers have already been solely concentrating on website design in order to make it extremely versatile to the different screen sizes. There has been nearly or very little effort built to optimize or perhaps adapt the information and its introduction according to the screen size. Responsive typography addresses this issue, presenting an opportunity to designers to experiment with this article also.

Basic Principles of Reactive Typography

The concept of responsive typography works on 3 basic principles:

Resizable text
Optimization of series length

Whenever you make any decision about the presentation of text, it obviously starts from the font type. No matter what type of typeface you are applying, but it’s important to make sure that a few possibilities can be easily read. If you want to keep it very basic, the only alternatives are Serif and Sans Serif. Serif is generally intended for headings or perhaps titles, although Sans Serif is used for the remainder of the content.
The logic is pretty simple. The Sans Serif font offers you more liberty to experiment with. Therefore , you can actually use it for the chunk on the text. The Serif font, according to the designers, is quite severe, thus so that it is a perfect decision for titles.

Resizable Text

When deciding the typeface size with respect to the text with your website, make sure you specify this in the stylesheet according to different display sizes. Although how to decide the best font size is another problem. For this the rule of thumb is usually experiment with you.

Yes, choose the font size and analyze how it appears to be when you work on a computer’s desktop, a tablet and a smartphone. Remember that people take a look at their mobile phones from very near where as tablet is normally, most of the time, a little bit above the knee when a user is sitting. In short, range matters. If you have a hard time examining it, raise the font size.

Optimization of Line Length

Optimizing the line length is very an important feature. The reason is that a desktop possesses a bigger screen and can fit around seventy five characters in a line whereas this will show detrimental to readability on extra small screen size. Although there will be no hard and fast guidelines, but of course, the size of a line plays a significant role inside the visibility and readability with the content.
Therefore , choose the length of the line accordingly for different equipment and ensure that it does proper rights with the screen size as well as the total website design.


Do not take too lightly this part of typography. Test out different backgrounds and color clashes before going live and make a decision on the one that looks best. When testing, you could realize that something which looks really nice on the desktop may well not produce the same effect once seen on the smartphone or maybe a tablet for the kids.

So , the rule of thumb is certainly, experiment with numerous devices possible when it comes to Receptive Web Design and responsive typography. Buy or borrow, yet make sure that your solution fits all display screen sizes and appears absolutely amazing.