1.3 Adaptable

Create content that can be presented in different ways (for example simpler layout) without losing information or structure.

Overview

Have you gone to a website on a desktop computer and then gone to the same one on your mobile phone? Did you notice a difference? For example, did the content on the desktop version shift over to be easier to read on the mobile version? Or was the mobile version harder to read because everything you saw on the desktop version was squeezed so small you had to zoom in on it?

As with making content compatible with multiple browsers, you want to allow users to be able to perceive content no matter which senses they can use. This involves using appropriate semantic structures that are separated from aesthetic structures:

Once you have all the elements laid out, you also need to ensure proper reading order. Avoid providing instructions that depend on certain senses (e.g. select the rectangular button, select the red button on the bottom-left, respond after the ding sound).