How To Navigate Tidbits Using A Screen Reader Part 2. A Semantic Argument. Top Tech Tidbits Modifies Its Custom Email Template Once Again. We Thought It Was Perfect. Then A Reader Recommended Something Much More Simple.
Author: Aaron Di Blasi, Publisher, Top Tech Tidbits
Share to Facebook
Back on January 13th 2022 we published an article titled "How To Navigate Tidbits Using A Screen Reader. Tidbits Reader Feedback Plus Publisher Rant Answers The Question: Do Users of Screen Reader Technology Read Advertisements?"
In this article we outlined updates that we made to the Tidbits Email Template intended to make navigating the newsletter even easier for screen reader users. And it was a huge success. So maybe we should have left it alone. You be the judge.
In the simplest possible terms we initially made the decision to go with a "hard specification" in creating our hierarchical headings scheme for Tidbits. You know the one, only one H1 per document with each successive set of subsequent information represented by a heading one level lower. We were utilizing H1 through H5 heading tags to describe all of the information in the newsletter.
That is until we received a recommendation from a brave Tidbits Reader by the name of Winslow Parker. Winslow has been reading Tidbits since its inception (that's 18 years) and has always found it to be a helpful tool both in his work as an adaptive technology specialist and now in his retirement.
Winslow's suggestion was as simple as it was practical. Utilize only two heading levels. H1 and H2. Make all of the section headings H1 and all subsequent items under them H2. That's it. Easy peasey.
But wait a minute, you say? You can't use more than one H1 per document! And while we hear you, actually, you can. While having only one H1 per document is indeed a best practice, it does not represent a breach of WCAG to have more than one within a document, as outlined in this infamous TPGi article which states,
"A top-heavy heading hierarchy is unusual but not incorrect. Users typically expect only a single H1, which is used to represent the main heading or title on the page. As long as the visual presentation of multiple H1s doesn't imply a hierarchy (such as the first H1 being styled visually to be larger or bolder than the second H1), then having more than one H1 — while potentially confusing — does not represent a WCAG failure."
It is our belief that this "potential confusion" only arises when this technique is used to serve visual users, for they do not possess the ability to navigate by heading level. So we decided to give it a try beginning in our March 3rd 2022 issue. Please feel free to share with us any feedback that you might have and I'll be sure to share it in future issues.
If implemented properly a hierarchical headings scheme can provide a means of navigation that, frankly, makes navigating and reading the document even faster for a screen reader user than it would be for a sighted reader. How so? Because sighted readers must scroll. But screen reader users can navigate the document in many other ways if the document has been properly marked up using a hierarchical headings scheme.
Don't believe me? If you're a screen reader user try it out for yourself.
If you're using NVDA, use INS+F7 to display the heading list and the link list. Then use H and SHIFT+H to jump to the next title or the previous title (H1 to H6 title tags).
If you're using JAWS, use INS+F6 to display the heading list and INS+F7 to display the link list.
Now just load up the most recent issue of Top Tech Tidbits in your email client or in your browser from https://www.toptechtidbits.com/#most-recent-issues and use the following hierarchical headings scheme to navigate:
➜ H1 headings are used to represent the newsletter title and every subsequent section title thereafter. Currently these sections are presented within the newsletter in the following order: Newsletter Title, This Week's Featured Advertisement, Dear Tidbits Subscriber (Tidbits), Press Releases and Other News, Featured Podcast Episodes, Featured Webinars and Training Courses, Directories, Buy, Sell or Trade, Sponsor Classified Ads, Supporters and Subscription Information.
➜ H2 headings are used to represent any child headings required by an H1 heading.
And that's it. Do you have any suggestions, recommendations or considerations that we did not include here? If you do, please share them with us at: email@example.com.
Thanks so much for reading!
Aaron Di Blasi, PMP (2006 - Present)
Publisher, Top Tech Tidbits for Thursday
The Week's News in Adaptive Technology
Project Management Professional, Mind Vault Solutions, Ltd.
Innovative ideas. Solutions that perform.
Digital Marketing Associate, Meta Certified (2022 - Present) ✔
Social Marketing Professional, Hootsuite Certified (2020 - Present) ✔
Email Marketing Professional, Constant Contact Certified (2019 - Present) ✔
Email: firstname.lastname@example.org ✉
Premium Subscriber: https://toptechtidbits.com/premium
RSS Feed: https://toptechtidbits.com/rss
Sponsorship Information: https://toptechtidbits.com/sponsor
Archive Search: https://toptechtidbits.com/search
A Mind Vault Solutions, Ltd. Publication: https://mvsltd.com