# ✎ Technique: Differentiating controls

Placement of controls affects their ease of use. For example, for a search feature, the “submit” button should be positioned right after the input field. Appearance and positioning are particularly important when providing a control that supports “destructive” actions, such as a “delete” or “clear” button. In these cases, ensure that these controls are clearly differentiated .... Read more about ✎ Technique: Differentiating controls

# ✎ Technique: Create a project charter

A well-defined charter helps keep websites focused on meeting the needs of their target audience, ensuring that the site's architecture is logical and that users can find the information they need and complete tasks effectively.

### Example

This is a sample project definition for a (fictional) academic department site.

#### Purpose

Support communication needs and business processes associated with the Department of Rocket Science at Cosmic...

# ✎ Technique: Writing readable content

Readable content is accessible content. You should aim to choose words and sentence structures that are not difficult or unnecessarily time-consuming to read for your target audience.

### Examples

Know your audience, and write in language that’s familiar to them. Even for a specialist audience, there is value in clearly communicating information and concepts when writing online content.

In general, keep words, sentences, and paragraphs short. Remove...

# ✎ Technique: Consistent layout

Consistency is one of the cornerstones of good usability. Although it is possible in advanced CMSs to create radically different page layouts according to content type, it's important that areas outside of the page’s content area remain consistent across the site for wayfinding purposes. This can be controlled through carefully designing and implementing page templates.... Read more about ✎ Technique: Consistent layout

# ✎ Technique: Readable paragraph text

Paragraphs of text are a fundamental core of web content, so it's important to display them in a fashion that is optimally readable to the majority of your audience without requiring them to change their display settings. For people who do need to customize display of text to make it easier to read, it's important to support this customization rather than forcing them to read the text the way you specify.

For the most part, this means applying typesetting best practices, which predate the web.

...

A clear indication that specific form fields are required can save users time and avoid potential errors relating to missing data when a form is submitted.

This indication should be visually distinct without relying on color, and it should also be programmatically available to screen-reader users.

# ✎ Technique: Form error communication

Effectively and accessibly communicate form errors by:

1. Communicating that a form has errors,
2. Communicating any individual errors case by case, including clear guidance on how to address the error.

In part, this involves thoughtful content-writing to clearly and unambiguously help users recover from the error. But it also requires that error messages are...

# ✎ Technique: Session extension

For a number of reasons including data persistence, performance and security, it is sometimes beneficial to terminate idle user sessions.

So that users do not lose data, it's important to warn them of a session that is about to expire and give them the option to continue. This is especially true in the case of people who might take longer to read or interact with a page due to a disability. It's important to make such prompts accessible.

# ✎ Technique: Form feedback with live regions

Providing form feedback accessibly helps users submit data more accurately and reduces the chance for error. For learning resources, easy access to feedback supports the learning process; for forms collecting data, good feedback helps to reduce the chance of input errors being made.

When providing feedback on user input, JavaScript is often employed to print messages to the screen. Users looking at the screen will see the message appear in response to their actions. Screen-reader users who do not...

# ✎ Technique: Input labels

Descriptive labels help users understand the purpose of a form control. Labels should be associated with their controls so that when the input is focused, the label is announced by screen readers.

The heading levels (1-6) are often considered a way of describing and determining the “importance” of a heading, with h1 being the most important. This might be reflected in the visual appearance of headings—higher-level headings typically appear as bigger and bolder text than lower-level headings.

But you can't just put an “important” heading anywhere. Its heading level relates to how much content it refers to, and that has to do with structure.