1
0
Fork 0
mirror of https://git.sr.ht/~seirdy/seirdy.one synced 2024-12-24 01:42:10 +00:00

Make the skip-link point to h1 instead of main

Link targets need to be focusable to work with VoiceOver.

Making <main> focusable causes some side-effects, like making the TAB
key go to the beginning of <main> instead of the element after the
currently-clicked region.

Also removes the annoying outline around "main" in some non-mainstream
browsers, without having to add extra CSS.
This commit is contained in:
Rohan Kumar 2022-07-13 08:31:20 -07:00
parent 5b4832df15
commit ff0c7deafa
No known key found for this signature in database
GPG key ID: 1E892DB2A5F84479
13 changed files with 24 additions and 20 deletions

View file

@ -152,7 +152,7 @@ html {
margin: -.75em -.25em;
}
header a[href="#main"], /* skip link */
a[href="#h1"], /* skip link */
div[itemprop="comment"] dd > a ,
footer > nav,
/* List items with direct hyperlink children should only have one hyperlink. */
@ -187,13 +187,13 @@ html {
}
/* skip link: make it invisible until focused, and put it on the top. */
header a[href="#main"] {
a[href="#h1"] {
position: absolute;
top: -2em;
padding: 0 .25em;
}
header a[href="#main"]:focus {
a[href="#h1"]:focus {
top: 0;
}
}

View file

@ -14,7 +14,7 @@
{{ $resources = $resources | append (resources.Get "css/print.css" | resources.ExecuteAsTemplate "print.css" .) -}}
{{- $css := $resources | resources.Concat "css/style.css" | minify -}}
<style>{{ $css.Content | safeCSS }}</style>
<meta name="robots" content="noindex,nofollow" />
<meta name="robots" content="noindex,nofollow,nosnippet" />
<title>{{ .Title }}</title>
{{ if not (in site.BaseURL ".onion") -}}
{{ $icon_svg := resources.Get "/favicon.svg" | resources.Fingerprint "md5" }}
@ -28,6 +28,7 @@
</head>
<body>
<header>
<a href="#h1">Skip to content</a>
<nav aria-label="Global">
<ul>
<li>
@ -45,11 +46,14 @@
<li>
<a href="/about/">About</a>
</li>
<li>
<a href="/meta/">Meta</a>
</li>
</ul>
</nav>
</header>
<main>
<h1>{{ .Title }}</h1>
<h1 id="h1" tabindex="-1">{{ .Title }}</h1>
{{ partial "processed-content.html" . -}}
</main>
<footer>
@ -62,7 +66,7 @@
<a rel="source" href="{{ .Site.Params.src }}">Source code</a>
</li>
<li>
<a rel="alternate" href="http://wgq3bd2kqoybhstp77i3wrzbfnsyd27wt34psaja4grqiezqircorkyd.onion{{ .RelPermalink }}">Tor mirror</a>
<a rel="alternate" href="http://wgq3bd2kqoybhstp77i3wrzbfnsyd27wt34psaja4grqiezqircorkyd.onion/">Tor mirror</a>
</li>
<li>
<a href="{{ site.BaseURL }}privacy/">Privacy</a>

View file

@ -1,7 +1,7 @@
{{ define "main" -}}
<main id="main" tabindex="-1"
<main
itemprop="mainEntity" class="h-feed hfeed" itemscope="" itemtype="https://schema.org/DataFeed">
<h1 id="bookmarks" class="p-name" itemprop="name headline">My book&#173;marks</h1>
<h1 id="h1" tabindex="-1" class="p-name" itemprop="name headline">My book&#173;marks</h1>
{{ partial "processed-content.html" . }}
<p role="doc-tip">
Timestamp format: <code>YYYY-MM-DD HH:MM</code>, as per <cite><a href="https://www.ietf.org/rfc/rfc3339.txt">RFC 3339</a></cite>

View file

@ -1,5 +1,5 @@
{{ define "main" -}}
<main id="main" tabindex="-1"
<main
itemprop="mainEntity" class="h-feed hfeed" itemscope="" itemtype="https://schema.org/DataFeed">
{{ partial "processed-content.html" . }}
<p role="doc-tip">

View file

@ -1,7 +1,7 @@
{{ define "main" -}}
{{- $canonicalRelPermalink := .RelPermalink | replaceRE "^/~seirdy/" "/" }}
<main id="main" tabindex="-1">
<h1>Search</h1>
<main>
<h1 id="h1" tabindex="-1">Search</h1>
<p role="note">This page is an unfinished work-in-progress.</p>
{{ partial "search.html" . }}
<hr />

View file

@ -1,6 +1,6 @@
{{ define "main" -}}
{{- $canonicalRelPermalink := .RelPermalink | replaceRE "^/~seirdy/" "/" }}
<main id="main" tabindex="-1"
<main
itemprop="mainEntity" itemscope="" itemtype="https://schema.org/Article" itemid="{{ .Site.Params.CanonicalBaseURL }}{{ $canonicalRelPermalink }}">
{{ partial "full-article.html" . }}
</main>

View file

@ -1,6 +1,6 @@
{{ define "main" -}}
{{- $canonicalRelPermalink := .RelPermalink | replaceRE "^/~seirdy/" "/" }}
<main id="main" tabindex="-1">
<main>
{{- $articleTag := printf `<article class="h-entry hentry" itemprop="mainEntity" itemscope="" itemtype="https://schema.org/Article" itemid="%s%s">` .Site.Params.CanonicalBaseURL $canonicalRelPermalink -}}
{{ partial "full-article.html" . | replaceRE `<article class="h-entry hentry">` $articleTag | safeHTML }}
<hr />

View file

@ -1,6 +1,6 @@
{{ define "main" -}}
<main id="main" tabindex="-1">
<h1 id="seirdys-home">Seirdys Home</h1>
<main>
<h1 id="h1" tabindex="-1">Seirdys Home</h1>
<p itemprop="description">{{ .Site.Params.Description }}</p>
<hr />
<div class="narrow">

View file

@ -1,6 +1,6 @@
{{ define "main" -}}
{{- $canonicalRelPermalink := .RelPermalink | replaceRE "^/~seirdy/" "/" }}
<main id="main" tabindex="-1">
<main>
{{- $articleTag := printf `<article class="h-entry hentry" itemprop="mainEntity" itemscope="" itemtype="https://schema.org/Article" itemid="%s%s">` .Site.Params.CanonicalBaseURL $canonicalRelPermalink -}}
{{ partial "full-article.html" . | replaceRE `<article class="h-entry hentry">` $articleTag | safeHTML }}
<hr />

View file

@ -1,6 +1,6 @@
{{- define "main" -}}
{{- $canonicalRelPermalink := .RelPermalink | replaceRE "^/~seirdy/" "/" }}
<main id="main" tabindex="-1"
<main
itemprop="hasPart" itemscope="" itemtype="https://schema.org/SocialMediaPosting" itemid="{{ .Site.Params.CanonicalBaseURL }}{{ $canonicalRelPermalink }}">
<link itemprop="isPartOf" href="{{ .Site.Params.CanonicalBaseURL }}/" />
{{ partial "full-article.html" . }}

View file

@ -1,6 +1,6 @@
<article class="h-entry hentry"><!--Once WAI-ARIA 1.3 gains traction, I'll add aria-details for webmentions.-->
<header>
<h1 itemprop="name headline" class="p-name entry-title">{{ .Title }}</h1>
<h1 itemprop="name headline" class="p-name entry-title" id="h1" tabindex="-1">{{ .Title }}</h1>
{{- if not .Params.disableMeta -}}
{{- partial "post-meta.html" . -}}
{{- end -}}

View file

@ -1,5 +1,5 @@
<header>
<a href="#main">Skip to content</a>
<a href="#h1">Skip to content</a>
<nav aria-label="Global">
<ul>
{{- $currentPage := . -}}

View file

@ -1,7 +1,7 @@
{{- define "main" -}}
{{- $canonicalRelPermalink := .RelPermalink | replaceRE "^/~seirdy/" "/" }}
{{- .Scratch.Set "codeIndex" 1 -}}
<main id="main" tabindex="-1"
<main
itemprop="mainEntity" itemscope="" itemtype="https://schema.org/BlogPosting{{ with .Params.articleType }} https://schema.org/{{ . }}{{ end }}" itemid="{{ .Site.Params.CanonicalBaseURL }}{{ $canonicalRelPermalink }}">
<link itemprop="isPartOf" href="{{ .Site.Params.CanonicalBaseURL }}/" />
{{ partial "full-article.html" . }}