mirror of
https://git.sr.ht/~seirdy/seirdy.one
synced 2024-11-23 21:02:09 +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
parent
5b4832df15
commit
ff0c7deafa
13 changed files with 24 additions and 20 deletions
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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­marks</h1>
|
||||
<h1 id="h1" tabindex="-1" class="p-name" itemprop="name headline">My book­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>
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -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 />
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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 />
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{{ define "main" -}}
|
||||
<main id="main" tabindex="-1">
|
||||
<h1 id="seirdys-home">Seirdy’s Home</h1>
|
||||
<main>
|
||||
<h1 id="h1" tabindex="-1">Seirdy’s Home</h1>
|
||||
<p itemprop="description">{{ .Site.Params.Description }}</p>
|
||||
<hr />
|
||||
<div class="narrow">
|
||||
|
|
|
|||
|
|
@ -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 />
|
||||
|
|
|
|||
|
|
@ -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" . }}
|
||||
|
|
|
|||
|
|
@ -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 -}}
|
||||
|
|
|
|||
|
|
@ -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 := . -}}
|
||||
|
|
|
|||
|
|
@ -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" . }}
|
||||
|
|
|
|||
Loading…
Reference in a new issue