Text & Headings

Use this section as a lead-in to introduce page content if necessary. Introductory text is optional and should be short and to the point.

Create accessible content

To ensure that people of all abilities can read and understand content on our website, here are a few guidelines to keep in mind:

  • Write simply and clearly.
  • Be concise.
  • Use the built-in features for text and headings.
  • Avoid able-assumptive language.
  • Create structure with headings.

Write simply & clearly

Simple and clear language helps people with autism, non-native speakers, people who are hurried or stressed, or people with dyslexia and other cognitive differences.

It’s recommended to use:

  • language at an 8th or 9th grade reading level.
  • short sentences with simple tenses.
  • short blocks of text.
  • one space after periods or other sentence-ending punctuation.

The Hemingway Editor is a great tool that evaluates passages of text for reading level and length. You can edit text and get feedback in real-time.

Be concise

Some people may rely on an assistive technology to read our website. Keep in mind that it can take several minutes for a screen reader to read through a page. Users relying on a screen reader can’t skim or simply scroll past something, so lengthy passages of text can be cumbersome. Therefore it's important to be mindful about how much text you add to a webpage.

Use built-in features for text & headings

The font style, size, and color of body text (including headings) is predefined by our website style sheet. You should always use the predefined heading styles found in the dropdown of the text editor toolbar. Be sure to choose the correct heading level for your needs and never choose a heading because of the way it looks.

The options for selecting heading levels is located in a dropdown menu of the text editor.
The CMS will automatically apply font and color styles to the selected heading chosen from the dropdown in the text editor.

We encourage you to perform a spell check before submitting a page for publish. To check spelling, click the spellcheck button in the text editor toolbar.

The option to check for spelling is available in the toolbar.
The spellcheck button is indicated by "ABC".

Avoid able assumptive language

Another way to optimize our text for a11y is to avoid Able Assumptive Language.

Avoid describing something by the way it looks

Phrases like "the blue button" and "the right side menu" are irrelevant to someone using a screen reader. A button they come across has no color and there is no right or left side.

Be mindful of verbs that assume ability

Avoid phrases like "click the button". If someone is navigating a page using something other than a mouse and keyboard—like a screen reader or voice control—they will not be clicking on buttons or scrolling the page.

If there is a resource you need to highlight, include a link to the resource in the text. 

For example: 

  • Bad (do not do this): Click the 'Tuition and Fees' link in the right side navigation for more information.
  • Good: For more information, visit the Tuition and Fees page.

Create structure with headings

Well-structured content is one of the easiest ways to improve page accessibility. Large blocks of text can be overwhelming and difficult to extract necessary information.

Headings make it easier for users (both sighted and visually impaired) to scan page content. It's considered best practice to make sure headings clearly describe the content of each section and provide an outline of the page. For an inclusive user experience, it's important to structure a web content like you would a document, with headings and subheadings.

Watch this short Screen Reader Demo for Digital Accessibility from Mark Sutton, web services director at the University of California, San Francisco, to better understand how heading structure effects page accessibility.

How to use headings

There are six levels of section headings used in HTML code, conveniently referred to as H1 through H6. H1 is the highest level and H6 is the lowest level. Heading levels should form an outline of your page content and should never be skipped.

The following are best practices for structuring headings:

  • H1 is reserved for the title of the page and will already be set for you by the web team. There should only be one H1 per page.
  • H2 is used as subheadings beneath the main heading (H1). A page can contain multiple H2s.
  • Use additional subheadings (H3 through H6) as needed, if there are subheadings within subheadings in your page content.
  • Avoid using a heading simply because of they way it looks. Headings should be structured according to the hierarchy of your document.

Below is an example of page heading structure. Visit the live Climate Change page to see heading structure in action.

  • Climate change (H1)
    • What is climate change? (H2)
    • Drivers of climate change (H2)
      • CO2 emissions (H3)
      • Cutting down forests (H3)
        • How forests remove CO2 (H4)
      • Farming livestock (H3)
    • Solutions to reduce climate change (H2)

How to format headings

The following are best practices when formatting headings:

  • Heading text should never be bolded, underlined, italicized, or linked—avoid adding extra formatting to headings.
  • Use an ampersand (&) instead of "and" in headings
  • Headings should be typed in sentence case—capitalize only the first word of the heading and any proper nouns. Examples typed in sentence case:
    • Campus life at Goucher
    • Explore our academic programs
    • Financial aid & scholarships

Have questions about the use of headings on the web? Contact the web team.

Consider voice & tone

When writing for the web, it's important to consider your audience. Are you writing for prospective students or faculty? Parents or current students? In general it is best to use a more informal and personal voice.

Bad Example:

Prospective students who are interested in learning more about Goucher College should commence their exploration on the Prospective Student page, which provides information related academics and campus visits. Once the student reviews this information, he or she should continue on the Apply page.

Good Example:

Interested in learning more about Goucher College? To get started, check out the Prospective Student page, where you'll find information such as academics highlights, campus visits, and more. When you're done there, head over to the Visit page to learn about life on campus.

Choose the correct emphasis

At times, you might want emphasize specific words of your text. You can do this by using a bold font weight. Do this by selecting your text and clicking the "B" icon in the edit toolbar.

Do not use these mechanisms for emphasizing text:

  • ALL CAPS—considered yelling
  • underlined—reserved for links
  • italics—used for book titles, magazine titles, etc.

Search Engine Optimization (SEO)

To improve search rankings and attract more visitors to Goucher’s website, use keywords that align with what users are searching for. Since headings carry more SEO weight, naturally incorporate relevant terms in both headings and body text. For a list of keywords for your department, contact the web team.

Additional resources for writing on the web

The following resourses will help you create accessible content for the web:

Need additional help? Find more tutorials on the CMS Tutorials page or contact the web team.