WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Importance of some semantic inline HTML elements?

for

Number of posts in this thread: 3 (In chronological order)

From: Silas
Date: Thu, Oct 21 2021 11:28AM
Subject: Importance of some semantic inline HTML elements?
No previous message | Next message →

Hello.

I've been more and more worried about accessibility (specially the screen reading part of the thing), although I don't have any accessibility needs at the moment.

I'm also a user of some simple markup languages like Markdown, reStructuredText and others. Since none (?) of them take accessibility issues seriously, I started to devise my own Markdown-like language that can output some important HTML 5 tags for screen readers. I would like, though, to keep the language simple enough by not implementing all HTML 5 tags and I would like to know if I can leave some things out (specially nested tags).

Some examples:

Definition lists:
<dl>
<dt><code>term</code></dt><dd>description</dd>
</dl>

See the "<code></code>" tag? Is it at all necessary inside a <dt></dt> tag?

Also, is there any difference between <strong> and <em> (for the screenreader) at all?

How important it is to mark different language content with <span="xx">term</span>?

Please, realize that all my questions are about inline elements.

I ask this because I've been making some tests with NVDA for Windows and TalkBack for Android and I see no difference if I use these tags or not. It seems much more important to use tags that makes difference for user navigation, like correctly using headers (<h1>, <h2>, ...) for titles, links descriptions, bullet or definition lists, etc. Also, aria-hidden="true" attribute seems really important for ASCII diagrams in <pre></pre> blocks.

Thank you very much.

From: TJ McElroy
Date: Thu, Oct 21 2021 1:25PM
Subject: Re: Importance of some semantic inline HTML elements?
← Previous message | Next message →

Hi,

I am instrested in using your mark down version

How could I get a version to try out?

Thanks,


On 10/21/2021 1:28 PM, Silas wrote:
> Hello.
>
> I've been more and more worried about accessibility (specially the
> screen reading part of the thing), although I don't have any
> accessibility needs at the moment.
>
> I'm also a user of some simple markup languages like Markdown,
> reStructuredText and others. Since none (?) of them take accessibility
> issues seriously, I started to devise my own Markdown-like language
> that can output some important HTML 5 tags for screen readers. I would
> like, though, to keep the language simple enough by not implementing
> all HTML 5 tags and I would like to know if I can leave some things
> out (specially nested tags).
>
> Some examples:
>
> Definition lists:
> <dl>
> <dt><code>term</code></dt><dd>description</dd>
> </dl>
>
> See the "<code></code>" tag? Is it at all necessary inside a <dt></dt>
> tag?
>
> Also, is there any difference between <strong> and <em> (for the
> screenreader) at all?
>
> How important it is to mark different language content with
> <span="xx">term</span>?
>
> Please, realize that all my questions are about inline elements.
>
> I ask this because I've been making some tests with NVDA for Windows
> and TalkBack for Android and I see no difference if I use these tags
> or not. It seems much more important to use tags that makes difference
> for user navigation, like correctly using headers (<h1>, <h2>, ...)
> for titles, links descriptions, bullet or definition lists, etc. Also,
> aria-hidden="true" attribute seems really important for ASCII diagrams
> in <pre></pre> blocks.
>
> Thank you very much.
> > > > --


6270 Corporate Drive
Indianapolis, IN 46278

bosma.org
<http://bosma.org/>;


*Facebook <https://www.facebook.com/bosmaenterprises>
/ Twitter <https://twitter.com/Bosmaenterprise>* / *Linkedin*
<https://www.linkedin.com/company/306575?trk=tyah&trkInfo=clickedVertical%3Acompany%2CclickedEntityId%3A306575%2Cidx%3A2-1-2%2CtarId%3A1477402422293%2Ctas%3Abosma%20enterhttp://>;

Bosma
Enterprises office is closed November 11 for
Veteran's Day and
November 25 and 26 for the Thanksgiving Holiday

From: Birkir R. Gunnarsson
Date: Sun, Oct 24 2021 12:04PM
Subject: Re: Importance of some semantic inline HTML elements?
← Previous message | No next message

Most of the elements you described have limited or no screen reader supprt:

* Description lists are at best treated like nested lists by most
screen readers, better to just use nested list, especially if the term
is marked up as a heading inside the list element. This can be
technically done entirely in Markdown
* Screen readers do noting with <em> and <strong> out of the box. ARIA
1.3 is adding roles which possibly maybe can help improve screen
reader support, or you can use CSS:content for screen readers to add
phrases like "start or emphasized text" etc. (see a detailed
description of the technique at
https://adrianroselli.com/2019/02/f87-css-generated-content-and-wcag-conformance.html).
For code, just use the markdown ``` to mark start and end of code.
Also remember you can write html elements right into Markdown.

On 10/21/21, TJ McElroy < = EMAIL ADDRESS REMOVED = > wrote:
> Hi,
>
> I am instrested in using your mark down version
>
> How could I get a version to try out?
>
> Thanks,
>
>
> On 10/21/2021 1:28 PM, Silas wrote:
>> Hello.
>>
>> I've been more and more worried about accessibility (specially the
>> screen reading part of the thing), although I don't have any
>> accessibility needs at the moment.
>>
>> I'm also a user of some simple markup languages like Markdown,
>> reStructuredText and others. Since none (?) of them take accessibility
>> issues seriously, I started to devise my own Markdown-like language
>> that can output some important HTML 5 tags for screen readers. I would
>> like, though, to keep the language simple enough by not implementing
>> all HTML 5 tags and I would like to know if I can leave some things
>> out (specially nested tags).
>>
>> Some examples:
>>
>> Definition lists:
>> <dl>
>> <dt><code>term</code></dt><dd>description</dd>
>> </dl>
>>
>> See the "<code></code>" tag? Is it at all necessary inside a <dt></dt>
>> tag?
>>
>> Also, is there any difference between <strong> and <em> (for the
>> screenreader) at all?
>>
>> How important it is to mark different language content with
>> <span="xx">term</span>?
>>
>> Please, realize that all my questions are about inline elements.
>>
>> I ask this because I've been making some tests with NVDA for Windows
>> and TalkBack for Android and I see no difference if I use these tags
>> or not. It seems much more important to use tags that makes difference
>> for user navigation, like correctly using headers (<h1>, <h2>, ...)
>> for titles, links descriptions, bullet or definition lists, etc. Also,
>> aria-hidden="true" attribute seems really important for ASCII diagrams
>> in <pre></pre> blocks.
>>
>> Thank you very much.
>> >> >> >> > --
>
>
> 6270 Corporate Drive
> Indianapolis, IN 46278
>
> bosma.org
> <http://bosma.org/>;
>
>
> *Facebook <https://www.facebook.com/bosmaenterprises>
> / Twitter <https://twitter.com/Bosmaenterprise>* / *Linkedin*
> <https://www.linkedin.com/company/306575?trk=tyah&trkInfo=clickedVertical%3Acompany%2CclickedEntityId%3A306575%2Cidx%3A2-1-2%2CtarId%3A1477402422293%2Ctas%3Abosma%20enterhttp://>;
>
> Bosma
> Enterprises office is closed November 11 for
> Veteran's Day and
> November 25 and 26 for the Thanksgiving Holiday
>
>
>
>
>
>
>
>
>
>
>
>
>
> > > > >


--
Work hard. Have fun. Make history.