site a11y: add missing h1s (#5715)

pull/5824/head
Geoff Rich 4 years ago committed by GitHub
parent bf35353170
commit 6aaa105093
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -18,6 +18,7 @@
<meta name="Description" content="Articles about Svelte and UI development"> <meta name="Description" content="Articles about Svelte and UI development">
</svelte:head> </svelte:head>
<h1 class="visually-hidden">Blog</h1>
<div class='posts stretch'> <div class='posts stretch'>
{#each posts as post} {#each posts as post}
<article class='post' data-pubdate={post.metadata.dateString}> <article class='post' data-pubdate={post.metadata.dateString}>

@ -19,4 +19,5 @@
<meta name="Description" content="Cybernetically enhanced web apps"> <meta name="Description" content="Cybernetically enhanced web apps">
</svelte:head> </svelte:head>
<h1 class="visually-hidden">API Docs</h1>
<Docs {sections}/> <Docs {sections}/>

@ -100,6 +100,7 @@
<meta name="Description" content="Interactive example Svelte apps"> <meta name="Description" content="Interactive example Svelte apps">
</svelte:head> </svelte:head>
<h1 class="visually-hidden">Examples</h1>
<div class='examples-container' bind:clientWidth={width}> <div class='examples-container' bind:clientWidth={width}>
<div class="viewport offset-{offset}"> <div class="viewport offset-{offset}">
<TableOfContents {sections} active_section={active_slug} {isLoading} /> <TableOfContents {sections} active_section={active_slug} {isLoading} />

@ -34,6 +34,7 @@
<meta name="Description" content="Cybernetically enhanced web apps"> <meta name="Description" content="Cybernetically enhanced web apps">
</svelte:head> </svelte:head>
<h1 class="visually-hidden">Svelte</h1>
<Hero <Hero
title="Svelte" title="Svelte"
tagline="Cybernetically enhanced web apps" tagline="Cybernetically enhanced web apps"

@ -29,3 +29,16 @@ h5:hover .anchor,
h6:hover .anchor { h6:hover .anchor {
opacity: 1; opacity: 1;
} }
/* visually hidden, but accessible to assistive tech */
.visually-hidden {
border: 0;
clip: rect(0 0 0 0);
height: auto;
margin: 0;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
white-space: nowrap;
}

Loading…
Cancel
Save