We like to stick to a fairly simple set of guidelines when writing long-form web content. The most important aspect of the way we format content on the site is making sure that it is easily consumable and parsable by our visitors.
We make a few decisions based on other factors like indicating to search engines which content is intended as headings, which takes precedence on the page, etc., but these are all secondary to making sure the content is easily readable and scannable by visitors who are looking for answers about their specific questions.
When to use headlines and which size to choose
One of the biggest tools for making content more accessible is breaking it up into related sections with headlines. The WordPress editor offers the ability to apply several Heading styles to a headline (1-6). We don’t use the Heading 1 style in the body of the article itself. The H1 style is reserved for the title of the article and is handled automatically by WordPress.
The highest level of headline you should use in an article is the Heading 2 style. Use the H2 style wherever appropriate for breaking the content into top-level sections. If you need a sub-heading for sections below H2, use the Heading 3 style.
We prefer to use only the H2 and H3 styles. If another sub-heading is absolutely required, a Heading 4 style is available, but in no circumstances should H5 and H6 be used. If you require that many sub-headings, simply reorganize the content to use H2 and H3 instead.
Paragraph styles
Basic paragraph styling like indentation, line-height, and spacing between paragraphs is handled by the website’s style code. As such, do not manually indent any text or put more than one linebreak (carriage return) between paragraphs. By leaving this kind of formatting to the website’s style code, we can apply changes to these across the entire site from a single source.
In the interest of making the text easier for readers to digest on both desktop and mobile devices, keeping paragraphs to one or two sentences is often preferable to long walls of text.
Inside of paragraphs, you may feel the need to call the user’s attention to a particular word or phrase of special importance (a specific legal term, a common misunderstanding, an item in a series that doesn’t call for a list, etc.). The available styles for this kind of information are boldface, italics, and underline.
Boldface is the preferred method of calling out a particular piece of information, with italics being a secondary method if multiple kinds of information require attention in close proximity but need clear visual separation. Underline should not be used and text should never have multiple transformations applied (e.g. a piece of text should never be both bold and italicized, a headline should never include bold or italicized words, etc.)
Boldface and italics should at most be applied to a phrase. Do not use them to highlight an entire sentence or paragraph. If an sentence requires highlighting, consider using an H3 or blockquote style instead.
Additional formatting
It is often necessary to present the user with a list of conditions, steps, or documents. Two list styles are available for this purpose, ordered and unordered lists.
- Ordered lists automatically number each new line
- They are appropriate when numbering is relevant to the information being presented
- Lists of requirements often benefit from numbering
Lists help break up longer content into more easily scannable chunks, assisting users who are trying to find specific answers in a given article.
- Unordered lists use a bullet for each new line
- They are appropriate when numbering the steps isn’t necessary
Calling out a particularly important sentence can also help break up the walls of text that can happen in particularly detail-dense articles. A useful tool for this is the blockquote element.
This is a blockquote. It helps highlight a specific sentence or sentences that are particularly important.
Confucius
Additionally, for blocks of text that don’t necessarily require a block quote, but which you would like to separate from the rest of the article, you can select the text and apply the preformatted style from the same menu where you select Headline levels.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis quis luctus diam. Etiam posuere efficitur mattis. Donec auctor, massa in convallis aliquet, diam quam imperdiet diam, nec porta mi tortor id tortor.
If you get stuck
If you’re having trouble implementing any of these styles in your own posts, you can always view this post in the WordPress editor view to see how the various styles are implemented.
