Constructive Group Created with Sketch.

Writing for the Web: Developing Voice, Tone and Editorial Structure

Voice & Tone

Determining the right voice and tone for your online writing is essential to making your readers feel engaged with your ideas. Of course different content demands a shifting tone (if you’re discussing a natural disaster, best not to be too light), but generally speaking, when writing content for your organization’s website, aim for a personal, upbeat tone. You do not want to appear too casual with your readers but you also want to avoid sounding bureaucratic or aloof. Your writing should sound like it was created by a human, not a corporate robot. It can be difficult to get your tone right, but studies show that it has a significant impact on your audience’s perception of your organization. Here are a few key points to keep in mind:

  • Use the active voice—it helps your writing seem less stuffy and it has the added bonus of cutting down on text length.
  • Avoid jargon! Just because a term is common in your organization, doesn’t mean it is well known outside of it. Speak the language of your users.
  • Keep your industry’s standards in mind and be cautious when deploying humor or playfulness. While incorporating this into your tone can help your writing seem friendlier, it can also turn your readers off and even damage your organization’s trustworthiness.
  • When in doubt, seek advice—a second pair of eyes can be crucial in refining and wordsmithing content.

Editorial Structuring

In previous articles, I’ve discussed how to use a hierarchical system for structuring your content. Content structuring also extends into how you unveil the information you’re conveying in your content, i.e. editorial structuring. The approach that fits best with how audiences read on the web is called the “inverted pyramid” style. In short, using the inverted pyramid-style means that you’ll present the most important information at the beginning of your publication, working down to the more discrete details.

  • Stating the main idea of the passage not only helps readers decide whether to engage further with the writing, it also ensures that if they do not read further, they will at least remember the central idea of the passage.
  • This style of writing can also help you structure your content effectively by breaking into smaller portions.
  • Front-loading your content with keywords not only helps your readers understand the central point of your writing, it also has SEO benefits since search engines rank articles with keywords at the beginning of the article higher.


The inverted pyramid of writing shows the most newsworthy information at the top, followed by important details, and at the bottom other general background information.

The inverted pyramid illustrated. From Wikipedia


The” readability” metric refers to the complexity of sentences in individual word choices and sentence structure. Basically, it determines how easy it is to understand your text. While the level of complexity you need to use varies greatly depending on the audience you’re trying to reach, almost all writing can benefit from simplicity and directness.

  • Aim for middle school level (7th/8th grade in the USA), if you are trying to reach a broad audience.
  • Use Word’s grammar proofing function or Hemingway editorto analyze readability. Seeing the complexity of your writing is an illuminating experience that will help you understand patterns in your writing and be more conscientious about its complexity in the future.
  • Keep in mind that writing clearly and intelligibly is your primary goal. Readability tools can only analyze your text, they can’t tell you why your content may be hard to understand. For more information, consider performing a Cloze test on your copy with real users to determine how well readers can comprehend your text.


A screenshot of the Hemingway Editor showing readability.

An example of a piece of text analyzed with Hemingway Editor. Complexity is conveyed through the red or yellow highlight, while suggestions specific words and phrases are given in blue, purple, and green. Example via ShoutMeLoud

Writing with Emphasis

Emphasis is essential to helping your reader understand the relative importance of information within your text, and helps reinforce and build upon the voice and tone established in your writing. Breaking up long passages of text with emphasized words or phrases also supports important points and increases the legibility and readability of your text.

  • Let your defined text styles do the work for you. If you have a style guide set up for your headings, styles for emphasis, etc., stick to it.
  • Don’t try to emphasize specific text too much, use italics and bolding sparingly—if your copy is well-structured with short paragraphs and well-defined sections, you won’t need it. As a rule, less than 10% of your text should be emphasized.
  • It may be tempting to mix emphasis styles (for example, combining bold and italic on one piece of text to show that it’s really really important), but generally this is a bad idea. Combining styles interrupts the reader and looks awkward, which can undermine the credibility of your content. If your readers misunderstand your intent or can’t find important information in your text, it means you have a content structuring problem. If you’re unsure, try getting feedback from your users to find the problems with your content.
  • Avoid using ALL CAPS in your body text. All-cap text is much harder to read than mixed or lowercase text. Additionally, many readers interpret all-cap text as the equivalent of yellingand it can be perceived as overbearing or rude, which is the wrong kind of emphasis you want on your writing! Note that all caps text is different than small caps text, which can be used quite effectively for emphasis, often as a heading style (your design team will figure out if this style is appropriate for your project).

Example of text showing emphasis using only italicization, not bold and italicized

This example from Smashing Magazine shows the correct way to emphasize text. Note that italicized text is best for emphasis when the reader is actively reading a passage, while using bold text brings attention to individual words while the reader is scanning a longer section of text for keywords.

A Note About Migrating Content

When you’ve undergone a website redesign, stray bits of incorrectly-styled text often find their way into your content management system (CMS) when content is migrated over from your old site. This text needs to be cleaned up so the appropriate styles are applied and are consistent with your style guide. For example, you may migrate over a blog entry that applies bold styling to the post heading, rather than the proper format for the assigned heading style. Inspect any content uploaded to your CMS to make sure that it fits with your style guide so that your users are not confused.


Effective writing for the web involves more than just stylistic finesse. Choosing the appropriate voice, tone and structure, ensuring your text isn’t too complex for your audience to understand, and emphasizing the right content all go a long way towards ensuring your ideas make an impact on your online audience.

About the Author

Quinn MacRorie

Quinn MacRorie

Quinn brings a librarian’s sense of organization to Constructive’s information architecture, UX design, and content strategy practices, having earned a masters degree in Library and Information Science from Pratt Institute. Quinn excels at content structuring and creating taxonomies, an invaluable asset to Constructive’s nonprofit clients with content-heavy websites. Quinn works throughout the strategy, design, and development phases of a project, and is particularly passionate about uncovering insights through user research and testing and finding ways to help intellectual organizations make their work more accessible to the general public. Before making the jump to UX and joining Constructive she worked at the ARChive of Contemporary Music and the New York Public Library.

More about Quinn MacRorie
Copied to clipboard http://...