From efc42185de14068bebe5a9617bd781328e51260d Mon Sep 17 00:00:00 2001
From: Divin Kong <divin@okayish.dev>
Date: Sun, 23 Aug 2020 18:39:15 -0700
Subject: Improve accessibility and SEO

---
 layouts/_default/list.html | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index f7e6b04..636ef44 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -13,9 +13,9 @@
 {{ $pages = slice }}
 
 {{ range .Site.RegularPages }}
-    {{ if $.IsAncestor . }}
-    {{ $pages = append . $pages}}
-    {{ end }}
+{{ if $.IsAncestor . }}
+{{ $pages = append . $pages}}
+{{ end }}
 {{ end }}
 
 {{ end }}
@@ -28,7 +28,11 @@
 
         <div class="col-12">
             <div class="p-card">
-                <h3><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h3>
+                <!-- 
+                    H3 is not in a sequentially-descending order which is not good for accessibility. 
+                    However, we still want the visual appearance of H3. Fortunately, Vanilla has a CSS class for that. 
+                -->
+                <h2 class="p-heading--3"><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h2>
 
                 {{/*  Check to see if it has post info. */}}
                 {{ if or .Params.Date (or .Params.Authors .Params.Author) }}
@@ -44,7 +48,11 @@
                 {{ end }}
 
                 {{ if .Truncated }}
-                <p><a href="{{ .Permalink }}">{{ i18n "readMore" | default "Read more" }}</a></p>
+                <p>
+                    <a href="{{ .Permalink }}">
+                        {{ i18n "readMore" | default "Read more" }}<span class="u-off-screen"> of {{ .Title }}</span>
+                    </a>
+                </p>
                 {{ end }}
             </div>
         </div>
-- 
cgit v1.2.3