11 · Page Integrity when Zooming, Resizing Text or using Device Motion
Most browsers allow text and images to be enlarged through a zoom feature or text-resize. This has become more and more useful as web developers appear to be reducing the general size of fonts used which can affect those with visual acuity difficulties and older people. Zooming can improve readability but there are times when it also affects the layout of websites - reflow needs to be possible at 400% and no overlaps at 200%. Users may wish to change text and line spacing, checks need to be undertaken to see no overlaps or clipping of content occurs.
When content changes or action alter on a device by rotating or shaking, alternatives must be provided. For example a fixed device or one used by a person who cannot change the orientation or use motion for an action still offers a way of making the change in an alternative manner.
Outcomes and Scores
This test has 4 possible outcomes.
| Outcome | Score |
|---|---|
| Layout and readability maintained when zooming. Presence of control that allows locking orientation of screen in both landscape and portrait orientations, without loss of content/functionality. Displays/Fits all labels and input fields on reflow. | 100% |
| Minor layout problems; site is otherwise readable when zoom reaches 200% and reflow occurs at 400%. Text and line spacing has only minor overlaps or clipping and alternative controls offered for actions using motion. | 67% |
| Layout changes impairs readability when zoom has not even reached 200%. No reflow at 400% and user cannot use alternatives to motion but can stop actuation. | 33% |
| Content of site is not usable when magnified. Page content does not zoom using browser tools. No control that allows users to switch between orientations (landscape and portrait) other than movement. Fixed size containers and fixed position for content. | 0% |
Disabilities
The results of this test are taken into account when calculating accessibility scores for the following disabilities.
Techniques
The following technique may come in handy when running this test.