Sign up FAST! Login

Mobile Design Typography is Vitally Important … and Challenging | Codrops

Stashed in: mobile

To save this post, select a stash from drop-down menu or type in a new one:

Start small. Does your text render on a smartphone? If not, work with the type so that it is readable on the smallest screens first and make adjustments to accommodate larger screen sizes.

Think about multiple columns for text. A single column is the right width on a small, narrow screen but what about in a wide-screen web browser? Think about splitting text into two columns to keep lines from getting too long.

Consider the type style. Letters of even stroke weights are the easier to read at small sizes. Avoid typefaces with varying wide and narrow strokes. Also consider the width of each letter; very skinny condensed fonts are more difficult to read than normal or regular styles.

Avoid bells and whistles. Scripts, cursives and novelty typefaces do not render well at small sizes. Avoid them for use in body text and use them sparingly for display (one or two words maximum).

Keep it simple. When working with mobile devices, remember the screen is small. Few elements mean text will be easier to read.

Test, test, test. Check out your design concept on multiple devices.

Check out different browser sizes. Do it with just a click from your desktop before you get started with a tool such as resizeMyBrowser.

You May Also Like: