Writing for the Web

Consider how copy will look on mobile devices

Mobile readers don’t want to wait for content—and mobile networks are notoriously slower than dedicated connections. Streamlined webpages appear faster than dense, complicated ones.

Mobile users are also apt to scan instead of reading blocks of text. They tend to skim the left side of the screen looking for headings, bulleted lists, and words that jump out at them.

Make every word count:

  • Put the most relevant and useful information at the top of the page.
  • Break up text into easy-to-read chunks of related information.
  • Keep sentences and paragraphs short.
  • Use words with fewer syllables.
  • Create narrow, bulleted lists.
  • Eliminate unnecessary white space (it forces users to scroll).

TIP

Some white space is beneficial. For example, replacing a paragraph with a bulleted list can open up welcome white space that helps the reader scan.

Example
Before
Our favorite restaurant of the moment is Khanh’s Khafé, a charming, quiet, out-of-the-way little gem tucked into an alley in back of the newly revitalized theater district. Asian fusion pastries (like the lychee jelly dim-sum doughnuts), unusual coffee and tea drinks, and desserts (love the Spicy Cold Sundae, a Thai ice coffee gelato sundae sprinkled with tiny frozen Thai chilis). The food is yummy, the prices are great, and they’re open until midnight every night. Five stars.

After
Today’s pick: Khanh’s Khafe, 42 Jackson Alley, Theater District
What to order: Spicy Cold Sundae, lychee jelly dim-sum donuts
Why: Charming, tasty, open till midnight
Price: $
Rating: *****

  • When writing user-interface text for a site that’s intended for mobile devices, consider using abbreviations or contractions if extra characters could wrap the text to another line. This is particularly important for things like navigation links that appear on all your webpages and other text that repeats across your site.

Example
Before
Updated 20 hours and 10
minutes ago

After
Updated 20 hr. 10 min. ago
or
Updated 20h 10m ago

TIP

Some mobile browsers do not support special characters such as smart quotes (“”), tiny graphic symbols (★), and accented letters (é).

Have an idea for an article? Let us know about it!