On-page content structure

 
Web Design User Interface Website illustration.

Easy-to-read headlines and content

Users tend to scan web pages to get the information they need. And many do so from their mobile devices. Make your headlines clear and short, and break up text into easy-to-read chunks. This helps them find what they need fast. On this page, you’ll learn:

  • How to write proper headlines and sub-headlines
  • Tips to create scannable content
  • The benefits of a component-based design system

Headlines and sub-headlines 

 

CT.gov uses sentence case for headlines and sub-headlines. This follows AP style and makes your content easier to read and scan quickly. Follow these guidelines when writing headlines for your CT.gov site.

  • Use sentence case - CT.gov uses sentence case for all headlines, sub-headlines, and links. This means capitalizing the first word and proper nouns, like you would in a sentence. This is the default setting for our design system.
    • Special cases: Your agency may have unique items that you refer to as proper nouns (i.e. a benefit program, a published report, an agency division, etc.), which currently use title case. You can continue using title case for those items, but the rest of the headline should be in sentence case. Example:
      • Correct: How to request a form from Public Records
      • Incorrect: How to Request a Form from Public Records
  • Be specific - Top headlines should briefly identify what’s on your web page.
  • Consider length - Your top headline should not exceed more than three lines (visually) on a mobile device.
  • Add sub-headlines - Sub-headlines should be no more than 30 words and/or 70 characters.
  • Include keywords - Top headline should include your top keyword with a summary of on-page content. It reassures readers and search engines that they’ve landed in the right place.

Make it easy for people to scan your content 

 

Customers should be able to scan your content and understand the main objective without having to read through a wall of text. This will save them time searching for answers. Your copy should be easy to understand and navigate on a mobile device. Follow these guidelines to ensure your content is scannable.

  • Use plain language - Write content at a sixth grade reading level. Avoid complicated phrases and government jargon. Remember to test your copy for readability. This ensures your content is accessible to a broader audience. Learn more about plain language.
  • Use lists - When possible, use bulleted or numbered lists to summarize key points. This makes it easy for someone to quickly understand a topic, without having to read a whole wall of text.
  • Use small content chunks and limit word count - Create small, easy-to-read content chunks and avoid lengthy sections of text. For sentences, keep it to 15-20 words. For paragraphs, aim for three to five sentences.
  • Optimize headlines - Since headlines and sub-heads are prominent, readers will naturally gravitate to them.
  • Add images - Pictures speak a thousand words! Use images to reinforce key messages and direct people’s gaze.
  • Write for mobile devices - Since mobile devices are becoming the dominant platform for web traffic, content should reflect that!
Desktop, tablet and mobile devices

Component-based design

Most CT.gov sites use the same content management system: Sitecore. Sitecore leverages components, instead of designers creating a custom design for every page. This component-based design helps to reduce errors and ensure consistency across all the CT.gov websites.

In fact, the section you're reading right now is using a component called "Lead Story". It features a large image attached to a section of copy. The “Helpful Tips” section below uses a component called the “Accordion drop-down.

Want to learn more about all the components you can use on your own agency web pages?

Visit the Sitecore component guide now  

Helpful tips

Related pages

Using images 

Learn about the importance of using images in your content.

Writing for mobile devices 

Making sure your content is optimized for mobile devices.