5 tips to help you master responsive typography by Saad Raja

Most often, web users fail to realize the importance of web typography and the role it plays in creating a responsive web page. What exactly is web typography and how to bring it in use is the real question here? Gathering suitable information, Saad Raja elaborate on how font spacing, size and layout hold power to form a legible, elegant text setting.

1) Appropriate size of the body text

Set a scale for screens with different sizes. This can be carried out easily by fixing the base size font to 100%, as suggested by the author of ‘Learning Responsive Web Design’, Clarissa Peterson. Setting the base size at 100% will allow browsers to make the font size that is easily readable for every device.

2) Take the reader into consideration

Let your creative side shine bright and think of ways the reader can interact with the viewport. Keep in consideration the difference of font when the reader switches from desktop to mobile and scale the font size accordingly. According to art director Brian Hoff, the typography should be scaled in a manner that it regards the reader.

3) Adjust line spacing

Commonly known as ‘leading’, the line height is often not given enough importance. Readers often get distracted when they feel there is a lack of symmetry within the lines as they go on inspecting. Gaps left within the lines come across as unpleasant; therefore it is important to have a proportionate outlook of the lines.

4) Use visual variation other than size

For a desktop design, larger headings with a different font work as it creates an impact on the reader, but for a mobile version, this will not work. This is because larger headings force down the text below and create a gap in the continuity. The reader has to scroll down a lot even for a shorter piece of information.

5) Choose suitable fonts

Due to the large variety of scales present, it is important to adjust the type of fonts being used as well. Different interfaces require unique fonts that allow them to stand out. Moreover, it should be taken care of whether the font you’re using compliments the style of writing or not. Do not clutter the space by loading too much.