Adding H1 to tabs for Accessibility

classic Classic list List threaded Threaded
2 messages Options
Reply | Threaded
Open this post in threaded view
|

Adding H1 to tabs for Accessibility

Benito J. Gonzalez-2
Hi folks,

TAMU has surfaced that a best practice is to have H1s to separate major content for accessibility. uPortal should use H1s for tabs.

This change is can potentially break some css in Custom skins. It should be rather simple to find and correct the CSS, however.

So should we make this change in a patch release, enhancement, or wait for uP6?

Best,

Benito J. Gonzalez
Senior Software Developer
Unicon, Inc.
Voice:  209.777.2754
 Text:  209.777.2754
Email:  [hidden email]
GitHub:  bjagg
BitBucket:  bjagg




--
You received this message because you are subscribed to the Google Groups "uPortal Developers" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/a/apereo.org/d/msgid/uportal-dev/32EDDE6B-3E60-41FF-80E9-2706E1423C05%40unicon.net.
Reply | Threaded
Open this post in threaded view
|

Re: Adding H1 to tabs for Accessibility

Christian Cousquer
further reading : Page must contain a one-level heading in https://dequeuniversity.com/rules/axe/3.0/page-has-heading-one

Le sam. 29 févr. 2020 à 22:40, Christian Cousquer <[hidden email]> a écrit :
Hi Benito,

Sorry for the late response. 
Are you saying that:
- There will be several H1 on the page?
- There will be H1s into the navigation?

If so, it is not for accessibility purposes because those cases will be two accessibility criterion’s failures and I’m afraid of that, perhaps someone has gave bad advices to TAMU

What could be done might be instead this:

‘’’
<header>
  <img src=“...” alt=“uPortal logo” />
...
</header>

<nav>
<ul>
<li>
<a href=“/“ aria-current=“page”>Home</a>
</li>

<li>
<a href=“...” >Tab n•2</a>
</li>

<li>
<a href=“...” >Tab n•3</a>
</li>

</ul>
</nav>

<main>

<!— a single H1 in the page  here —>

  <h1>Home</h1>

  


  <article>

    <h2>service / portlet 1</h2>

    <p>bla bla bla</p>

  </article>


  <article>

    <h2>service / portlet 2</h2>

    <p>bla bla bla</p>

  </article>


  <article>

    <h2>service / portlet 3</h2>

    <p>bla bla bla</p>

  </article>


</main>

‘’’

Super sorry I’m taping this on my phone, and it is a too short answer. 

@christianmurphy thought?

Amicalement,
-ChristianC



Le ven. 28 févr. 2020 à 23:31, Benito J. Gonzalez <[hidden email]> a écrit :
Hi folks,

TAMU has surfaced that a best practice is to have H1s to separate major content for accessibility. uPortal should use H1s for tabs.

This change is can potentially break some css in Custom skins. It should be rather simple to find and correct the CSS, however.

So should we make this change in a patch release, enhancement, or wait for uP6?

Best,

Benito J. Gonzalez
Senior Software Developer
Unicon, Inc.
Voice:  209.777.2754
 Text:  209.777.2754
Email:  [hidden email]
GitHub:  bjagg
BitBucket:  bjagg




--
You received this message because you are subscribed to the Google Groups "uPortal Developers" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/a/apereo.org/d/msgid/uportal-dev/32EDDE6B-3E60-41FF-80E9-2706E1423C05%40unicon.net.

--
You received this message because you are subscribed to the Google Groups "uPortal Developers" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/a/apereo.org/d/msgid/uportal-dev/CABXcw2Vxg8ic8vpww3HE77-Nk0szrD1pvic1Sa7H0CNMd8xLCQ%40mail.gmail.com.