Improve semantic HTML tag usage on content pages

This commit is contained in:
2025-08-24 03:52:23 -05:00
parent 267652a7e4
commit 20f22b7926
4 changed files with 72 additions and 70 deletions

View File

@@ -1,5 +1,5 @@
{{ if or .Date .Params.authors .Site.Params.readingtime .Site.Params.gitFileURL }} {{ if or .Date .Params.authors .Site.Params.readingtime .Site.Params.gitFileURL }}
<div class="page-metadata" aria-label="{{ i18n "aria_post_metadata" }}"> <section class="page-metadata" aria-label="{{ i18n "aria_post_metadata" }}">
{{ if .Date }} {{ if .Date }}
<span class="page-metadata-item" aria-label="{{ i18n "aria_post_meta_date" }}"> <span class="page-metadata-item" aria-label="{{ i18n "aria_post_meta_date" }}">
{{ partial "icon.html" "calendar" }} {{ partial "icon.html" "calendar" }}
@@ -26,5 +26,5 @@
{{ partial "page-metadata/item/categories.html" . }} {{ partial "page-metadata/item/categories.html" . }}
{{ partial "page-metadata/item/tags.html" . }} {{ partial "page-metadata/item/tags.html" . }}
</div> </section>
{{ end }} {{ end }}

View File

@@ -1,5 +1,5 @@
{{ if or .Date .Params.authors .Site.Params.readingtime }} {{ if or .Date .Params.authors .Site.Params.readingtime }}
<div class="page-metadata" aria-label="{{ i18n "aria_post_metadata" }}"> <section class="page-metadata" aria-label="{{ i18n "aria_post_metadata" }}">
{{ if .Date }} {{ if .Date }}
<span class="page-metadata-item" aria-label="date"> <span class="page-metadata-item" aria-label="date">
{{ partial "icon.html" "calendar" }} {{ partial "icon.html" "calendar" }}
@@ -14,5 +14,5 @@
{{ partial "page-metadata/item/series.html" . }} {{ partial "page-metadata/item/series.html" . }}
{{ partial "page-metadata/item/categories.html" . }} {{ partial "page-metadata/item/categories.html" . }}
{{ partial "page-metadata/item/tags.html" . }} {{ partial "page-metadata/item/tags.html" . }}
</div> </section>
{{ end }} {{ end }}

View File

@@ -1,4 +1,4 @@
<div class="share-buttons"> <section class="share-buttons">
{{ if .Site.Params.shareButtons.twitter }} {{ if .Site.Params.shareButtons.twitter }}
<a class="twitter-share" <a class="twitter-share"
target="_blank" target="_blank"
@@ -66,4 +66,4 @@
{{- partial "icon.html" "printer" -}} {{- partial "icon.html" "printer" -}}
</a> </a>
{{ end }} {{ end }}
</div> </section>

View File

@@ -1,4 +1,5 @@
{{ define "main" }} {{ define "main" }}
<article>
<div class="page-title"> <div class="page-title">
<h1> <h1>
{{ .Title | markdownify }} {{ .Title | markdownify }}
@@ -10,12 +11,12 @@
{{ partial "series-box.html" . }} {{ partial "series-box.html" . }}
{{ if .Params.Toc }} {{ if .Params.Toc }}
<div class="table-of-contents" aria-label="{{ i18n "aria_table_of_contents" }}"> <section class="table-of-contents" aria-label="{{ i18n "aria_table_of_contents" }}">
<details> <details>
<summary>{{ i18n "table_of_contents" }}</summary> <summary>{{ i18n "table_of_contents" }}</summary>
{{ .TableOfContents }} {{ .TableOfContents }}
</details> </details>
</div> </section>
<div class="table-of-contents print"> <div class="table-of-contents print">
{{ i18n "table_of_contents" }} {{ i18n "table_of_contents" }}
{{ .TableOfContents }} {{ .TableOfContents }}
@@ -24,14 +25,14 @@
{{ partial "feature-figure.html" . }} {{ partial "feature-figure.html" . }}
<article class="post-content" data-pagefind-body> <div class="post-content" data-pagefind-body>
{{ .Content }} {{ .Content }}
</article> </div>
{{ partial "series-box.html" . }} {{ partial "series-box.html" . }}
{{ if or .NextInSection .PrevInSection }} {{ if or .NextInSection .PrevInSection }}
<div class="prevnext"> <nav class="prevnext">
{{ with .NextInSection }} {{ with .NextInSection }}
<a class="prev" href="{{ .Permalink }}"> <a class="prev" href="{{ .Permalink }}">
<div class="prev-caption"> <div class="prev-caption">
@@ -57,7 +58,7 @@
{{ else }} {{ else }}
<div class="next"></div> <div class="next"></div>
{{ end }} {{ end }}
</div> </nav>
{{ end }} {{ end }}
{{ if .Site.Params.shareButtons }} {{ if .Site.Params.shareButtons }}
@@ -65,10 +66,11 @@
{{ end }} {{ end }}
{{ if .Params.comments }} {{ if .Params.comments }}
<div class="comments"> <section class="comments">
{{ partial "comments.html" . }} {{ partial "comments.html" . }}
</div> </section>
{{ end }} {{ end }}
</article>
{{ end }} {{ end }}