Placement of the Exit this Page button

[calvin-lau-sig7]

Problems we wanted to solve

For ‘Exit this page’ to work for users, the button needs to be consistently visible amongst any page content and easy to activate.

What we decided

We decided to position the button on the right hand side of the page template, within the width container under the header and inline with the page title. The component “sticks” to the top of the viewport when the end user scrolls down past the component’s original position.

Considerations we made

We’re conscious that this is different from the typical best practice of positioning important information and interactions on the left hand side of a page.

With the button positioned on the right hand side, we’re also conscious that typical best practice would employ a visual element which users can follow to that same information or interaction on the right of the page, such as a line of text. These are usually added so that screen magnification software users are more likely to see the element in question.

Our rationale

The original intent of this design choice was:

• to avoid the button interacting negatively with content in the left-side two thirds of the width container, where primary page content is typically placed
• a minor failsafe to reduce the chance of the button being seen at a glance by a potential observer

Our rationale also meant that adding a visual element to draw the eye towards the button was not needed, as this would have been counterproductive.

Results

We think that this does not create barriers for screen magnification users because:

• we advise teams to tell users that the button exists and what it does before the service starts
• we give users alternative ways to activate the button, via a keyboard shortcut and via an additional skip-link version of the component near the beginning of the accessibility tree

Supporting this decision

We are confident in this assessment as we have tested our implementation with users with assistive tech needs and audited our implementation via DAC.