govCMS / ui-kit-base-theme

DTA UI-kit (version 1.x) based Drupal (7.x) theme
4 stars 2 forks source link

The site title and slogan shouldn't be HTML headings #53

Closed mgdhs closed 7 years ago

mgdhs commented 7 years ago

Currently the site information in the header is:

<div class="page-header__site-info">
  <h1>Department of Human Services</h1>
  <h2>Delivering social and health-related payments and services.</h2>
</div>

(Where h1 is the title, h2 is the slogan)

Generally it's considered bad practice to have these as headings. There are however, some differing opinions. The W3 says (emphasis mine):

When looking at the content, the highest available heading level should be used to mark up the heading of the main content, as this makes it easy to discover.

You'll also notice in the DTA's old design guide where they actually mention the header, it isn't done using headings either.

An added advantage is they are styled independently.

mgdhs commented 7 years ago

https://github.com/govCMS/ui-kit-base-theme/pull/54

Resulting code is

<div class="page-header__site-info">
  <div class="page-header__site-title">Department of Human Services</div>
  <div class="page-header__site_slogan">Delivering social and health-related payments and services</div>
</div>

I'm however not sure if it actually works or I had something stuck in my local environment, and if I captured it everywhere, including the prototyping.

I'm not sure if it also needs to be updated in the prototyping.

Feng-Shui commented 7 years ago

Merged