trentuna/asw
8
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity Actions

drop <main>, use <article role="main"> — bold landmark structure

Browse source 
body direct children: <nav>, <header>, <article role="main">, <footer>
- <nav>: site navigation (own landmark)
- <header>: page identity — title, author, date, metadata
- <article role="main">: content (screen reader gets landmark via role)
- <footer>: site footer

No <main> wrapper. Fewer tags, clearer signal.
Header block defined per-layout (prose gets eyebrow/date, docs gets hgroup).
Content block defined per-layout (docs adds sidebar <nav> + <aside> TOC).
This commit is contained in:
Vigilio Desto 2026-04-10 20:33:25 +02:00
parent 169374e2fd
commit c2261bfc9f
Signed by: vigilio
GPG key ID: 159D6AD58C8E55E9
7 changed files with 291 additions and 357 deletions
Download patch file Download diff file Expand all files Collapse all files

203
layouts/vault/single.html
View file

@ -1,113 +1,92 @@
{{ define "main" }}
<main>
<div data-layout="docs">
{{/* ── Left sidebar ─────────────────────────────────────────────── */}}
<aside>
{{- $menuName := .Site.Params.vault_menu | default "vault" -}}
<nav aria-label="Vault documentation" data-nav="sidebar">
{{- $menu := index .Site.Menus $menuName -}}
{{- if $menu -}}
{{- range $menu -}}
{{- if .HasChildren -}}
<small>{{ .Name }}</small>
<ul>
{{- range .Children -}}
<li>
<a href="{{ .URL }}"
{{- if $.IsMenuCurrent $menuName . }} aria-current="page"{{ end -}}>
{{- .Name -}}
</a>
</li>
{{- end -}}
</ul>
{{- else -}}
<ul>
<li>
<a href="{{ .URL }}"
{{- if $.IsMenuCurrent $menuName . }} aria-current="page"{{ end -}}>
{{- .Name -}}
</a>
</li>
</ul>
{{- end -}}
{{- end -}}
{{- else -}}
{{/* Fallback: list direct pages of the current section */}}
{{- with .CurrentSection -}}
<small>{{ .Title }}</small>
<ul>
{{- range .RegularPages -}}
<li>
<a href="{{ .RelPermalink }}"
{{- if eq .RelPermalink $.RelPermalink }} aria-current="page"{{ end -}}>
{{- .LinkTitle -}}
</a>
</li>
{{- end -}}
</ul>
{{- end -}}
{{- end -}}
</nav>
</aside>
{{/* ── Main content ──────────────────────────────────────────────── */}}
<article>
{{- if .Description -}}
<hgroup>
<h1>{{ .Title }}</h1>
<p>{{ .Description }}</p>
</hgroup>
{{- else -}}
<h1>{{ .Title }}</h1>
{{- end }}
{{ .Content }}
{{/* ── Prev / Next — from front matter, not Hugo section order ── */}}
{{- $prevURL := index .Params "prev-url" -}}
{{- $prevTitle := index .Params "prev-title" -}}
{{- $nextURL := index .Params "next-url" -}}
{{- $nextTitle := index .Params "next-title" -}}
{{- if or $prevURL $nextURL -}}
<div data-role="prev-next">
{{- if $prevURL -}}
<a href="{{ $prevURL }}" rel="prev">
<small>← Previous</small>
<span>{{ $prevTitle }}</span>
</a>
{{- end -}}
{{- if and $nextURL $nextTitle -}}
<a href="{{ $nextURL }}" rel="next">
<small>Next →</small>
<span>{{ $nextTitle }}</span>
</a>
{{- end -}}
</div>
{{- end -}}
</article>
{{/* ── Right TOC ────────────────────────────────────────────────── */}}
{{- with .TableOfContents -}}
<aside data-toc>
<small>On this page</small>
{{ . }}
</aside>
{{- end -}}
</div>
</main>
{{ define "header" }}
<header>
{{- if .Description -}}
<hgroup>
<h1>{{ .Title }}</h1>
<p>{{ .Description }}</p>
</hgroup>
{{- else -}}
<h1>{{ .Title }}</h1>
{{- end }}
</header>
{{ end }}
{{ define "content" }}
{{/* Vault sidebar navigation */}}
<nav aria-label="Vault" data-nav="sidebar">
{{- $menuName := .Site.Params.vault_menu | default "vault" -}}
{{- $menu := index .Site.Menus $menuName -}}
{{- if $menu -}}
{{- range $menu -}}
{{- if .HasChildren -}}
<small>{{ .Name }}</small>
<ul>
{{- range .Children -}}
<li>
<a href="{{ .URL }}"
{{- if $.IsMenuCurrent $menuName . }} aria-current="page"{{ end -}}>
{{- .Name -}}
</a>
</li>
{{- end -}}
</ul>
{{- else -}}
<ul>
<li>
<a href="{{ .URL }}"
{{- if $.IsMenuCurrent $menuName . }} aria-current="page"{{ end -}}>
{{- .Name -}}
</a>
</li>
</ul>
{{- end -}}
{{- end -}}
{{- else -}}
{{- with .CurrentSection -}}
<small>{{ .Title }}</small>
<ul>
{{- range .RegularPages -}}
<li>
<a href="{{ .RelPermalink }}"
{{- if eq .RelPermalink $.RelPermalink }} aria-current="page"{{ end -}}>
{{- .LinkTitle -}}
</a>
</li>
{{- end -}}
</ul>
{{- end -}}
{{- end -}}
</nav>
<article role="main">
{{ .Content }}
{{- $prevURL := index .Params "prev-url" -}}
{{- $prevTitle := index .Params "prev-title" -}}
{{- $nextURL := index .Params "next-url" -}}
{{- $nextTitle := index .Params "next-title" -}}
{{- if or $prevURL $nextURL -}}
<footer data-role="prev-next">
{{- if $prevURL -}}
<a href="{{ $prevURL }}" rel="prev">
<small>← Previous</small>
<span>{{ $prevTitle }}</span>
</a>
{{- end -}}
{{- if and $nextURL $nextTitle -}}
<a href="{{ $nextURL }}" rel="next">
<small>Next →</small>
<span>{{ $nextTitle }}</span>
</a>
{{- end -}}
</footer>
{{- end -}}
</article>
{{- with .TableOfContents -}}
<aside data-toc>
<small>On this page</small>
{{ . }}
</aside>
{{- end -}}
{{ end }}