Uncategorized WCAG WCAG Success Criterion

Orientation (1.3.4 AA)

“Content does not restrict its view and operation to a single display orientation, such as portrait or landscape, unless a specific display orientation is essential.” (WCAG 1.3.4 Orientation)

Who is it for?

Not everyone has the luxury of being able to quickly and easily rotate their display. Some devices, like a tablet or phone mount on a wheelchair, are mounted at a fixed orientation. Your website or application should not restrict the user from using it’s full functionality no matter what orientation they choose to view it at.

What is important to know?

This does not compete with user initiated orientation locks. In fact, it is meant to support this setting.

It, also, doesn’t apply to items apps or websites that are “essential”. The examples that WCAG gives are “a bank check, a piano application, slides for a projector or television, or virtual reality content where binary display orientation is not applicable”. Basically, unless you have a really great reason to restrict orientation… don’t.

How do I code it?

In your CSS ensure that you aren’t removing content at different orientations. If you are using @media queries to change or remove content when the orientation is changed. Having a @media queries will not cause you to fail this requirement, but if they remove content in one view or they remove functionality then it will fail to meet the requirement. The content may be rearranged at different views. In landscape, text may be arranged in two columns, but in portrait the text may be in a single column. This would not be a failure of the requirement, but if content in the second column is hidden at portrait mode it would be a failure to meet it.

The means to achieve a function may change in different views, but the ability to perform the functionality may not be removed. in other words, you may not have an “edit” button on landscape view, but not in portrait view. The ability to “edit” must be available in both orientations.

Leave a Reply