Skip link

Skip links help users of assistive technology navigate our site quicker.


Skip links benefit sighted keyboard or switch users by providing them with a way to skip over lengthy menus or filters. Skip links should be absolutely positioned to ensure that when they become visible they do not shift other content.

It’s ok for a skip link to overlap other content on the page, as long as you are still able to tab forwards or backwards to that content. The skip link is very noticeable, and doesn’t disappear immediately. These are deliberate design decisions to ensure that a user tabbing quickly through the page won’t miss the skip link.

For more information see this Nomensa blog about Skip Links.

Storybook failed to load.


Backpack example component.


Check the main Readme for a complete installation guide.


                                                import BpkSkipLink from '@skyscanner/backpack-web/bpk-component-skip-link';
                                                export default () => <BpkSkipLink href="#main" label="Skip to main content" />;


Check out the full list of props on Skyscanner's design system documentation website.


Storybook failed to load.