Start with the task

People arrive at a service with a purpose. They might want to report a problem, understand a requirement, or find out what happens next.

A useful page makes that purpose visible. Its title names the task, its introduction explains what the service offers, and its content answers the questions a person is likely to ask before taking action.

Consider a page for reporting a maintenance issue. The visitor needs to know which problems can be reported, what information to prepare, and when to expect a response. A short, direct explanation gives them a starting point.

A good page helps someone move from a question to a confident next step.

Give content a structure

Clear headings let readers scan before they commit to reading. Each heading should describe the content that follows, and each section should develop one idea.

The page layout can reinforce that structure. Keep the main reading column comfortable, give related paragraphs enough space, and distinguish supporting information from the central message.

A useful order for service information

  1. Explain what the service does and who it is for.
  2. Describe any requirements or information to prepare.
  3. Show the action the visitor can take.
  4. Explain what happens after that action.

This order is a starting point. The content and the reader’s situation should determine what needs to appear first.

Make the next step clear

Every control should communicate its purpose. A link called “View application requirements” gives readers more information than a generic “Click here.” A button called “Submit report” explains the action it performs.

Forms need the same clarity. Keep labels visible, explain unusual requirements before someone starts typing, and place helpful errors near the relevant field. After submission, confirm what happened and tell the person what to expect.

A practical content check

Read only the page title, headings, and action labels. Can you still understand the task and the route through it?

Include more people

Readers may use a phone, magnify the page, navigate with a keyboard, or listen with a screen reader. A resilient layout accommodates those different ways of reading and interacting.

  • Use meaningful HTML elements and a logical heading hierarchy.
  • Keep reading order and keyboard order consistent.
  • Provide visible focus and understandable control labels.
  • Let content adapt to small screens and enlarged text.
  • Use readable contrast and avoid conveying meaning through color alone.

These choices belong in the first design draft. Review the full accessibility requirements using the W3C WCAG 2.2 quick reference.

Test the whole journey

A page can look polished while leaving readers unsure. Ask representative users to complete a realistic task and observe where they pause, misunderstand a label, or need help.

Combine those observations with practical checks: try keyboard navigation, enlarge the text, inspect the mobile layout, and review the page with appropriate accessibility tools.

Then improve the parts that prevent people from succeeding. The strongest evidence for a layout is whether readers can understand the information and complete their task.