Approach heard a whole lot about Reactive Web Design (RWD), as it is one of the talked about subject areas on the internet nowadays.

However , most of the days, grids and images, fluidity and adaptability grab all the attention and there is barely virtually any discussion at the typography.

Even though it’s among the essentials that demand importance but many designers in some way tend to disregard this element. In this jot down, my bottom focus can be on responsive typography in terms of the website design.
Content, although the most important ingredient of any web-site, blog, community forum or listing, is its content and the way it is presented. Nevertheless the focus of designers is mostly on the webpage design. That’s where the problem comes up.

The adaptive web design currently takes care of this aspect to some extent, by including some amount of responsive typography. Yet this kind of cannot be known as complete however it comes loaded with numerous typographic options. Nevertheless , before we go into the details, let us first understand what responsive typography is definitely.

What is Responsive Typography?

Receptive typography means that the text on the website is not only resizable depending upon the screen size of your device, nevertheless is also enhanced in order to boost readability. Nowadays, we tend only apply desktops or perhaps laptops to access internet and browse websites but as well make use of tablets and androids.

For quite long, the designers have been completely solely focusing on website design to make it versatile to the various screen sizes. There has been almost or little or no effort designed to optimize or adapt this and its business presentation according to the display size. Receptive typography addresses this issue, giving an opportunity to designers to experiment with this article also.

Basics of Receptive Typography

The idea of responsive typography works on three basic principles:

Resizable text
Search engine optimization of brand length

Whenever you help to make any decision about the presentation of text, this obviously starts from the typeface type. Regardless of what type of font you are applying, but it is critical to make sure that this great article can be without difficulty read. If you need to keep it sensitive, the only options are Serif and Without Serif. Serif is generally employed for headings or perhaps titles, whereas Sans Serif is used throughout the content.
The logic is very simple. The Sans Serif font provides you with more freedom to experiment with. Therefore , you can actually use that for the main chunk within the text. The Serif typeface, according to the designers, is quite serious, thus turning it into a perfect decision for titles.

Resizable Textual content

When deciding the font size for the text on your website, ensure that you specify this in the stylesheet according to different display screen sizes. Nevertheless how to decide the proper font dimensions are another issue. For this the rule of thumb is definitely experiment you.

Yes, select the font size and review how i think when you work on a computer’s desktop, a tablet and a smartphone. Keep in mind that people look at their mobile phones from very near while tablet can be, most of the time, a little bit above the leg when a end user is resting. In short, range matters. If you have a hard time reading it, raise the font size.

Optimization of Line Duration

Optimizing the queue length is fairly an important factor. The reason is that a desktop contains a bigger screen and can accommodate around 75 characters in a line although this will establish detrimental to legibility on extra small screen size. Although there are no hard and fast rules, but of course, the size of a lines plays a serious role inside the visibility and readability belonging to the content.
Therefore , choose the length of the line consequently for different devices and ensure it does proper rights with the screen size as well as the general website design.


Do not undervalue this area of typography. Evaluation different backgrounds and color clashes before going live and make a decision on the one that appears best. Whilst testing, you may realize that a thing that looks extremely nice on the desktop might not produce similar effect when seen on the smartphone or maybe a tablet for example.

So , the rule of thumb can be, experiment with numerous devices feasible when it comes to Reactive Web Design and responsive typography. Buy or borrow, but make sure that the solution satisfies all screen sizes and looks absolutely amazing.

Leave a Reply