[bug#39635] [PATCH] website: Modify use of H1 headings

[bug#39635] [PATCH] website: Modify use of H1 headings

[sirgazil via Guix-patches via]

The website was originally designed to use only one H1 element per
page, which is/was seen as a best practice for accessibility and
SEO. However, the value of the H1 element in all the pages of the
website was always the alternative text of the Guix logo ("Guix"). The
main content of a page started with a level 2 heading (H2).

This change maintains the best practice of using only one H1 element
per page, but gives a less important level to the Guix logo (it
becomes H2) and uses H1 as the heading for the main content of
pages. This means, for example, that the H1 of the download page is
"Download", the H1 of the help page is "Help", the H1 of a blog post
is its title, and so on.

The changes were tested in the following browsers (without assistive
technologies):

* IceCat 68.4.1esr
* Epiphany 3.32.5 (WebKitGTK+ 2.26.3)
* Lynx 2.8.9rel.1

Website pages validate correctly using the https://validator.w3.org/,
and their heading-level and structural outlines are similar to those
of the https://webaim.org/ pages.

* website/apps/base/templates/components.scm (navbar): Make logo H2.

For the following templates, change main content heading from H2 to
H1, and update subheadings accordingly.

* website/apps/base/templates/about.scm (about-t)
* website/apps/base/templates/contact.scm (contact-t)
* website/apps/base/templates/contribute.scm (contribute-t)
* website/apps/base/templates/donate.scm (donate-t)
* website/apps/base/templates/graphics.scm (graphics-t)
* website/apps/base/templates/help.scm (help-t)
* website/apps/base/templates/home.scm (home-t)
* website/apps/base/templates/irc.scm (irc-t)
* website/apps/base/templates/security.scm (security-t)
* website/apps/blog/templates/components.scm (post-preview)
* website/apps/blog/templates/post-list.scm (post-list-t)
* website/apps/blog/templates/post.scm (post-t)
* website/apps/blog/templates/tag.scm (tag-t)
* website/apps/download/templates/components.scm (download)
* website/apps/download/templates/download.scm (download-t)
* website/apps/media/templates/screenshot.scm (screenshot-t)
* website/apps/media/templates/video.scm (video-t)
* website/apps/packages/templates/detailed-index.scm (detailed-index-t)
* website/apps/packages/templates/detailed-package-list.scm
  (detailed-package-list-t)
* website/apps/packages/templates/index.scm (index-t)
* website/apps/packages/templates/package-list.scm (package-list-t)
* website/apps/packages/templates/package.scm (package-t)

For the following templates, add missing H1 heading to the main
content:

* website/apps/media/templates/screenshots-overview.scm
  (screenshots-overview-t)
* website/apps/media/templates/video-list.scm (video-list-t)

Style changes:

* website/static/base/css/download.css (.download-box h2): New style.
* website/static/base/css/item-preview.css (.item-preview h2):
  (.summary-box h2) New style.
* website/static/base/css/navbar.css (.navbar > h1): Change to
  ".navbar > h2" (the logo is now an H2 heading).
* website/static/base/css/page.css (h1): New style.
---
 website/apps/base/templates/about.scm         |  6 +++---
 website/apps/base/templates/components.scm    |  4 ++--
 website/apps/base/templates/contact.scm       |  2 +-
 website/apps/base/templates/contribute.scm    | 20 +++++++++----------
 website/apps/base/templates/donate.scm        |  6 +++---
 website/apps/base/templates/graphics.scm      |  2 +-
 website/apps/base/templates/help.scm          | 14 ++++++-------
 website/apps/base/templates/home.scm          |  2 +-
 website/apps/base/templates/irc.scm           |  2 +-
 website/apps/base/templates/security.scm      |  8 ++++----
 website/apps/blog/templates/components.scm    |  2 +-
 website/apps/blog/templates/post-list.scm     |  2 +-
 website/apps/blog/templates/post.scm          |  2 +-
 website/apps/blog/templates/tag.scm           |  2 +-
 .../apps/download/templates/components.scm    |  2 +-
 website/apps/download/templates/download.scm  |  2 +-
 website/apps/media/templates/screenshot.scm   |  2 +-
 .../media/templates/screenshots-overview.scm  |  1 +
 website/apps/media/templates/video-list.scm   |  1 +
 website/apps/media/templates/video.scm        |  2 +-
 .../packages/templates/detailed-index.scm     |  2 +-
 .../templates/detailed-package-list.scm       |  2 +-
 website/apps/packages/templates/index.scm     |  2 +-
 .../apps/packages/templates/package-list.scm  |  2 +-
 website/apps/packages/templates/package.scm   |  4 ++--
 website/static/base/css/download.css          |  4 ++++
 website/static/base/css/item-preview.css      |  5 +++++
 website/static/base/css/navbar.css            |  2 +-
 website/static/base/css/page.css              |  7 ++++---
 29 files changed, 63 insertions(+), 51 deletions(-)

diff --git a/website/apps/base/templates/about.scm b/website/apps/base/templates/about.scm
index c9489ef..8cd341c 100644
--- a/website/apps/base/templates/about.scm
+++ b/website/apps/base/templates/about.scm
@@ -29,7 +29,7 @@
    `(main
      (section
       (@ (class "page centered-block limit-width"))
-      (h2 "About the Project")
+      (h1 (@ (class "centered-text")) "About the Project")
 
       (p
        "The " (em "GNU Guix") " package and system manager is a "
@@ -86,7 +86,7 @@
        ".")
 
 
-      (h3 (@ (id "mantainer")) "Maintainers")
+      (h2 (@ (id "mantainer")) "Maintainers")
 
       (p
        "Guix is currently maintained by Ludovic Courtès, Marius Bakke, Maxim
@@ -96,7 +96,7 @@ Cournoyer, Tobias Geerinckx-Rice, and Ricardo Wurmus.  Please use the "
        "using the " (code "guix-maintainers@gnu.org") " private alias.")
 
 
-      (h3 (@ (id "license")) "Licensing")
+      (h2 (@ (id "license")) "Licensing")
 
       (p
        "Guix is free software; you can redistribute it and/or modify
diff --git a/website/apps/base/templates/components.scm b/website/apps/base/templates/components.scm
index a10fb00..12b9a74 100644
--- a/website/apps/base/templates/components.scm
+++ b/website/apps/base/templates/components.scm
@@ -280,10 +280,10 @@
     (@ (class "navbar"))
 
     ;; Branding.
-    (h1
+    (h2
      (a
       (@ (class "branding") (href ,(guix-url)))
-      (span (@ (class "a11y-offset")) "Guix")))
+      (span (@ (class "a11y-offset")) "GNU Guix")))
 
     ;; Menu.
     (nav (@ (class "menu"))
diff --git a/website/apps/base/templates/contact.scm b/website/apps/base/templates/contact.scm
index 2085e22..a831a1b 100644
--- a/website/apps/base/templates/contact.scm
+++ b/website/apps/base/templates/contact.scm
@@ -31,7 +31,7 @@
    `(main
      (section
       (@ (class "page centered-block limit-width"))
-      (h2 "Contact")
+      (h1 (@ (class "centered-text")) "Contact")
 
       ,@(map
 	 contact->shtml
diff --git a/website/apps/base/templates/contribute.scm b/website/apps/base/templates/contribute.scm
index 1451f0b..df8c1ab 100644
--- a/website/apps/base/templates/contribute.scm
+++ b/website/apps/base/templates/contribute.scm
@@ -31,7 +31,7 @@
    `(main
      (section
       (@ (class "page centered-block limit-width"))
-      (h2 "Contribute")
+      (h1 (@ (class "centered-text")) "Contribute")
 
       (p
        "GNU Guix is a large project developed
@@ -60,7 +60,7 @@
 
        (div
 	(@ (class "summary-box"))
-	(h3 (@ (id "pms")) "Project Management")
+	(h2 (@ (id "pms")) "Project Management")
 	(p
 	 "We use "
 	 (a (@ (href "https://savannah.gnu.org/")) "Savannah")
@@ -80,7 +80,7 @@
 
        (div
 	(@ (class "summary-box"))
-	(h3 (@ (id "art")) "Art")
+	(h2 (@ (id "art")) "Art")
 	(p
 	 "We are always looking for artists to help us design and
          improve user interfaces, and create multimedia material for
@@ -99,7 +99,7 @@
 
        (div
 	(@ (class "summary-box"))
-	(h3 (@ (id "documentation")) "Documentation")
+	(h2 (@ (id "documentation")) "Documentation")
 	(p
 	 "You can read the "
 	 (a (@ (href ,(guix-url "help/"))) "project documentation")
@@ -119,7 +119,7 @@
 
        (div
 	(@ (class "summary-box"))
-	(h3 (@ (id "packages")) "Packages")
+	(h2 (@ (id "packages")) "Packages")
 	(p
 	 "Hundreds of software, documentation, and assets need to be
          packaged to make it easier for users to install their
@@ -147,7 +147,7 @@
 
        (div
 	(@ (class "summary-box"))
-	(h3 (@ (id "programming")) "Programming")
+	(h2 (@ (id "programming")) "Programming")
 	(p
 	 "Source code is in the "
 	 (a (@ (href "//git.savannah.gnu.org/cgit/guix.git/"))
@@ -178,7 +178,7 @@
 
        (div
 	(@ (class "summary-box"))
-	(h3 (@ (id "sysadmin")) "System Administration")
+	(h2 (@ (id "sysadmin")) "System Administration")
 	(p
 	 "Our system infrastructure makes it possible for all the
          contributors to communicate and collaborate in the project,
@@ -198,7 +198,7 @@
 
        (div
 	(@ (class "summary-box"))
-	(h3 (@ (id "testing")) "Test and Bug Reports")
+	(h2 (@ (id "testing")) "Test and Bug Reports")
 	(p
 	 "Install the software and send feedback to the community
          about your experience. Help the project by reporting bugs.")
@@ -219,7 +219,7 @@
 
        (div
 	(@ (class "summary-box"))
-	(h3 (@ (id "translation")) "Translation")
+	(h2 (@ (id "translation")) "Translation")
 	(p
 	 "You can help translate the "
 	 (a (@ (href "https://translationproject.org/domain/guix.html"))
@@ -244,7 +244,7 @@
 	   #:url "https://translationproject.org/"))))
 
 
-      (h3 (@ (id "resources")) "Other resources for contributors")
+      (h2 (@ (id "resources")) "Other resources for contributors")
       (p
        "Documents, supporting material of previous talks, and
        auxiliary information useful to hackers and maintainers is
diff --git a/website/apps/base/templates/donate.scm b/website/apps/base/templates/donate.scm
index 3135be8..c8699b6 100644
--- a/website/apps/base/templates/donate.scm
+++ b/website/apps/base/templates/donate.scm
@@ -30,7 +30,7 @@
    `(main
      (section
       (@ (class "page centered-block limit-width"))
-      (h2 "Donate")
+      (h1 (@ (class "centered-text")) "Donate")
 
       (p
        "The "
@@ -57,7 +57,7 @@
 	 #:label "♥ DONATE!"
 	 #:url "https://my.fsf.org/civicrm/contribute/transact?reset=1&id=50"))
 
-      (h3
+      (h2
        (@ (id "hardware-and-hosting"))
        "Hardware and Hosting")
 
@@ -80,7 +80,7 @@
         discuss any opportunities. ")
 
 
-      (h3
+      (h2
        (@ (id "hardware-donors"))
        "Thanks to the donors!")
 
diff --git a/website/apps/base/templates/graphics.scm b/website/apps/base/templates/graphics.scm
index 6089988..9d7c878 100644
--- a/website/apps/base/templates/graphics.scm
+++ b/website/apps/base/templates/graphics.scm
@@ -28,7 +28,7 @@
    `(main
      (section
       (@ (class "page centered-block limit-width"))
-      (h2 "Graphics")
+      (h1 (@ (class "centered-text")) "Graphics")
 
       (p
        "For questions regarding the graphics listed in this page,
diff --git a/website/apps/base/templates/help.scm b/website/apps/base/templates/help.scm
index 631be31..335e138 100644
--- a/website/apps/base/templates/help.scm
+++ b/website/apps/base/templates/help.scm
@@ -31,7 +31,7 @@
    `(main
      (section
       (@ (class "page"))
-      (h2 "Help")
+      (h1 (@ (class "centered-text")) "Help")
 
       (div
        (@ (class "centered-text"))
@@ -42,7 +42,7 @@
 	(img
 	 (@ (src ,(guix-url "static/base/img/manual-icon.png"))
 	    (alt "")))
-	(h3 "GNU Guix Manual")
+	(h2 "GNU Guix Manual")
 	(p
 	 "Documentation for GNU Guix is available
          online.  You may also find more information about Guix by running "
@@ -67,7 +67,7 @@
         (@ (class "summary-box"))
         (img (@ (src ,(guix-url "static/base/img/videos-icon.png"))
                 (alt "")))
-        (h3 "Videos")
+        (h2 "Videos")
         (p
          "The collection of videos includes instructional material
          to help you get started with every day use of GNU Guix as
@@ -83,7 +83,7 @@
         (@ (class "summary-box"))
         (img (@ (src ,(guix-url "static/base/img/cookbook-icon.png"))
                 (alt "")))
-        (h3 "Cookbook")
+        (h2 "Cookbook")
         (p
          "Tutorials, how-to guides and examples contributed by the
          Guix community which show you how to use the system and its
@@ -99,7 +99,7 @@
 	(@ (class "summary-box"))
 	(img (@ (src ,(guix-url "static/base/img/library-icon.png"))
 		(alt "")))
-	(h3 "GNU Manuals")
+	(h2 "GNU Manuals")
 	(p
 	 "Guix is a distribution of the "
 	 (a (@ (href ,(gnu-url))) "GNU operating system")
@@ -115,7 +115,7 @@
 	(@ (class "summary-box"))
 	(img (@ (src ,(guix-url "static/base/img/chat-icon.png"))
 		(alt "")))
-	(h3 "IRC Chat")
+	(h2 "IRC Chat")
 	(p
 	 "For real-time support from the community, you can connect
          to the " (code "#guix") " channel on irc.freenode.net. There
@@ -134,7 +134,7 @@
 	(@ (class "summary-box"))
 	(img (@ (src ,(guix-url "static/base/img/email-icon.png"))
 		(alt "")))
-	(h3 "Mailing lists")
+	(h2 "Mailing lists")
 	(p
 	 "Email support from the community is also available through
          several mailing list. The messages sent to the lists are
diff --git a/website/apps/base/templates/home.scm b/website/apps/base/templates/home.scm
index 8b81b82..e99f938 100644
--- a/website/apps/base/templates/home.scm
+++ b/website/apps/base/templates/home.scm
@@ -36,7 +36,7 @@
      ;; Featured content.
      (section
       (@ (class "featured-content"))
-      (h2 (@ (class "a11y-offset")) "Summary")
+      (h1 (@ (class "a11y-offset")) "Overview")
       (ul
        (li
 	(b "Liberating.")
diff --git a/website/apps/base/templates/irc.scm b/website/apps/base/templates/irc.scm
index a58b9e0..ee73eac 100644
--- a/website/apps/base/templates/irc.scm
+++ b/website/apps/base/templates/irc.scm
@@ -29,7 +29,7 @@
    `(main
      (section
       (@ (class "page"))
-      (h2 "IRC")
+      (h1 (@ (class "centered-text")) "IRC")
 
       (p
        (@ (class "centered-block limit-width"))
diff --git a/website/apps/base/templates/security.scm b/website/apps/base/templates/security.scm
index f092074..e86ce3a 100644
--- a/website/apps/base/templates/security.scm
+++ b/website/apps/base/templates/security.scm
@@ -31,9 +31,9 @@
    `(main
      (section
       (@ (class "page centered-block limit-width"))
-      (h2 "Security")
+      (h1 (@ (class "centered-text")) "Security")
 
-      (h3 "How to report security issues")
+      (h2 "How to report security issues")
       (p
        "To report sensitive security issues in Guix itself or the
         packages it provides, you can write to the private mailing list "
@@ -58,7 +58,7 @@
           (ul (@ (class "mono"))
             (li "BCA6 89B6 3655 3801 C3C6 2150 197A 5888 235F ACAC"))))
 
-      (h3 "Release signatures")
+      (h2 "Release signatures")
       (p
        "Releases of Guix are signed using the OpenPGP "
        "key with the fingerprint "
@@ -68,7 +68,7 @@
        (a (@ (href ,(manual-url "Binary-Installation.html"))) "verify")
        " their downloads before extracting or running them.")
 
-      (h3 "Security updates")
+      (h2 "Security updates")
       (p
        "When security vulnerabilities are found in Guix or the "
        "packages provided by Guix, we will provide "
diff --git a/website/apps/blog/templates/components.scm b/website/apps/blog/templates/components.scm
index 14b12ac..db9c22b 100644
--- a/website/apps/blog/templates/components.scm
+++ b/website/apps/blog/templates/components.scm
@@ -26,7 +26,7 @@
   `(a
     (@ (class "item-preview")
        (href ,(guix-url (url-path-join (post-url-path post) ""))))
-    (h3 ,(post-ref post 'title))
+    (h2 ,(post-ref post 'title))
     (p
      (@ (class "item-date"))
      ,(date->string (post-date post) "~B ~e, ~Y"))
diff --git a/website/apps/blog/templates/post-list.scm b/website/apps/blog/templates/post-list.scm
index 86b9365..d7ffbfa 100644
--- a/website/apps/blog/templates/post-list.scm
+++ b/website/apps/blog/templates/post-list.scm
@@ -43,7 +43,7 @@
      `(main
        (section
 	(@ (class "page centered-text"))
-	(h2 "Blog"
+	(h1 "Blog"
 	    ,(page-indicator (string->number page-number)
 			     (string->number total-pages)))
 
diff --git a/website/apps/blog/templates/post.scm b/website/apps/blog/templates/post.scm
index 39d0332..18d1342 100644
--- a/website/apps/blog/templates/post.scm
+++ b/website/apps/blog/templates/post.scm
@@ -38,7 +38,7 @@
      `(main
        (article
 	(@ (class "page centered-block limit-width"))
-	(h2 ,(post-ref post 'title))
+	(h1 (@ (class "centered-text")) ,(post-ref post 'title))
 	(p
 	 (@ (class "post-metadata centered-text"))
 	 ,(post-ref post 'author) " — "
diff --git a/website/apps/blog/templates/tag.scm b/website/apps/blog/templates/tag.scm
index a000c8d..6585c73 100644
--- a/website/apps/blog/templates/tag.scm
+++ b/website/apps/blog/templates/tag.scm
@@ -48,7 +48,7 @@
      `(main
        (section
 	(@ (class "page centered-text"))
-	(h2 "Blog — " ,tag
+	(h1 (@ (class "centered-text")) "Blog — " ,tag
 	    ,(page-indicator (string->number page-number)
 			     (string->number total-pages)))
 
diff --git a/website/apps/download/templates/components.scm b/website/apps/download/templates/components.scm
index 1c26da3..065020d 100644
--- a/website/apps/download/templates/components.scm
+++ b/website/apps/download/templates/components.scm
@@ -19,7 +19,7 @@
   `(div
     (@ (class "download-box"))
     (img (@ (src ,(download-image dnd)) (alt "")))
-    (h3 ,(download-title dnd))
+    (h2 ,(download-title dnd))
     ,(download-description dnd)
     (p "Download options:")
     ,@(map (lambda (variant)
diff --git a/website/apps/download/templates/download.scm b/website/apps/download/templates/download.scm
index de2e458..b44a8ec 100644
--- a/website/apps/download/templates/download.scm
+++ b/website/apps/download/templates/download.scm
@@ -46,7 +46,7 @@
    `(main
      (section
       (@ (class "page"))
-      (h2 "Download")
+      (h1 (@ (class "centered-text")) "Download")
 
       (p
        (@ (class "centered-block limit-width"))
diff --git a/website/apps/media/templates/screenshot.scm b/website/apps/media/templates/screenshot.scm
index b738340..b020dc8 100644
--- a/website/apps/media/templates/screenshot.scm
+++ b/website/apps/media/templates/screenshot.scm
@@ -30,7 +30,7 @@
      `(main
        (section
 	(@ (class "light-text centered-text noise-bg"))
-	(h2
+	(h1
 	 (@ (class "a11y-offset"))
 	 ,(screenshot-title shot))
 
diff --git a/website/apps/media/templates/screenshots-overview.scm b/website/apps/media/templates/screenshots-overview.scm
index 2b19d05..115640c 100644
--- a/website/apps/media/templates/screenshots-overview.scm
+++ b/website/apps/media/templates/screenshots-overview.scm
@@ -27,4 +27,5 @@
    `(main
      (section
       (@ (class "light-text centered-text noise-bg"))
+      (h1 (@ (class "a11y-offset")) "Screenshots")
       ,(screenshots-box screenshots (length screenshots) #:shadow #t)))))
diff --git a/website/apps/media/templates/video-list.scm b/website/apps/media/templates/video-list.scm
index e05aa62..512c98c 100644
--- a/website/apps/media/templates/video-list.scm
+++ b/website/apps/media/templates/video-list.scm
@@ -33,6 +33,7 @@
    #:content
    `(main
      (@ (class "page centered-block limit-width"))
+     (h1 (@ (class "centered-text")) "Videos")
      ,(map-in-order
        (lambda (playlist)
          `(,(map-in-order
diff --git a/website/apps/media/templates/video.scm b/website/apps/media/templates/video.scm
index dff5a8a..c842a3f 100644
--- a/website/apps/media/templates/video.scm
+++ b/website/apps/media/templates/video.scm
@@ -34,7 +34,7 @@ PREVIOUS and NEXT videos are added."
    #:content
    `(main
      (@ (class "page centered-block limit-width"))
-     (h2 ,(video-title video))
+     (h1 (@ (class "centered-text")) ,(video-title video))
      ,(video-content video)
      ,(if (or previous next)
           `(div
diff --git a/website/apps/packages/templates/detailed-index.scm b/website/apps/packages/templates/detailed-index.scm
index 189e8b5..bb86280 100644
--- a/website/apps/packages/templates/detailed-index.scm
+++ b/website/apps/packages/templates/detailed-index.scm
@@ -38,7 +38,7 @@ packages to advertise."
      `(main
        (section
 	(@ (class "page centered-text"))
-	(h2 "Packages")
+	(h1 "Packages")
 
 	(p
 	 (@ (class "limit-width centered-block"))
diff --git a/website/apps/packages/templates/detailed-package-list.scm b/website/apps/packages/templates/detailed-package-list.scm
index 73ebecf..028679d 100644
--- a/website/apps/packages/templates/detailed-package-list.scm
+++ b/website/apps/packages/templates/detailed-package-list.scm
@@ -50,7 +50,7 @@
      `(main
        (section
 	(@ (class "page centered-text"))
-	(h2 "Packages — " ,letter
+	(h1 "Packages — " ,letter
 	    ,(page-indicator (string->number page-number)
 			     (string->number total-pages)))
 
diff --git a/website/apps/packages/templates/index.scm b/website/apps/packages/templates/index.scm
index cbf0862..b466386 100644
--- a/website/apps/packages/templates/index.scm
+++ b/website/apps/packages/templates/index.scm
@@ -37,7 +37,7 @@
      `(main
        (section
 	(@ (class "page centered-text"))
-	(h2 "Packages")
+	(h1 "Packages")
 
 	(p
 	 (@ (class "limit-width centered-block"))
diff --git a/website/apps/packages/templates/package-list.scm b/website/apps/packages/templates/package-list.scm
index 694ecdd..7f9bd4c 100644
--- a/website/apps/packages/templates/package-list.scm
+++ b/website/apps/packages/templates/package-list.scm
@@ -47,7 +47,7 @@
      `(main
        (section
 	(@ (class "page centered-text"))
-	(h2 "Packages — " ,letter
+	(h1 "Packages — " ,letter
 	    ,(page-indicator (string->number page-number)
 			     (string->number total-pages)))
 
diff --git a/website/apps/packages/templates/package.scm b/website/apps/packages/templates/package.scm
index b618d79..353a6a6 100644
--- a/website/apps/packages/templates/package.scm
+++ b/website/apps/packages/templates/package.scm
@@ -43,7 +43,7 @@
      `(main
        (article
 	(@ (class "page centered-block limit-width"))
-	(h2 ,package-id " "
+	(h1 (@ (class "centered-text")) ,package-id " "
 	    (span
 	     (@ (class "synopsis"))
 	     ,(package-synopsis-shtml package)))
@@ -72,7 +72,7 @@
 	;; Lint issues.
 	,(if (null? lint-issues)
 	     ""
-	     `((h3 "Lint issues")
+	     `((h2 "Lint issues")
 	       (p
 		,(issue-count->shtml (length lint-issues)) ". "
 		"See " (a (@ (href "#")) "package definition")
diff --git a/website/static/base/css/download.css b/website/static/base/css/download.css
index 8bcce9c..d1e92e4 100644
--- a/website/static/base/css/download.css
+++ b/website/static/base/css/download.css
@@ -10,6 +10,10 @@
     text-align: center;
 }
 
+.download-box h2 {
+    font-size: 1.5em;
+}
+
 .download-btn,
 .download-btn:link,
 .download-btn:visited {
diff --git a/website/static/base/css/item-preview.css b/website/static/base/css/item-preview.css
index 16e698f..20d3837 100644
--- a/website/static/base/css/item-preview.css
+++ b/website/static/base/css/item-preview.css
@@ -15,6 +15,7 @@
     background-color: #F4BB15;
 }
 
+.item-preview h2,
 .item-preview h3 {
     font-size: 1em;
     font-weight: bold;
@@ -63,4 +64,8 @@
 	margin: 0px auto;
 	max-width: 100%;
     }
+
+    .summary-box h2 {
+        font-size: 1.5em;
+    }
 }
diff --git a/website/static/base/css/navbar.css b/website/static/base/css/navbar.css
index d975aa8..0e7865c 100644
--- a/website/static/base/css/navbar.css
+++ b/website/static/base/css/navbar.css
@@ -10,7 +10,7 @@
     overflow: hidden;
 }
 
-.navbar > h1 {
+.navbar > h2 {
     display: inline-block;
     margin: 0px;
 }
diff --git a/website/static/base/css/page.css b/website/static/base/css/page.css
index eff3e26..6e39254 100644
--- a/website/static/base/css/page.css
+++ b/website/static/base/css/page.css
@@ -9,15 +9,16 @@ h5 {
     line-height: 1.2em;
 }
 
+h1 {
+    font-size: 3em;
+}
+
 h2 {
     font-size: 2.5em;
-    text-align: center;
-    line-height: 1.2em;
 }
 
 h3 {
     font-size: 1.5em;
-    line-height: 1.2em;
 }
 
 .page {
-- 
2.25.0

[bug#39635] website: Modify use of H1 headings

[Luis Felipe via Guix-patches via]

[-- Attachment #1: Type: text/plain, Size: 592 bytes --]

Ping...

Regardless of whether this change is applied, I think it would be good to suggest blog posters to use heading levels to convey structure, not style. Currently, post headings are often used for the latter (for instance, to make a heading text smaller). I haven't tried myself, but it seems that using headings in this way can make it harder for people using assistive technologies.

So, when writing a blog post, the title has the highest level (currently H2, but H1 if this patch is applied), and the headings in the body should use lower levels accordingly, without skipping levels.

[-- Attachment #2: Type: text/html, Size: 663 bytes --]

[bug#39635] [PATCH] website: Modify use of H1 headings

[Maxim Cournoyer]

Hello sirgazil!

sirgazil <sirgazil@zoho.com> writes:

> The website was originally designed to use only one H1 element per
> page, which is/was seen as a best practice for accessibility and
> SEO. However, the value of the H1 element in all the pages of the
> website was always the alternative text of the Guix logo ("Guix"). The
> main content of a page started with a level 2 heading (H2).
>
> This change maintains the best practice of using only one H1 element
> per page, but gives a less important level to the Guix logo (it
> becomes H2) and uses H1 as the heading for the main content of
> pages. This means, for example, that the H1 of the download page is
> "Download", the H1 of the help page is "Help", the H1 of a blog post
> is its title, and so on.
>
> The changes were tested in the following browsers (without assistive
> technologies):
>
> * IceCat 68.4.1esr
> * Epiphany 3.32.5 (WebKitGTK+ 2.26.3)
> * Lynx 2.8.9rel.1

Thanks for the patch!  It makes sense.  Unfortunately it doesn't apply
with 'git am' :-/.  Could you rebase it on the current master branch of
guix-artwork?

Thank you,

Maxim

[bug#39635] [PATCH] website: Modify use of H1 headings

[Luis Felipe via Guix-patches via]

Hi, Maxim.


‐‐‐‐‐‐‐ Original Message ‐‐‐‐‐‐‐
On Friday, October 9, 2020 2:49 AM, Maxim Cournoyer <maxim.cournoyer@gmail.com> wrote:

[...]

> Thanks for the patch! It makes sense. Unfortunately it doesn't apply
> with 'git am' :-/. Could you rebase it on the current master branch of
> guix-artwork?

Well, that's unfortunate because that patch is all I have. The copy of the git repository I was working on is long gone.

I'd redo the work, and send a new patch, but I haven't had much luck with my patches for the website, so I guess I pass for now.

Thanks,

[bug#39635] [PATCH] website: Modify use of H1 headings

[zimoun]

Dear,

On Sat, 10 Oct 2020 at 21:58, Luis Felipe via Guix-patches via
<guix-patches@gnu.org> wrote:

> Well, that's unfortunate because that patch is all I have. The copy of the git repository I was working on is long gone.

Sad!
Since I have hit this issue several times when digging in the
Bug/Patch Report, now when sending patches, I personally try to use:

   git format-patch --base <commit-where-it-applies>

Then the patch contains at the bottom these lines, for example:

--8<---------------cut here---------------start------------->8---
base-commit: 679d5e6b3dcac4ee1f419c04b3719fead0bd9ee5
-- 
2.28.0
--8<---------------cut here---------------end--------------->8---

And with a recent enough Magit version, it is "W c C-m b".

Well, it seems a good habit iMHO and I will try to send a patch
updating the section "Submitting Patches".

Thanks,
simon

[bug#39635] [PATCH] website: Modify use of H1 headings

[Luis Felipe via Guix-patches via]

Hi simon, thanks for the tip. I'll do that from now on.

[bug#39635] [PATCH] website: Modify use of H1 headings

[Maxim Cournoyer]

Hello Luis,

Luis Felipe <luis.felipe.la@protonmail.com> writes:

> Hi, Maxim.
>
>
> ‐‐‐‐‐‐‐ Original Message ‐‐‐‐‐‐‐
> On Friday, October 9, 2020 2:49 AM, Maxim Cournoyer <maxim.cournoyer@gmail.com> wrote:
>
> [...]
>
>> Thanks for the patch! It makes sense. Unfortunately it doesn't apply
>> with 'git am' :-/. Could you rebase it on the current master branch of
>> guix-artwork?
>
> Well, that's unfortunate because that patch is all I have. The copy of the git repository I was working on is long gone.
>
> I'd redo the work, and send a new patch, but I haven't had much luck with my patches for the website, so I guess I pass for now.

That's unfortunate, indeed.  Sorry we failed to be more responsive,
leading to this.  Feel free to ping me on #guix when you get around to
send a refresh patch; I go by the 'apteryx' nickname.

Happy hacking,

Maxim

[bug#39635] [PATCH] website: Modify use of H1 headings

[zimoun]

Hi Luis,

Sorry for not being super responsive.  It is about an old patch#39635
submission [1].

1: <http://issues.guix.gnu.org/issue/39635>


On Sat, 10 Oct 2020 at 19:51, Luis Felipe <luis.felipe.la@protonmail.com> wrote:
> On Friday, October 9, 2020 2:49 AM, Maxim Cournoyer <maxim.cournoyer@gmail.com> wrote:

>> Thanks for the patch! It makes sense. Unfortunately it doesn't apply
>> with 'git am' :-/. Could you rebase it on the current master branch of
>> guix-artwork?

[...]

> I'd redo the work, and send a new patch, but I haven't had much luck with my
> patches for the website, so I guess I pass for now.

What is the status?  Do we close this submission?  Are we waiting for an
update?  Maybe it is included by another patch.


Cheers,
simon

[bug#39635] [PATCH] website: Modify use of H1 headings

[Luis Felipe via Guix-patches via]

[-- Attachment #1.1: Type: text/plain, Size: 620 bytes --]

Hi zimoun,


On Tuesday, October 18th, 2022 at 15:58, zimoun <zimon.toutoune@gmail.com> wrote:

> What is the status? Do we close this submission? Are we waiting for an
> update? Maybe it is included by another patch.

Status: Neglected by myself. Unfortunately, I don't think I can update the patch anytime soon.

I'd like to leave the issue open, though, until I (or someone else) have the time to address it. I sill think it is an issue.

In any case, I have the same issue still open in my personal issue tracker. So, if it needs to be closed for any particular reason here, I won't get mad :)

Cheers,

[-- Attachment #1.2: publickey - luis.felipe.la@protonmail.com - 0x12DE1598.asc --]
[-- Type: application/pgp-keys, Size: 1722 bytes --]

[-- Attachment #2: OpenPGP digital signature --]
[-- Type: application/pgp-signature, Size: 509 bytes --]