• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar
Logo for DigitalA11Y

Digital A11Y

Your Accessibility Partner

  • About
  • Articles
  • WAI-ARIA
  • WCAG
  • Resources
    • Cheat Sheets
    • A11Y Blogs
    • A11Y Toolkit
  • Contact
You are here: Home / Web Accessibility / WCAG / Understanding SC 2.4.1 Bypass Blocks

Understanding SC 2.4.1 Bypass Blocks

Last Modified: April 4, 2018 by Raghavendra Satish Peri Leave a Comment

2.4.1 Bypass Blocks: A mechanism is available to bypass blocks of content that are repeated on multiple Web pages. (Level A)

The intent of this success criterion is to provide a skip mechanism that will enable the users skip the repeated content blocks such as navigational menus, advertisements or help the users to jump to a particular location on the web page. The mechanism can comprise of “Skip links”, landmarks and/or headings or a combination of any of these.

While Assistive technologies such as screen readers provide a mechanism to jump according to headings, landmarks, lists & form controls it is always a best practice to provide a skip link at the top of the page & where ever it is appropriate.

Example

Jump to References

Code

<a href=”#jump”>Jump to references</a>
<h2 id=”jump”>references</h2>

Video On How to Provide Skip Links

In the above example we have used id method to create a skip link & this is one of the easy ways to provide skip links. There are more optimized ways of providing skip links! Checkout the scripts provided by PayPal.

Points to Remember

  • Provide a skip link on top of the page to skip navigational menus.
  • Provide skip links to navigate to content on a large page.
  • Make sure that skip link is visible when it receives focus.
  • Make sure that purpose of the link is clear, provide skip link text as skip to main content or skip navigation etc.
  • When providing ARIA landmarks, ensure multiple landmarks of the same type is not provided.
  • If provided, ensure to use aria-label to assign unique names to such landmarks
    “Primary navigation”, “secondary navigation” etc.

references

Understanding Success Criterion 2.4.1

Share A11Y Love

  • Twitter
  • LinkedIn
  • Facebook
  • Reddit

More Accessibility Articles

Filed Under: WCAG Tagged With: bipass blocks, landmarks, navigation, skip links

About Raghavendra Satish Peri

Raghavendra Satish Peri is a digital accessibility evangelist working at Deque Systems as Product Manager [Accessibility]breaking web accessibility & mobile accessibility challenges. He authors an Accessibility Blog at DigitalA11Y.com & is galvanizing the adoption of accessibility by inspiring the local tech community with meetups and mentorship. He propelled this thought by founding HelloA11y.com, a community of accessibility professionals, developers and enthusiasts. When away from his computer, Raghava can be found at local cafes & restaurants sampling cuisines, attending local meetups, listening to audio books or writing on his Personal Blog at raghava.in.

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Primary Sidebar

Get Digital A11Y in Your Inbox

Recent A11Y Articles

  • A Sneak peek into WCAG 3.0 First Public Draft
  • Understanding SC 4.1.3 Status messages
  • Understanding SC 2.5.4 Motion Actuation
  • Understanding SC 2.5.3 Label in Name
  • Knowbility looking for mentors in its Accessible Internet Rally

Recent Comments

  • Raghavendra Satish Peri on Foresee Your Colors: Tools to Evaluate your design for Color contrast Accessibility
  • Raghavendra Satish Peri on Digital Accessibility Companies Roundup
  • Andrew Somers on Foresee Your Colors: Tools to Evaluate your design for Color contrast Accessibility
  • Regine Lambrecht on Digital Accessibility Companies Roundup
  • william hruska on 18 Free Mobile Accessibility Testing Tools

A11Y Categories

  • Design
  • Events
  • HTML
  • IOS
  • Mobile Accessibility
  • News
  • Tools
  • WAI-ARIA
  • WCAG
  • Web Accessibility

  • Privacy Policy
  • Sitemap
© 2021 Digital A11Y