To view the skip link component tab to the example, or click inside the preview and press tab.

{{ aspExample({ code: "<a class=\"skip-link\" href=\"#main\">Skip to content</a>", nunjucks: "{{ aspSkipLink() }}", title: "", id: "65a92ec698a5d", url: "" }) }}

How it works

This component should follow the leave button (if present) or be the first component within the order of the page.

Status of development

The below criteria all need to be met for a component to be considered as fully developed for use within the ASP Digital Design System.


{{ aspTable({
head: [
{ text: 'Development criteria'},
{ text: 'Status'}
],
rows: [
{
cells: [
{ text: 'WCAG 2.2 compliant'},
{ html: '<span class="status">Not started</span>'}
]
},
{
cells: [
{ text: 'WCAG 2.1 compliant'},
{ html: '<span class="status status–green">Completed</span>'}
]
},
{
cells: [
{ text: 'HTML / Nunjucks version'},
{ html: '<span class="status status–yellow">In Progress</span>'}
]
},
{
cells: [
{ text: 'Figma version'},
{ html: '<span class="status status">Not started</span>'}
]
},
{
cells: [
{ text: 'M365 versions'},
{ html: '<span class="status status">Not started</span>'}
]
},
{
cells: [
{ text: 'Documentation'},
{ html: '<span class="status status–yellow">In progress</span>'}
]
}
]
}) }}