mirror of
https://git.sr.ht/~seirdy/seirdy.one
synced 2024-11-23 21:02:09 +00:00
POSH: replace some divs with <section>s, add <p>
- Put webmention list items in <p> - make doc-endnotes a section again - make doc-preface a section with a heading apart from the TOC.
This commit is contained in:
Rohan Kumar
parent
1863c65dce
commit
781f910f99
4 changed files with 54 additions and 39 deletions
|
|
@ -17,7 +17,8 @@ sitemap:
|
|||
featured: true
|
||||
title: Best practices for inclusive textual websites
|
||||
---
|
||||
<div role="doc-preface">
|
||||
<section role="doc-preface">
|
||||
<h2 id="before-you-begin">Before you begin</h2>
|
||||
|
||||
The following applies to minimal websites that focus primarily on text. It does not apply to websites that have a lot of non-textual content. It also does not apply to websites that focus more on generating revenue or pleasing investors than being inclusive.
|
||||
|
||||
|
|
@ -25,7 +26,7 @@ This is a "living document" that I add to as I receive feedback. See the updated
|
|||
|
||||
<p role="doc-tip">If you find the article too long, just read the introduction and conclusion. The table of contents should help you skim.</p>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{{<toc>}}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<article class="h-entry hentry">
|
||||
<header>
|
||||
<h1 itemprop="name headline" class="p-name entry-title">{{ .Title }}</h1>
|
||||
{{ partial "post-meta.html" . }}
|
||||
<hr>
|
||||
</header>
|
||||
<div class="e-content entry-content" itemprop="articleBody">
|
||||
{{ partial "processed-content" . -}}
|
||||
</div>
|
||||
</article>
|
||||
<header>
|
||||
<h1 itemprop="name headline" class="p-name entry-title">{{ .Title }}</h1>
|
||||
{{ partial "post-meta.html" . }}
|
||||
<hr>
|
||||
</header>
|
||||
<div class="e-content entry-content" itemprop="articleBody">
|
||||
{{ partial "processed-content" . -}}
|
||||
</div>
|
||||
</article>
|
||||
|
|
|
|||
|
|
@ -10,9 +10,19 @@
|
|||
-->
|
||||
{{- $referencesWithoutHeading := `(<div class="footnotes" role="doc-endnotes">
|
||||
<hr>)` -}}
|
||||
{{- $referencesWithHeading := printf `<div role="doc-endnotes" aria-labelledby="note-hd">
|
||||
{{- $referencesWithHeading := printf `<section role="doc-endnotes" aria-labelledby="note-hd">
|
||||
<h2 id="note-hd">%s</h2>` ($footnote_heading) -}}
|
||||
|
||||
{{- $endnotesClosingDiv := `</a></p>
|
||||
</li>
|
||||
</ol>
|
||||
</div>` -}}
|
||||
|
||||
{{- $endnotesClosingSection := printf `</a></p>
|
||||
</li>
|
||||
</ol>
|
||||
</section>` -}}
|
||||
|
||||
<!--Remove deprecated DPUB-ARIA role and unused classes-->
|
||||
{{- $endnote := `(role="doc-endnote"|class="footnote-(back)?ref")` -}}
|
||||
{{- $noEndnote := printf "" -}}
|
||||
|
|
@ -28,4 +38,4 @@
|
|||
{{- $repeatedFootnoteBacklinksBad := `<a href="#fnref([0-9]):([0-9]*)"(.*role="doc-backlink"(?:.*)?)>` -}}
|
||||
{{- $repeatedFootnoteBacklinksGood := `<a href="#fnref${1}:${2}" title="back to reference ${2}, repeated instance ${1}" aria-label="back to reference ${2}, repeated instance ${1}"${3}>` -}}
|
||||
|
||||
{{- .Content | replaceRE $referencesWithoutHeading $referencesWithHeading | replaceRE $endnote $noEndnote | replaceRE $tocHeadingOutside $tocHeadingInside | replaceRE $footnoteBacklinksBad $footnoteBacklinksGood | replaceRE $repeatedFootnoteBacklinksBad $repeatedFootnoteBacklinksGood | safeHTML -}}
|
||||
{{- .Content | replaceRE $referencesWithoutHeading $referencesWithHeading | replaceRE $endnotesClosingDiv $endnotesClosingSection | replaceRE $endnote $noEndnote | replaceRE $tocHeadingOutside $tocHeadingInside | replaceRE $footnoteBacklinksBad $footnoteBacklinksGood | replaceRE $repeatedFootnoteBacklinksBad $repeatedFootnoteBacklinksGood | safeHTML -}}
|
||||
|
|
|
|||
|
|
@ -8,36 +8,40 @@
|
|||
{{ range $webmentions -}}
|
||||
{{ $webmention := . -}}
|
||||
{{ if (eq $webmention.type "like") -}}
|
||||
<li itemprop="potentialAction" itemscope itemtype="https://schema.org/LikeAction" class="u-like h-cite">
|
||||
<li itemprop="potentialAction" itemscope itemtype="https://schema.org/LikeAction" class="u-like h-cite">
|
||||
{{- else -}}
|
||||
<li itemprop="comment" itemscope itemtype="https://schema.org/Comment" class="u-comment h-cite">
|
||||
<li itemprop="comment" itemscope itemtype="https://schema.org/Comment" class="u-comment h-cite">
|
||||
{{- end }}
|
||||
<time class="dt-published" itemprop="{{ if (eq $webmention.type "like") -}}startTime{{ else }}datePublished{{ end }}" datetime="{{ dateFormat "2006-01-02 15:04:05Z07:00" $webmention.created_at }}" title="{{ dateFormat "2006-01-02 15:04:05Z07:00" $webmention.created_at }}">{{ dateFormat "2006-01-02" $webmention.created_at }}</time>
|
||||
<br>
|
||||
{{ if (eq $webmention.type "like") -}}
|
||||
{{- if $webmention.author_name -}}
|
||||
<span itemprop="agent" itemscope itemtype="https://schema.org/Person" class="h-card p-author vcard"><span itemprop="name" class="p-name fn n">{{ $webmention.author_name }}</span></span>
|
||||
{{- else if $webmention.title -}}
|
||||
<span itemprop="name" class="p-name">{{ $webmention.title -}}</span>
|
||||
{{- else -}}
|
||||
{{ $webmention.source -}}
|
||||
{{- end }}
|
||||
<a class="u-url" href="{{ $webmention.source }}" rel="nofollow ugc">liked</a> this
|
||||
{{- else -}}
|
||||
<a class="u-url" href="{{ $webmention.source }}" rel="nofollow ugc"><span itemprop="name" class="p-content p-name">
|
||||
{{- if $webmention.title -}}
|
||||
{{- $webmention.title | truncate 200 -}}
|
||||
{{- else -}}
|
||||
{{- $webmention.source | strings.TrimPrefix "https://" | strings.TrimPrefix "www." | strings.TrimRight "/" | truncate 35 -}}
|
||||
{{- end -}}
|
||||
</span></a>
|
||||
{{- if $webmention.author_name }}
|
||||
<p>
|
||||
<time class="dt-published" itemprop="{{ if (eq $webmention.type "like") -}}startTime{{ else }}datePublished{{ end }}" datetime="{{ dateFormat "2006-01-02 15:04:05Z07:00" $webmention.created_at }}" title="{{ dateFormat "2006-01-02 15:04:05Z07:00" $webmention.created_at }}">{{ dateFormat "2006-01-02" $webmention.created_at }}</time>
|
||||
<br>
|
||||
{{ if (eq $webmention.type "like") -}}
|
||||
{{ if $webmention.author_name -}}
|
||||
<span itemprop="agent" itemscope itemtype="https://schema.org/Person" class="h-card p-author vcard"><span itemprop="name" class="p-name fn n">{{ $webmention.author_name }}</span></span>
|
||||
{{ else if $webmention.title -}}
|
||||
<span itemprop="name" class="p-name">{{ $webmention.title -}}</span>
|
||||
{{ else -}}
|
||||
{{ $webmention.source -}}
|
||||
{{ end -}}
|
||||
<a class="u-url" href="{{ $webmention.source }}" rel="nofollow ugc">liked</a> this
|
||||
{{ else -}}
|
||||
<a class="u-url" href="{{ $webmention.source }}" rel="nofollow ugc">
|
||||
<span itemprop="name" class="p-content p-name">
|
||||
{{ if $webmention.title -}}
|
||||
{{ $webmention.title | truncate 200 -}}
|
||||
{{ else -}}
|
||||
{{- $webmention.source | strings.TrimPrefix "https://" | strings.TrimPrefix "www." | strings.TrimRight "/" | truncate 35 -}}
|
||||
{{ end }}
|
||||
</span>
|
||||
</a>
|
||||
{{- if $webmention.author_name }}
|
||||
by <span itemprop="author" itemscope itemtype="https://schema.org/Person" class="h-card p-author vcard"><span itemprop="name" class="p-name fn n">{{ $webmention.author_name }}</span></span>
|
||||
{{- end -}}
|
||||
{{- end }}
|
||||
</li>
|
||||
{{- end -}}
|
||||
{{- end }}
|
||||
</p>
|
||||
</li>
|
||||
{{ else -}}
|
||||
<li><p>This post doesn't have any approved Webmentions yet.</p></li>
|
||||
<li><p>This post doesn't have any approved Webmentions yet.</p></li>
|
||||
{{- end }}
|
||||
</ul>
|
||||
<p></p>
|
||||
|
|
|
|||
Loading…
Reference in a new issue