Writing for the Web
Once you’ve developed a content strategy and planned out your site organization, it’s time to actually write some content. Creating content can be one of the most difficult aspects of creating a webpage, but it is by far the most important. What you write and even how you write it will influence how search engines find your page, the quality of the user experience, and whether or not users complete the tasks you want them to.
To write effectively for the web, your content should be concise and structured in a manner that helps readers find useful information as quickly as possible.
Writing content for the web can be different than writing for print or other applications. The following tips and resources will help you learn how to write effective, engaging and concise web content.
Tips for writing web content
- Be succinct. Reading on a screen can be about 25% slower than on paper. Keep it brief.
- Write for scannability. Web users tend to skim, so short paragraphs have more impact than a long, detailed text.
- Use headings to break up segments of content and make it easy for users to find topics. Headings provide structure and organization to your web content and help all users navigate your site. In fact, according to the Nielsen Norman Group, the heading is often the only thing on the webpage that people read.
- Instructions and descriptions should be easy to follow and understand. Use plain language and avoid directional terms like “left,” “right,” “top” or “bottom”. Instead, give directions on what users should do. You want to provide enough details so that your users aren’t confused (because that can make them feel like they are doing something wrong), but not so much information that they get lost in the process.
- Perform user testing One thing you can do to make sure your content makes sense is to do user testing. This doesn’t have to be elaborate. Something as simple as having two to three people unfamiliar with the process work through everything can provide you with some good feedback.
Resources for Writing Web Content
Writing both clearly and simply can be a challenge. To learn more about about this topic, review the following resources:
- Be Succinct! (Writing for the Web)
- Headings Are Pick-Up Lines: 5 Tips for Writing Headlines That Convert
- F-Shaped Pattern of Reading on the Web: Misunderstood, But Still Relevant (Even on Mobile).
- Concise, Scannable, and Objective: How to Write for the Web
- Reading Content on Mobile Devices
- The Four Dimensions of Tone of Voice
- Legibility, Readability, and Comprehension: Making Users Read Your Words
- Writing for the Web (Usability.gov)
- Writing for the Web (Rutgers University)
- How to Write for the Web: 23 Useful Rules
- Plain Language Is for Everyone, Even Experts
- WebAIM article: Writing Clearly and Simply
- Rocket Surgery and Accessibility User Testing
Tips for writing hyperlinks
Hyperlinks must be descriptive
Hyperlinks must be descriptive enough to signal to the user what they are going to find when they select the link. For example, take the popular “click here” link description. You don’t really know what’s going to happen when you “click here”, and if there are multiple “click here” links on the same page, it’s difficult to tell what is what. This is especially the case for users of screen readers, who can listen to all hyperlinks on a page out of context.
If you’re viewing the links on a page in context, you may be able to figure out what they mean. However, it’s still not as clear as it could be. Adding in some additional context to the link makes it both more accessible for assistive technology and more usable for everyone.
Hyperlinks must be unique
Links with different destinations must not share the same text. For example, Boise State News and OIT News can’t both have link text of “News.” Instead, if Boise State News is called “News”, then OIT News should have “OIT News” as the link text to make them two unique links.
Hyperlinks must go to a single destination
Additionally, links within the navigation can’t be named the same as a link on a page if they are going to two different destinations. Typically, navigation link names have priority, and links within the page content should be adjusted accordingly.
For more information on writing accessible links, review WebAIM article Links and Hypertext.
About anchor links
Avoid using anchor links in your content. The “jump” experience can be confusing to people with different abilities (especially with Panels content). It is often not apparent to the user if the link is taking you to an anchor on the same page, or a different page.
And, if something may be confusing to most people, it may be even more confusing for those with different abilities.
Use semantic structure
Your headings should follow a semantic numbering. The page title is always heading 1. Therefore, heading 2 should be the first heading used in your page content, followed by heading 3, heading 4, heading 5, or heading 6 as appropriate.
Semantic structure provides a way for both humans and machines to read web text in a consistent and predictable manner. It also provides a method for organizing your information into a hierarchy, where heading 1 is more important than heading 2, and so on. For more information, see the WebAIM article on Semantic Structure
Search Engine Optimization (SEO)
Search Engine Optimization (SEO) should be considered when drafting your web content. Actively managing your keywords, title tags, meta descriptions, and even your page structure can influence how and when your page appears in search engines.
Learn more about Search Engine Optimization (SEO) on Webguide.
What kind of content should I create?
Coming up with good web content is challenging. If you’re getting stuck on what to write for a Boise State website, here are a few recommendations to get you started:
Keep your homepage basic and introductory. Assume this is the first place people will land when looking up information about your department. Don’t get into the weeds about specific processes or requirements here, just give them a general idea and then provide clear pathways toward additional information on supplemental pages.
Highlight stories of real students taking advantage of real opportunities within the department. Tell their stories and show photos of them. This helps both current and prospective students see some of the real ways that other students have expanded their educations outside of the classroom.
Boise State specialties
Write about any research, programs, or centers unique to your department. Boise State is full of one-of-a-kind opportunities for both students and researchers, and the web is often the first place prospective students will learn about them.
Focus on content
Don’t get distracted by aesthetics. Web administrators are often tempted to spend time thinking about how they can make their sites look different than the standard pages at Boise State, but the text is what matters. Students will care that the content they’re looking for is clear and easy to find; they will care that there are inspirational stories of other students succeeding. They won’t care if the page has a layout similar to another department.
Since your content looks different based on the technology used to consume it, you should shift your focus to developing quality content rather than focusing on the visual style of the content. This means letting the theme take care of a lot of the details of how the content looks, and avoiding changing the alignment, relying on color to convey meaning, or underlining text.
Add visual interest to your pages with panels
While changing the way text looks on the page with the visual editor is not accessible, there are several panels built into the Boise State theme that allow you to add visual interest to your webpages.
When considering visual interest, keep the following guidelines in mind:
Most languages, with some exceptions, are read top-to-bottom and left-to-right. Therefore, left-aligned text is easier for readers to scan, read, and comprehend your web content. To keep your text left aligned, try right or center aligning your images.
On the web, users expect underlined text to be hyperlinked. Instead of using underlining to emphasize a point on a webpage, you can use the “strong” tag by highlighting the text and selecting “bold” on the visual editor.
Paste as Plain Text
When you copy and paste content from another source into your webpage, avoid introducing extraneous styling. Paste your content as plain text either by choosing the “paste as plain text” button on the visual editor toolbar, or by typing the keyboard shortcut CTRL+SHIFT+V.
For more information about text, alignment, and other presentational attributes, review WebAIM article Text/Typographical Layout.