'Removing Main Heading menu from a page - Web Accessibility [closed]

I have a web page with a main Menu or Main navigation in the header. Like below

enter image description here

This header menu is present across all the pages.

Requirement is to remove this main header menu from one particular page.

enter image description here

Few questions below:

  1. Does removing the main menu violate any of the WCAG 2.1 guidelines?
  2. Is it legal to remove the Main heading Menu from a page?
  3. Will this change cause any accessibility issue?
javascripthtmlaccessibility


Solution 1:[1]

The section of WCAG that you're going to need to meet is 3.2.3. Consistent Navigation.

Success Criterion 3.2.3 Consistent Navigation (Level AA): Navigational mechanisms that are repeated on multiple Web pages within a set of Web pages occur in the same relative order each time they are repeated, unless a change is initiated by the user.

I'd also recommend reading the sufficient techniques and failures.

It's a common practice in landing page development to remove any navigation elements from the page. I don't believe that this alone would be a failure, as long as you're not dynamically removing the menu after page load.

What you need to be mindful of is that you're not offering different navigation on different pages of the site, and that if a navigation menu is present on the page, then it needs to be in the same place on each page it appears.

I don't believe that the absence of a navigation menu necessarily results in a failure. The failure example given specifically states that the page in question must have a navigation menu present in order to fail.

Solution 2:[2]

Accessibility is about making sure your website is available to the greatest number of people. Removing things from the page so that no one has access to them is not an accessibility issue. There's nothing to give access to, so to speak.

However, if you "remove" the menu by making the opacity transparent or by "pushing" the menu off the screen and don't really remove the menu from the DOM or use CSS display:none, then that would cause an accessibility issue.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Josh
Solution 2 slugolicious

Related Questions