Skip to main content

How to Write for the Web

11-04-20 Naomi Leak

Learn 9 basic tips for writing effective content for online audiences.

Users interact with content differently on the web than they do on other mediums. So if you are writing content for your new website or are new to web writing in general, you’ll want to consider several unique factors, including how users approach content, content accessibility, and some technical aspects of how the web works. To help you transition to thinking specifically in terms of web users’ needs, I’ll share some concrete guidelines along with a few resources that can help you execute them well.

1. Use Words Sparingly

Web users have short attention spans and often come to sites looking for specific information. Because of this, they generally don’t take time to read excess content, such as introductions, welcome messages, or lengthy explanations. When writing for the web, seek to share information accurately but as concisely as possible.

Visit this resource for more specific tips on how to write concisely for the web. This article gives practical illustrations of writing clear and concise copy using the concrete example of a therapist’s website.

2. Make Text Scannable

Since users often come to sites seeking specific information, you can think of their interaction with websites as a conversation. They arrive with a question and expect the site to answer it. To accommodate this need, make it easy for them to scan for their answer. Make important information stand out among the other content and use lots of headings and subheadings so users have to read as little as possible to identify where their answer is.

3. Give Vital Information First

Following the theme of the last point, put vital information at the top of your pages and paragraphs. That way users can read the first few sentences, get the information they need, and move on to their next task. If they are especially interested in the topic, they can choose to stick around and read past the first few sentences. But they are not required to sift through all of that content for their answer.

For some more help organizing and prioritizing content on your site, use our content priority guide.

4. Avoid Walls of Text

Because users arrive on sites looking to scan for specific information, they are usually intimidated by long blocks of text. Blocks of text are difficult to scan and require a lot of reading. So avoid significant amounts of text when possible and use many paragraph breaks so that the content appears in digestible, easily scannable chunks.

5. Use Bulleted Lists

To that same point, whenever information can be represented in a numbered or bulleted list, use these design elements. They convey information more concisely than in paragraph format, and they are especially easy to scan. They also break up walls of text.

6. Don’t Be Afraid of Page Length

A longer page that is broken up with headings and bulleted lists allows users to find information more easily than several pages with only a hundred words on them. A single, longer page means that users have to do less clicking and searching to find information.

For example, don’t make an about page with a couple of sentences on it that link to three subpages, one for mission, one for vision, one for values. Make one longer page (effectively organized with headings, sub-headings, and lists) to combine the content, allowing users to find all related information in one place. Organizing content this way can also improve the page’s ranking in search engine results. Content on longer pages should still be written carefully and concisely, but don’t be afraid of collecting related, well-written content on a single, well-structured page.

In any links such as buttons or navigation, make the text as descriptive of where it will send the user as possible. Avoid links or buttons that say “click here” or “more.” Rather, use descriptive text like “register” or “read more articles.”

Avoid vague anchor text for in-text links as well: “Click here to learn more about VoiceOver keyboard shortcuts from Deque University’s website.” Instead, anchor the link on more descriptive text: “Learn more about VoiceOver keyboard shortcuts from Deque University’s website.”

Descriptive links help all users understand your content better, but they also make your links more accessible for visually impaired users using screen readers. Screen readers can navigate from link to link, and only hearing “click here” does not give users any context of where those links will take them.

8. Create Intentional Title Tags, Meta Descriptions, and URLs

Title tags and meta descriptions are HTML elements that describe the contents of a page for search engines. Search engines evaluate the keywords in title tags, meta descriptions, urls, and on the pages themselves to rank how useful those pages will be for users. This ranking determines where a page will appear in search engine result pages. The title tag is the headline that users will see when they are looking at search results, and the meta description is what will appear right below this headline. Accurate title tags, meta descriptions, and urls using commonly searched terms can drive users to your page through search.

Be sure to create a meta title, meta description, and intentional url for each page. Meta titles can be any length, but Google generally only displays 580 pixels (about 60 characters) of them. Similarly, for meta descriptions, Google generally only displays 920 pixels (about 160 characters) of them. Meta descriptions should be long enough that they’re sufficiently descriptive, so we recommend descriptions between 50 and 160 characters. You can also use a tool to specifically test the pixel lengths of your title and meta description.

Use a tool like ahrefs to research keywords that are both accurate to your content and often searched, and use these keywords to help your content rank with search engines. Please note that any popular keywords you use in titles, meta descriptions, or urls should be accurate to your content. Adding commonly-searched keywords that don’t match your content may catch users’ eyes at first. But once users are on the page, they will realize that the content does not meet their needs and will promptly leave the page. Search engines will catch onto this, and it will hurt your ranking. So use accurate keywords to be helpful to your users and to help your search engine optimization.

For more guidance, visit this resource on how to optimize title tags, meta descriptions, and urls for search engines.

9. Give Every Image Alt Text

An HTML alt attribute describes an image. It is what shows if the page cannot load the image, and it is also what screen readers say when they read over the image. Every image should have an alt attribute inside the img element.

For images that convey information, such as charts or images discussed in the surrounding content, the text in this element should describe clearly what appears in the image for those who have impaired vision. Someone using a screen reader should understand from alt text the same information that users who see the image understand from it.

However, this information should not be redundant of any other information in the image caption or surrounding content. Alt text does not need to repeat information—it simply needs to provide the information that visually impaired users will not receive from looking at the image. For images that are used only as decorations (they do not give users any information and serve only an aesthetic purpose), the alt tag should still exist but should be left empty: alt=” “. This will tell the screen reader to simply skip over the image.

For more guidance, visit WebAIM for excellent instruction on appropriately using image alt text.

Related Content

User-Centered Thinking: 7 Things to Consider and a Free Guide

Want the benefits of UX but not sure where to start? Grab our guide to evaluate your needs, earn buy-in, and get hiring tips.

More Details

See Everything In

Want to talk about how we can work together?

Katie can help

A portrait of Vice President of Business Development, Katie Jennings.

Katie Jennings

Vice President of Business Development