-
Notifications
You must be signed in to change notification settings - Fork 4.5k
Description
A skip link helps users skip repetitive blocks of content, like a header area and top navigation menu.
A skip link needs to:
-
Be the first focusable object on the page
-
Become visible when it receives focus
-
Point to the content area of the site correctly
-
A skip link may be hidden until it receives focus.
-
Multiple skip links may also be used.
This is part of the WCAG guideline stating that a website must be navigable.
https://www.w3.org/TR/UNDERSTANDING-WCAG20/navigation-mechanisms-skip.html
https://make.wordpress.org/themes/handbook/review/accessibility/required/#skip-links
Theme authors add this to their theme as the first element of the body manually, or
by using wp_body_open().
The target is usually the ID of the content wrapper, for example the main landmark.
Because this is an accessibility feature, it should be available for all themes,
not relying on the theme author to remember to add it.
Because the skip link must be the first element of a page, it is not suitable for a
paragraph block with a link and a skip-link CSS class, because the block can then be moved and removed.
Here is one thought on how the skip link could work for FSE,
props @aristath:
If the template in FSE contains a "content" block, then we could add an ID to it and automatically
add the skip-link.
If there is no content block, then the skip-link would point to the loop block.
If there is no loop-block either, then make an educated guess and point to the 1st title or p block.