Skip to main content
Design System
Ver. 2.2.0

This is a older version. Check out the latest version of the design system.

Skip Link

Some people use the tab key on their keyboard to navigate through the links and form elements on a web page. Use the skip link component to help keyboard-only users skip to the main content of a page.

Example

Skip to main content

Sample HTML Code

<a href="#mainContainer" class="govcy-skip-link">Skip to main content</a>

When to use this component

All GOV.CY pages must include a skip link.

How it works

You should place the skip link immediately after the opening <body> tag. However, if you’re using a component that must be read before the user can skip to the main content (such as a cookie banner) , place the skip link immediately after the component.

The skip link component is visually hidden until a keyboard press activates it. The link should give the users the option to bypass the top-level navigation links and jump to the main content (mainContainer) of the page.

Use the link text “Skip to main content” for English and “Μετάβαση στο κύριο περιεχόμενο” for Greek.