Adding Content in WordPress

Whether you are writing your content directly in WordPress, reviewing content already in WordPress, or adding prewritten content to WordPress, this is the guide for you!

If you writing directly in WordPress, make sure to also follow the Copywriter guide.

More detailed explanations about why things are done can be found in the Google doc, Accessible Content Guidelines.

Basic Content

Do these when adding content

• Use “paste and match style” or another tool to ensure you are not bringing over extraneous HTML from word processors like Microsoft Word, Apple Pages, Google Docs, or other websites. This is shortcut key Cmd+Shift+V on Mac, and Ctrl+Shift+V on Windows.
• Stick to the font sizes that are set for your website. If you have an issue with how the font size is presented on the website, contact your developer.
• When formatting text, use CSS classes from your developer.
• Use the blockquote element for quotations.
• Use Grammarly or similar grammar-checking tools.
• The first time you use an acronym or abbreviation, make sure that you spell it out.

Avoid these when adding content

• Avoid using the blockquote element for text that you merely wish to style. Contact your developer for CSS classes.
• Avoid long paragraphs. On the desktop, it shouldn’t be more than 4-5 lines. Add line breaks if the content you were given has paragraphs that are too long.
• Don’t use strikethrough text. It requires special markup for screen readers, as it is read exactly the same as all other text.
• Don’t double-space sentences. One space between the period and the start of the next sentence.
• Justified text is prohibited.
• Don’t change languages within your content. Changing to a different language, even for a single word or two requires special markup.
• Don’t underline text. As a content editor, you should never be using underline.
• Don’t use all caps. Don’t use caps lock when writing except for with acronyms. If you have a lot text already written, then use ConvertCase to correct your content.

Headings

Do these when adding headings

• Each page should have exactly one h1 tag. This is the first heading on the page.
• Use proper heading order. Headings should make a table of contents for your content. Don’t jump from h2 to h4.
• Keep the same case structure when entering all headings on a given site. This should be either Sentence case or Title case.

Avoid these when adding headings

• Avoid using headings to style text. If you need text styled, contact your developer for what CSS classes to apply to the text.
• Avoid any inline styling of headings. That means trying to change the font size, family, weight, or color by using page builder settings. Bold and italic are permitted when they use <strong> and <em> markup.
• Avoid all caps. Don’t use caps lock when writing except for with acronyms. If you have a lot of text already written, then use ConvertCase to correct your content.
• Don’t use symbols, emojis, and memes.

Links & Buttons

Do these when adding links & buttons

• Be consistent when labeling links. If two links go to the same page, make sure that is clear based on the link text. If two links go to two separate locations, make sure they have different link text.
• Make sure links are clearly understood. “Click here” is poor link text. “Read my article about dinosaurs” is a better link text.

Avoid these when adding links & buttons

• Avoid overriding the color, font, size, or other settings on a button-by-button basis. If a desired alternate button look is needed, contact your developer for a CSS class to use.
• Avoid opening all links in a new window, especially to your own site. The exception is links within user directions (like for a form). If there are links within user directions, open those in a new window.
• Avoid naked links. https://google.com written on the page is a naked link.

Images

Do these when adding images

• Crop & compress images before uploading to the website. JPG is the general default format for images. If the image includes lines, then frequently PNG is better.
• Upload images with names that clearly identify the image. “Jane Smith 2023 Headshot.jpg” is a good name. “IMG23423.jpg” is not.
• Write appropriate alt text for images. Alt text is context-sensitive so the same image may have different alt text depending on usage. The alt text decision tree explains further.
• End alt text with a period.

Avoid these when adding images

• Don’t use symbols, emojis, or memes.
• Don’t use animated gifs.
• Don’t use text overlayed on an image.
• Don’t use an image of text. For example, if there was a fancy heading in the content you were given, contact your developer for assistance in how to add that.
• Don’t repeat alt text as a caption. If you are using a caption, then empty alt text may be appropriate.

Color

Do these when including colors

• Use CSS styles from your developer to add colors if needed.
• If your content includes colors, make sure colors match people’s expectations.
• Red and orange for errors, warnings, and the concept of “no”.
• Green for proceed, correct, and the concept of “yes”.
• Blue for links or informational notes.

Avoid these when including color

• Don’t use color alone to convey meaning (ie: don’t use a green square to mean “yes” and a red square to mean “no”).

Forms

Form rules to follow

• Use dedicated form-building plugins, such as Gravity Forms, Fluent Forms, or WS Forms.
• Form fields always have a visible label.
• Use descriptions when appropriate. Place descriptive text after the label and before the input field.
• If the form allows you to write error messages, make sure they are clear. Ie: “First name field must be filled out and include at least 1 character”.
• Clearly indicate required fields using the word “required” at the end of the label. Some form plugins will do this automatically, some you will need to add the word.

Avoid with Forms

• Don’t use forms provided by page builders.
• Don’t use placeholder text.
• Avoid character limits whenever possible. Remember, some people do actually have a first name that is only 1 or 2 characters. If you do have a field length limit (such as no more than 255 characters), make sure it is reasonable and there are clear error messages.