WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: What are the semantics in html?

for

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

From:
Date: Wed, Jul 08 2020 4:26PM
Subject: What are the semantics in html?
No previous message | Next message →

Hello everyone,

Before actual diving into aria and wcag2.1 I understood that it is
important for me to betterunderstand html.

I found the course from mozilla web developer (mdn) about it, it is
really clear to read it and I learned really a lot of important
information that i haven't known about html before but , however, i have
some questions.

What are the semantics in html?

I tried to understand the description from here:

https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals

but it is still not clear, maybe because of the language barrier :).

I couldn't understand what the semantics are, what they are needed for
and how they are applied to a screen reader and be used for
accessibility tasks.

I thought that they are the same things as elements such as a heading
from level 1 to 6, but it seems like it is not like that.

So, can somebody explain that please?

Thank you in advance!

--

Best wishes,

Vsevolod

From: glen walker
Date: Wed, Jul 08 2020 4:38PM
Subject: Re: What are the semantics in html?
← Previous message | Next message →

Semantics can be pretty simple. If you use the right HTML element to
define your element then you are using the proper semantics.

If you have a list, use a <ul> or <ol>.
If you have a table, use a <table>
If you have a heading, use an <h1>

Semantic elements have a predefined default role, such as list, table, or
heading. The role is surfaced to the accessibility tree, which allows
assistive technology such as a screen reader to announce the role and other
metadata associated with that role (such as the list level or table
dimensions or heading level) to the user. It also allows screen reader
shortcut keys to work, such as navigating to a list with L or to a table
with T or to a heading with H.

Non-semantic html elements such as <div> or <span> have no default role and
have no intrinsic meaning in the accessibility tree. When a screen reader
user encounters a <div> or <span>, nothing special is announced. You can
use ARIA attributes to define a role and other properties for non-semantic
elements but it's always best to use a semantic HTML element as your first
choice.



On Wed, Jul 8, 2020 at 4:26 PM Всеволод Попов < = EMAIL ADDRESS REMOVED = > wrote:

> Hello everyone,
>
> Before actual diving into aria and wcag2.1 I understood that it is
> important for me to betterunderstand html.
>
> I found the course from mozilla web developer (mdn) about it, it is
> really clear to read it and I learned really a lot of important
> information that i haven't known about html before but , however, i have
> some questions.
>
> What are the semantics in html?
>
> I tried to understand the description from here:
>
>
> https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals
>
> but it is still not clear, maybe because of the language barrier :).
>
> I couldn't understand what the semantics are, what they are needed for
> and how they are applied to a screen reader and be used for
> accessibility tasks.
>
> I thought that they are the same things as elements such as a heading
> from level 1 to 6, but it seems like it is not like that.
>
> So, can somebody explain that please?
>
> Thank you in advance!
>
> --
>
> Best wishes,
>
> Vsevolod
>
> > > > >

From:
Date: Thu, Jul 09 2020 1:24AM
Subject: Re: What are the semantics in html?
← Previous message | Next message →

I wrote this post on "Understanding semantics". Perhaps it'll help.
https://tink.uk/understanding-semantics/

BTW, I know the videos linked from the post are no longer available.
Careless deletion of my old YouTube account meant I lost them, but I do
plan to replace them just as soon as I can.

Léonie.

> I couldn't understand what the semantics are, what they are needed for
> and how they are applied to a screen reader and be used for
> accessibility tasks.
>
> I thought that they are the same things as elements such as a heading
> from level 1 to 6, but it seems like it is not like that.
>
> So, can somebody explain that please?
>
> Thank you in advance!
>
> --
>
> Best wishes,
>
> Vsevolod
>
> > > > --
Director @TetraLogical
https://tetralogical.com

From: Brian Lovely
Date: Thu, Jul 09 2020 6:26AM
Subject: Re: [External Sender]What are the semantics in html?
← Previous message | Next message →

Semantics in HTML is additional information that is understood to be
associated with particular elements. For instance the semantics of a table
include that the data it contains is tabular data. So if a page author uses
a table simply for layout, this is considered a semantic failure.

Part of the semantics of an element being in the tab order is that that
element is actionable, so adding a non-actionable element to the tab order
with tabindex="0" is a semantic failure.

To look at it another way, when a screen reader user encounters a semantic
element, like a well-formed button, they automatically know certain things
about that element:
Role (button)
That it is actionable (specifically with the enter key, space bar, and
mouse)
That activating it will cause some change and/or action on the current page
That said action is related to the button name (for instance
<button>Edit</button>)

On Thu, Jul 9, 2020 at 3:24 AM Léonie Watson < = EMAIL ADDRESS REMOVED = >
wrote:

> I wrote this post on "Understanding semantics". Perhaps it'll help.
>
> https://urldefense.com/v3/__https://tink.uk/understanding-semantics/__;!!EFVe01R3CjU!IgBgbjAAlf2j4ISiDAuvDlPNi4SuYMq3CSgP6z3S8EmENdgoz_jvFIz2nPIrWYpotAVCmA$
>
> BTW, I know the videos linked from the post are no longer available.
> Careless deletion of my old YouTube account meant I lost them, but I do
> plan to replace them just as soon as I can.
>
> Léonie.
>
> > I couldn't understand what the semantics are, what they are needed for
> > and how they are applied to a screen reader and be used for
> > accessibility tasks.
> >
> > I thought that they are the same things as elements such as a heading
> > from level 1 to 6, but it seems like it is not like that.
> >
> > So, can somebody explain that please?
> >
> > Thank you in advance!
> >
> > --
> >
> > Best wishes,
> >
> > Vsevolod
> >
> > > > > https://urldefense.com/v3/__http://list.webaim.org/__;!!EFVe01R3CjU!IgBgbjAAlf2j4ISiDAuvDlPNi4SuYMq3CSgP6z3S8EmENdgoz_jvFIz2nPIrWYqt5gLF_w$
> > List archives at
> https://urldefense.com/v3/__http://webaim.org/discussion/archives__;!!EFVe01R3CjU!IgBgbjAAlf2j4ISiDAuvDlPNi4SuYMq3CSgP6z3S8EmENdgoz_jvFIz2nPIrWYqqbC3nng$
> > >
> --
> Director @TetraLogical
>
> https://urldefense.com/v3/__https://tetralogical.com__;!!EFVe01R3CjU!IgBgbjAAlf2j4ISiDAuvDlPNi4SuYMq3CSgP6z3S8EmENdgoz_jvFIz2nPIrWYoTUDS1Cg$
> > > https://urldefense.com/v3/__http://list.webaim.org/__;!!EFVe01R3CjU!IgBgbjAAlf2j4ISiDAuvDlPNi4SuYMq3CSgP6z3S8EmENdgoz_jvFIz2nPIrWYqt5gLF_w$
> List archives at
> https://urldefense.com/v3/__http://webaim.org/discussion/archives__;!!EFVe01R3CjU!IgBgbjAAlf2j4ISiDAuvDlPNi4SuYMq3CSgP6z3S8EmENdgoz_jvFIz2nPIrWYqqbC3nng$
> >


--
*Brian Lovely*
Capital One Digital Accessibility
804.389.1064

The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.

From: Moore,Michael (Accessibility) (HHSC)
Date: Thu, Jul 09 2020 8:40AM
Subject: Re: What are the semantics in html?
← Previous message | Next message →

Hi Vsevolod,

You asked what semantics are in HTML.

The simplest answer is that semantics tell you what something is.

HTML elements for paragraphs, links, headings, lists, list items, tables, data cells, header cells, different types of form fields and other objects all exist to provide user agents like browsers and screen readers with information that allows them to provide useful information about the structure and nature of the object. Browsers do this through the default visual display of the item and screen reading software conveys this information through sound or braille.

This information makes it easier for the user to navigate through the page, understand how different items are related, and how to interact with controls, links and form fields.

In cases where an object is created using elements that do not provide information about what it is. "Non-Semantic" elements, then the developer can provide that information through ARIA role attributes. Using elements that provide the meaning without the need for ARIA role attributes is preferred but some frameworks and code libraries don't properly use the markup. This does not make them inaccessible or non-compliant with WCAG but the additional role attributes need to be present and need to be correct.

From: R.U. Steinberg
Date: Thu, Jul 09 2020 9:46AM
Subject: Re: What are the semantics in html?
← Previous message | Next message →

Different screen readers have different support for ARIA and not all
assistive technology users can afford to upgrade their systems to the
latest versions of things.

I agree with Mike that semantically correct, native HTML is best. Something
like <button> has built in functionality and is easily recognizable by
assistive technology compared to <span role="button">



On Thu, Jul 9, 2020 at 9:40 AM Moore,Michael (Accessibility) (HHSC) <
= EMAIL ADDRESS REMOVED = > wrote:

> Hi Vsevolod,
>
> You asked what semantics are in HTML.
>
> The simplest answer is that semantics tell you what something is.
>
> HTML elements for paragraphs, links, headings, lists, list items, tables,
> data cells, header cells, different types of form fields and other objects
> all exist to provide user agents like browsers and screen readers with
> information that allows them to provide useful information about the
> structure and nature of the object. Browsers do this through the default
> visual display of the item and screen reading software conveys this
> information through sound or braille.
>
> This information makes it easier for the user to navigate through the
> page, understand how different items are related, and how to interact with
> controls, links and form fields.
>
> In cases where an object is created using elements that do not provide
> information about what it is. "Non-Semantic" elements, then the developer
> can provide that information through ARIA role attributes. Using elements
> that provide the meaning without the need for ARIA role attributes is
> preferred but some frameworks and code libraries don't properly use the
> markup. This does not make them inaccessible or non-compliant with WCAG but
> the additional role attributes need to be present and need to be correct.
> > > > >

From: Murphy, Sean
Date: Thu, Jul 09 2020 5:41PM
Subject: Re: [External Sender]What are the semantics in html?
← Previous message | Next message →

Brian,

The below paragraph I would like you to expand upon as I am not sure if I follow:

" Part of the semantics of an element being in the tab order is that that element is actionable, so adding a non-actionable element to the tab order with tabindex="0" is a semantic failure."


Could you provide a specific example on the above to make it clearer.



Sean Murphy | Accessibility expert/lead
Digital Accessibility manager
Telstra Digital Channels | Digital Systems
Mobile: 0405 129 739 | Desk: (02) 9866-7917

www.telstra.com

This email may contain confidential information.
If I've sent it to you by accident, please delete it immediately



-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Brian Lovely via WebAIM-Forum
Sent: Thursday, 9 July 2020 10:27 PM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Cc: Brian Lovely < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] [External Sender] Re: What are the semantics in html?

[External Email] This email was sent from outside the organisation – be cautious, particularly with links and attachments.

Semantics in HTML is additional information that is understood to be associated with particular elements. For instance the semantics of a table include that the data it contains is tabular data. So if a page author uses a table simply for layout, this is considered a semantic failure.

Part of the semantics of an element being in the tab order is that that element is actionable, so adding a non-actionable element to the tab order with tabindex="0" is a semantic failure.

To look at it another way, when a screen reader user encounters a semantic element, like a well-formed button, they automatically know certain things about that element:
Role (button)
That it is actionable (specifically with the enter key, space bar, and
mouse)
That activating it will cause some change and/or action on the current page That said action is related to the button name (for instance
<button>Edit</button>)

On Thu, Jul 9, 2020 at 3:24 AM Léonie Watson < = EMAIL ADDRESS REMOVED = >
wrote:

> I wrote this post on "Understanding semantics". Perhaps it'll help.
>
> https://urldefense.com/v3/__https://tink.uk/understanding-semantics/__
> ;!!EFVe01R3CjU!IgBgbjAAlf2j4ISiDAuvDlPNi4SuYMq3CSgP6z3S8EmENdgoz_jvFIz
> 2nPIrWYpotAVCmA$
>
> BTW, I know the videos linked from the post are no longer available.
> Careless deletion of my old YouTube account meant I lost them, but I
> do plan to replace them just as soon as I can.
>
> Léonie.
>
> > I couldn't understand what the semantics are, what they are needed
> > for and how they are applied to a screen reader and be used for
> > accessibility tasks.
> >
> > I thought that they are the same things as elements such as a
> > heading from level 1 to 6, but it seems like it is not like that.
> >
> > So, can somebody explain that please?
> >
> > Thank you in advance!
> >
> > --
> >
> > Best wishes,
> >
> > Vsevolod
> >
> > > > > https://urldefense.com/v3/__http://list.webaim.org/__;!!EFVe01R3CjU!Ig
> BgbjAAlf2j4ISiDAuvDlPNi4SuYMq3CSgP6z3S8EmENdgoz_jvFIz2nPIrWYqt5gLF_w$
> > List archives at
> https://urldefense.com/v3/__http://webaim.org/discussion/archives__;!!
> EFVe01R3CjU!IgBgbjAAlf2j4ISiDAuvDlPNi4SuYMq3CSgP6z3S8EmENdgoz_jvFIz2nP
> IrWYqqbC3nng$
> > >
> --
> Director @TetraLogical
>
> https://urldefense.com/v3/__https://tetralogical.com__;!!EFVe01R3CjU!I
> gBgbjAAlf2j4ISiDAuvDlPNi4SuYMq3CSgP6z3S8EmENdgoz_jvFIz2nPIrWYoTUDS1Cg$
> > > https://urldefense.com/v3/__http://list.webaim.org/__;!!EFVe01R3CjU!Ig
> BgbjAAlf2j4ISiDAuvDlPNi4SuYMq3CSgP6z3S8EmENdgoz_jvFIz2nPIrWYqt5gLF_w$
> List archives at
> https://urldefense.com/v3/__http://webaim.org/discussion/archives__;!!
> EFVe01R3CjU!IgBgbjAAlf2j4ISiDAuvDlPNi4SuYMq3CSgP6z3S8EmENdgoz_jvFIz2nP
> IrWYqqbC3nng$ >


--
*Brian Lovely*
Capital One Digital Accessibility
804.389.1064




The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.

From: Patrick H. Lauke
Date: Thu, Jul 09 2020 6:18PM
Subject: Re: [External Sender]What are the semantics in html?
← Previous message | Next message →

On 09/07/2020 13:26, Brian Lovely via WebAIM-Forum wrote:
> Part of the semantics of an element being in the tab order is that that
> element is actionable, so adding a non-actionable element to the tab order
> with tabindex="0" is a semantic failure.

Seems a bit of a stretch. It's a failure of focus order/behaviour, not
of semantics, I'd say... (how it behaves vs what it conveys)

P
--
Patrick H. Lauke

https://www.splintered.co.uk/ | https://github.com/patrickhlauke
https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
twitter: @patrick_h_lauke | skype: patrick_h_lauke

From: Brian Lovely
Date: Fri, Jul 10 2020 5:12AM
Subject: Re: [External Sender]What are the semantics in html?
← Previous message | Next message →

The below paragraph I would like you to expand upon as I am not sure if I
follow:

" Part of the semantics of an element being in the tab order is that that
element is actionable, so adding a non-actionable element to the tab order
with tabindex="0" is a semantic failure."

Could you provide a specific example on the above to make it clearer.

I have encountered the mistaken idea that no content can be navigated by a
user of assistive technology unless the element has been added to the tab
order. This results in numerous non-actionable elements added to the tab
order. like headings, divs, paragraphs, etc. A similar misunderstanding is
that only aria-label exposes content to assistive technology, so you end up
with code like:

<div tabindex="0" aria-label="Mary had a little lamb">Mary had a little
lamb</div>

On Thu, Jul 9, 2020 at 8:19 PM Patrick H. Lauke < = EMAIL ADDRESS REMOVED = >
wrote:

> On 09/07/2020 13:26, Brian Lovely via WebAIM-Forum wrote:
> > Part of the semantics of an element being in the tab order is that that
> > element is actionable, so adding a non-actionable element to the tab
> order
> > with tabindex="0" is a semantic failure.
>
> Seems a bit of a stretch. It's a failure of focus order/behaviour, not
> of semantics, I'd say... (how it behaves vs what it conveys)
>
> P
> --
> Patrick H. Lauke
>
>
> https://urldefense.com/v3/__https://www.splintered.co.uk/__;!!EFVe01R3CjU!MmT4FKmpqP828tFJoWpa4LOos6LNOEbIMzCC6SqsbAJUCdqDurYINLgiYUyhEBcdQXiZkg$
> |
> https://urldefense.com/v3/__https://github.com/patrickhlauke__;!!EFVe01R3CjU!MmT4FKmpqP828tFJoWpa4LOos6LNOEbIMzCC6SqsbAJUCdqDurYINLgiYUyhEBf5mIXkFA$
>
> https://urldefense.com/v3/__https://flickr.com/photos/redux/__;!!EFVe01R3CjU!MmT4FKmpqP828tFJoWpa4LOos6LNOEbIMzCC6SqsbAJUCdqDurYINLgiYUyhEBc68sIRXg$
> |
> https://urldefense.com/v3/__https://www.deviantart.com/redux__;!!EFVe01R3CjU!MmT4FKmpqP828tFJoWpa4LOos6LNOEbIMzCC6SqsbAJUCdqDurYINLgiYUyhEBePUUHjjw$
> twitter: @patrick_h_lauke | skype: patrick_h_lauke
> > > https://urldefense.com/v3/__http://list.webaim.org/__;!!EFVe01R3CjU!MmT4FKmpqP828tFJoWpa4LOos6LNOEbIMzCC6SqsbAJUCdqDurYINLgiYUyhEBff5RcZJQ$
> List archives at
> https://urldefense.com/v3/__http://webaim.org/discussion/archives__;!!EFVe01R3CjU!MmT4FKmpqP828tFJoWpa4LOos6LNOEbIMzCC6SqsbAJUCdqDurYINLgiYUyhEBda7XhVyw$
> >


--
*Brian Lovely*
Capital One Digital Accessibility
804.389.1064




The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.

From:
Date: Fri, Jul 10 2020 5:25AM
Subject: Re: [External Sender]What are the semantics in html?
← Previous message | Next message →

On 10/07/2020 12:12, Brian Lovely via WebAIM-Forum wrote:
> The below paragraph I would like you to expand upon as I am not sure if I
> follow:
>
> " Part of the semantics of an element being in the tab order is that that
> element is actionable, so adding a non-actionable element to the tab order
> with tabindex="0" is a semantic failure."
>
> Could you provide a specific example on the above to make it clearer.
>
> I have encountered the mistaken idea that no content can be navigated by a
> user of assistive technology unless the element has been added to the tab
> order. This results in numerous non-actionable elements added to the tab
> order. like headings, divs, paragraphs, etc. A similar misunderstanding is
> that only aria-label exposes content to assistive technology, so you end up
> with code like:
>
> <div tabindex="0" aria-label="Mary had a little lamb">Mary had a little
> lamb</div>

Making every element focusable is a mistake that developers do make
sometimes, albeit with good intentions, but it really doesn't have
anything to do with semantics as Patrick mentioned. An h1 with
tabindex="0" is still semantically a heading, just one that you can
focus on with a keyboard when you likely shouldn't be able to.

> On Thu, Jul 9, 2020 at 8:19 PM Patrick H. Lauke < = EMAIL ADDRESS REMOVED = >
> wrote:
>
>> On 09/07/2020 13:26, Brian Lovely via WebAIM-Forum wrote:
>>> Part of the semantics of an element being in the tab order is that that
>>> element is actionable, so adding a non-actionable element to the tab
>> order
>>> with tabindex="0" is a semantic failure.
>>
>> Seems a bit of a stretch. It's a failure of focus order/behaviour, not
>> of semantics, I'd say... (how it behaves vs what it conveys)
>>
>> P
>> --
>> Patrick H. Lauke
>>
>>
>> https://urldefense.com/v3/__https://www.splintered.co.uk/__;!!EFVe01R3CjU!MmT4FKmpqP828tFJoWpa4LOos6LNOEbIMzCC6SqsbAJUCdqDurYINLgiYUyhEBcdQXiZkg$
>> |
>> https://urldefense.com/v3/__https://github.com/patrickhlauke__;!!EFVe01R3CjU!MmT4FKmpqP828tFJoWpa4LOos6LNOEbIMzCC6SqsbAJUCdqDurYINLgiYUyhEBf5mIXkFA$
>>
>> https://urldefense.com/v3/__https://flickr.com/photos/redux/__;!!EFVe01R3CjU!MmT4FKmpqP828tFJoWpa4LOos6LNOEbIMzCC6SqsbAJUCdqDurYINLgiYUyhEBc68sIRXg$
>> |
>> https://urldefense.com/v3/__https://www.deviantart.com/redux__;!!EFVe01R3CjU!MmT4FKmpqP828tFJoWpa4LOos6LNOEbIMzCC6SqsbAJUCdqDurYINLgiYUyhEBePUUHjjw$
>> twitter: @patrick_h_lauke | skype: patrick_h_lauke
>> >> >> https://urldefense.com/v3/__http://list.webaim.org/__;!!EFVe01R3CjU!MmT4FKmpqP828tFJoWpa4LOos6LNOEbIMzCC6SqsbAJUCdqDurYINLgiYUyhEBff5RcZJQ$
>> List archives at
>> https://urldefense.com/v3/__http://webaim.org/discussion/archives__;!!EFVe01R3CjU!MmT4FKmpqP828tFJoWpa4LOos6LNOEbIMzCC6SqsbAJUCdqDurYINLgiYUyhEBda7XhVyw$
>> >>
>
>

--
Director @TetraLogical
https://tetralogical.com

From: Mallory
Date: Fri, Jul 10 2020 5:29AM
Subject: Re: [External Sender]What are the semantics in html?
← Previous message | Next message →

Hm, if the focusable element is not in an incorrect order or doesn't have a tabindex larger than 0, it shouldn't fail Focus Order. The focus is still in visual and content order, no?

If it has no JavaScript to Do Something, it likely doesn't count as a "user interface component" and therefore is not covered by 4.1.2. 1.3.1 is also a stretch, as there's nothing in there that suggests the focusablility of something is expected to convey information (although in practice, people expect if they can Tab to it, it should Do Something. In that sense, I agree with Brian).

If it's there to allow keyboarders to scroll the content, it's a good idea to give the container a role and a name. I've heard more than one screen reader user complaining either that there's "focus mistakes" or "they made buttons I can't click", not realising these are for sighted keyboarders and don't do anything on click. Both times this was with a chat window, which had no focusables inside for keyboarders to scroll, and ideally should have a role (like "log") and a name ("Chat Window").

cheers,
_mallory

On Fri, Jul 10, 2020, at 2:18 AM, Patrick H. Lauke wrote:
> On 09/07/2020 13:26, Brian Lovely via WebAIM-Forum wrote:
> > Part of the semantics of an element being in the tab order is that that
> > element is actionable, so adding a non-actionable element to the tab order
> > with tabindex="0" is a semantic failure.
>
> Seems a bit of a stretch. It's a failure of focus order/behaviour, not
> of semantics, I'd say... (how it behaves vs what it conveys)
>
> P
> --
> Patrick H. Lauke
>
> https://www.splintered.co.uk/ | https://github.com/patrickhlauke
> https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
> twitter: @patrick_h_lauke | skype: patrick_h_lauke
> > > > >

From: Brian Lovely
Date: Fri, Jul 10 2020 7:41AM
Subject: Re: [External Sender]What are the semantics in html?
← Previous message | Next message →

I disagree that a non-actionable element added to the tab order is not a
failure of semantics. Semantics is information that you know based on the
attributes of an element. For instance if the role is "heading" then part
of the semantics, the meta-data about that element, is that it is
non-actionable and not expected in the tab order. If an element is in the
tab order, there might certainly be an expectation that that element is
actionable, otherwise why would it be in the tab order in the first place.
This expectation directly results from the perceived semantics of the
element being in the tab order.

Maybe this works better as an explanation to developers why they shouldn't
do this, rather than in the current context, but to me it makes perfect
sense to consider the semantics of being in the tab order.




The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.

From: Steve Green
Date: Fri, Jul 10 2020 9:16AM
Subject: Re: [External Sender]What are the semantics in html?
← Previous message | Next message →

No, that's not what semantics are. Semantics are about meaning, not behaviour. There may be specifications or unwritten understandings regarding the behaviours of different semantic elements, but they have nothing to do with the semantics themselves.

Steve Green
Managing Director
Test Partners Ltd


-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Brian Lovely via WebAIM-Forum
Sent: 10 July 2020 14:42
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Cc: Brian Lovely < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] [External Sender] Re: What are the semantics in html?

I disagree that a non-actionable element added to the tab order is not a failure of semantics. Semantics is information that you know based on the attributes of an element. For instance if the role is "heading" then part of the semantics, the meta-data about that element, is that it is non-actionable and not expected in the tab order. If an element is in the tab order, there might certainly be an expectation that that element is actionable, otherwise why would it be in the tab order in the first place.
This expectation directly results from the perceived semantics of the element being in the tab order.

Maybe this works better as an explanation to developers why they shouldn't do this, rather than in the current context, but to me it makes perfect sense to consider the semantics of being in the tab order.




The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.

From: Patrick H. Lauke
Date: Fri, Jul 10 2020 3:46PM
Subject: Re: [External Sender]What are the semantics in html?
← Previous message | Next message →

On 10/07/2020 12:29, Mallory wrote:
> Hm, if the focusable element is not in an incorrect order or doesn't have a tabindex larger than 0, it shouldn't fail Focus Order. The focus is still in visual and content order, no?

One way of thinking of it (at least one that I've used in the past, but
always happy to reevaluate my thinking) is that if an element should not
even BE in the focus order at all (because it's non-interactive/not
useful to have it in the focus order), then that's a failure of it (as
arguably the order/sequence should only include focusable elements).
Admittedly, that could be seen as a stretch?

> If it has no JavaScript to Do Something, it likely doesn't count as a "user interface component" and therefore is not covered by 4.1.2. 1.3.1 is also a stretch, as there's nothing in there that suggests the focusablility of something is expected to convey information (although in practice, people expect if they can Tab to it, it should Do Something. In that sense, I agree with Brian).

So where would you report things that take focus when they shouldn't? Or
do you just pass them (but perhaps mention this as a best practice issue)?

P
--
Patrick H. Lauke

https://www.splintered.co.uk/ | https://github.com/patrickhlauke
https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
twitter: @patrick_h_lauke | skype: patrick_h_lauke

From: Steve Green
Date: Sat, Jul 11 2020 6:53AM
Subject: Re: [External Sender]What are the semantics in html?
← Previous message | Next message →

The success criterion states "focusable components receive focus in an order that preserves meaning and operability". If there are only one or two components that receive focus when they should not, my view is that neither the meaning nor operability are significantly impaired, so I just recommend that they are made non-focusable.

However, if a lot of components receive focus when they should not, my view is that this impairs the operability so I report a non-conformance. We see this an awful lot with e-learning systems, but virtually nowhere else.

Steve Green
Managing Director
Test Partners Ltd


-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Patrick H. Lauke
Sent: 10 July 2020 22:47
To: = EMAIL ADDRESS REMOVED =
Subject: Re: [WebAIM] [External Sender] Re: What are the semantics in html?

On 10/07/2020 12:29, Mallory wrote:
> Hm, if the focusable element is not in an incorrect order or doesn't have a tabindex larger than 0, it shouldn't fail Focus Order. The focus is still in visual and content order, no?

One way of thinking of it (at least one that I've used in the past, but always happy to reevaluate my thinking) is that if an element should not even BE in the focus order at all (because it's non-interactive/not useful to have it in the focus order), then that's a failure of it (as arguably the order/sequence should only include focusable elements).
Admittedly, that could be seen as a stretch?

> If it has no JavaScript to Do Something, it likely doesn't count as a "user interface component" and therefore is not covered by 4.1.2. 1.3.1 is also a stretch, as there's nothing in there that suggests the focusablility of something is expected to convey information (although in practice, people expect if they can Tab to it, it should Do Something. In that sense, I agree with Brian).

So where would you report things that take focus when they shouldn't? Or do you just pass them (but perhaps mention this as a best practice issue)?

P
--
Patrick H. Lauke

https://www.splintered.co.uk/ | https://github.com/patrickhlauke https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
twitter: @patrick_h_lauke | skype: patrick_h_lauke

From: Mallory
Date: Thu, Jul 16 2020 10:19AM
Subject: Re: [External Sender]What are the semantics in html?
← Previous message | No next message

[oh boy, first time back to email in a week]
> Patrick H. Lauke wrote,
>
> So where would you report things that take focus when they shouldn't?
> Or do you just pass them (but perhaps mention this as a best practice
> issue)?
>

I do similar as Steve: I've run across pages with tens of focusable things (the devs thought it was required for screen reader users to read the content). It made using the page with keyboard impossible. Although again, can't use 2.1.1 for that, as that says only that things CAN be operated with keyboard, not that they can be operated sanely by humans in practicality.

If it's an item here or there, I mention it. Most places I audit at, we're allowed to make "UX" tickets, for things that make it difficult for users with disabilities to operate or understand a web page, but aren't covered by WCAG.

cheers,
_mallory

On Sat, Jul 11, 2020, at 2:53 PM, Steve Green wrote:
> The success criterion states "focusable components receive focus in an
> order that preserves meaning and operability". If there are only one or
> two components that receive focus when they should not, my view is that
> neither the meaning nor operability are significantly impaired, so I
> just recommend that they are made non-focusable.
>
> However, if a lot of components receive focus when they should not, my
> view is that this impairs the operability so I report a
> non-conformance. We see this an awful lot with e-learning systems, but
> virtually nowhere else.
>
> Steve Green
> Managing Director
> Test Partners Ltd
>
>
> -----Original Message-----
> From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of
> Patrick H. Lauke
>
> So where would you report things that take focus when they shouldn't?
> Or do you just pass them (but perhaps mention this as a best practice
> issue)?
>