WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Accessible P Tag Usage

for

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

From: Peter Shikli
Date: Sat, Mar 16 2019 4:05PM
Subject: Accessible P Tag Usage
No previous message | Next message →

Access2online audits webpages and electronic documents for compliance
with WCAG and Section 508. As our understanding of WCAG has deepened and
evolved, several times we have been confronted with the situation where
one section of the guideline implies or directly contradicts another
section or another resource such as WAVE, AXE, or Deque training
materials. We often seem to be too strict interpreting the guidelines
related to 1.3.1. Much of guideline would certainly improve usability,
but we are aware of the difference between accessibility and usability.
We would like input from the accessibility community about what to do
when such a situation arises as in the following examples.

The 1.3.1 Info and Relationships states "Information, structure, and
relationships conveyed through presentation can be programmatically
determined or are available in text."  Further in the "Understanding SC
1.3.1" it says "When such relationships are perceivable to one set of
users, those relationships can be made to be perceivable to all."
Looking at specific failure conditions, F43 tells us that structural
markup cannot be used in a way that does not represent relationship in
the content. Then G115 says:

    "... Using the appropriate semantic elements will make sure the
structure is available to the user agent. This involves explicitly
indicating the role that different units have in understanding the
meaning of the content. The nature of a piece of content as a paragraph,
header, emphasized text, table, etc. can all be indicated in this way. ..."

The strictest interpretation of these items is that it is required that
relationships in content are programmatically available, including
content "... such as a paragraph ...". Is this to be taken as saying
text should, at a minimum, programmatically be a <p> tag, unless there
is a more appropriate structural tag?

We are aware that the sufficient techniques do not constitute required
ways of doing things, so we are hesitant to violate a customer based on
the suggested ways of meeting the criteria. However, when a failure
condition says content must be semantically appropriate, then a
sufficient technique lists paragraphs as appropriate semantics for text
content, this implies that if text content is not in a <p> or a more
appropriate tag (like  headings, lists, etc.) it is not making the
relationship/information about the text "available to all users."

On the flip side, what about including an empty <p> tag with no text
content, or only an image?

Our concern arises from the fact that AXE and WAVE do not violate text
content which is not  included in a <p> or other semantically
appropriate tag and the Deque curriculum says very little about
semantics that is not addressing tables, headings and the like.
Deque/AXE suggests that having free-floating text included in an
HTML5/ARIA landmark is a minimal "best practice". What is the community
opinion on quandaries like this?

Peter Shikli
on behalf of inmate Juliette McShane
www.Access2online.com

From: Patrick H. Lauke
Date: Sat, Mar 16 2019 6:52PM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

On 16/03/2019 22:05, Peter Shikli wrote:
[...]
> The strictest interpretation of these items is that it is required that
> relationships in content are programmatically available, including
> content "... such as a paragraph ...". Is this to be taken as saying
> text should, at a minimum, programmatically be a <p> tag, unless there
> is a more appropriate structural tag?

Taking it at the letter, yes, it could possibly be interpreted that way.
But it's just as valid, semantically, to have text just inside a <div>
or similar, so it gets very fuzzy. You could argue that if authors break
up sections of text using multiple <br> breaks instead of wrapping
things into separate containers (like <p> or similar), it's a failure.
But in general, I'd say this would be a "soft" failure (low severity,
low priority) at best (depending on the circumstances of course), and
generally I wouldn't bother looking for this sort of failure as most
sites I see have much more fundamental problems that cause greater problems.

P
--
Patrick H. Lauke

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

From: Jim Homme
Date: Mon, Mar 18 2019 9:29AM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

Hi,
I think that my next statement comes from the old days, possibly before div tags. I have always put paragraphs inside div tags and have not put just text in them. Does that matter?

Thanks.

Jim



==========
Jim Homme
Digital Accessibility
Bender Consulting Services
412-787-8567
https://www.benderconsult.com/our%20services/hightest-accessible-technology-solutions

-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Patrick H. Lauke
Sent: Saturday, March 16, 2019 8:53 PM
To: = EMAIL ADDRESS REMOVED =
Subject: Re: [WebAIM] Accessible P Tag Usage

On 16/03/2019 22:05, Peter Shikli wrote:
[...]
> The strictest interpretation of these items is that it is required
> that relationships in content are programmatically available,
> including content "... such as a paragraph ...". Is this to be taken
> as saying text should, at a minimum, programmatically be a <p> tag,
> unless there is a more appropriate structural tag?

Taking it at the letter, yes, it could possibly be interpreted that way.
But it's just as valid, semantically, to have text just inside a <div> or similar, so it gets very fuzzy. You could argue that if authors break up sections of text using multiple <br> breaks instead of wrapping things into separate containers (like <p> or similar), it's a failure.
But in general, I'd say this would be a "soft" failure (low severity, low priority) at best (depending on the circumstances of course), and generally I wouldn't bother looking for this sort of failure as most sites I see have much more fundamental problems that cause greater problems.

P
--
Patrick H. Lauke

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

From: Tim Harshbarger
Date: Mon, Mar 18 2019 10:17AM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

My personal opinion is that it is not a requirement for text to be contained in at least a paragraph element. My thinking is that a paragraph element conveys that its contents are all part of a paragraph--and that might not be the information or relationship that the content author wants to convey.

This is definitely a good question since it shows you are trying not to make assumptions--and it is always good to think about our assumptions.

Thanks for asking this question.

Tim
Tim Harshbarger
Senior Accessibility Consultant
Deque Systems

-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Peter Shikli
Sent: Saturday, March 16, 2019 5:06 PM
To: WebAIM Forum < = EMAIL ADDRESS REMOVED = >
Subject: [WebAIM] Accessible P Tag Usage

Access2online audits webpages and electronic documents for compliance with WCAG and Section 508. As our understanding of WCAG has deepened and evolved, several times we have been confronted with the situation where one section of the guideline implies or directly contradicts another section or another resource such as WAVE, AXE, or Deque training materials. We often seem to be too strict interpreting the guidelines related to 1.3.1. Much of guideline would certainly improve usability, but we are aware of the difference between accessibility and usability.
We would like input from the accessibility community about what to do when such a situation arises as in the following examples.

The 1.3.1 Info and Relationships states "Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text." Further in the "Understanding SC 1.3.1" it says "When such relationships are perceivable to one set of users, those relationships can be made to be perceivable to all."
Looking at specific failure conditions, F43 tells us that structural markup cannot be used in a way that does not represent relationship in the content. Then G115 says:

"... Using the appropriate semantic elements will make sure the structure is available to the user agent. This involves explicitly indicating the role that different units have in understanding the meaning of the content. The nature of a piece of content as a paragraph, header, emphasized text, table, etc. can all be indicated in this way. ..."

The strictest interpretation of these items is that it is required that relationships in content are programmatically available, including content "... such as a paragraph ...". Is this to be taken as saying text should, at a minimum, programmatically be a <p> tag, unless there is a more appropriate structural tag?

We are aware that the sufficient techniques do not constitute required ways of doing things, so we are hesitant to violate a customer based on the suggested ways of meeting the criteria. However, when a failure condition says content must be semantically appropriate, then a sufficient technique lists paragraphs as appropriate semantics for text content, this implies that if text content is not in a <p> or a more appropriate tag (like headings, lists, etc.) it is not making the relationship/information about the text "available to all users."

On the flip side, what about including an empty <p> tag with no text content, or only an image?

Our concern arises from the fact that AXE and WAVE do not violate text content which is not included in a <p> or other semantically appropriate tag and the Deque curriculum says very little about semantics that is not addressing tables, headings and the like.
Deque/AXE suggests that having free-floating text included in an HTML5/ARIA landmark is a minimal "best practice". What is the community opinion on quandaries like this?

Peter Shikli
on behalf of inmate Juliette McShane
www.Access2online.com

From: Mohith BP
Date: Mon, Mar 18 2019 11:09PM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

Hi,

I agree with Patrick. This is a very low priority issue and I dont
think one need to flag it as an violation as there are many ways such
as inserting <br> tags to provide line breaks between the content.
Please note not marking up headings, tables and list items impacts the
screen reader users heavily hence these should be flagged as
violations.

Thanks & Regards,
Mohith B. P.

On 3/18/19, Tim Harshbarger < = EMAIL ADDRESS REMOVED = > wrote:
> My personal opinion is that it is not a requirement for text to be contained
> in at least a paragraph element. My thinking is that a paragraph element
> conveys that its contents are all part of a paragraph--and that might not be
> the information or relationship that the content author wants to convey.
>
> This is definitely a good question since it shows you are trying not to make
> assumptions--and it is always good to think about our assumptions.
>
> Thanks for asking this question.
>
> Tim
> Tim Harshbarger
> Senior Accessibility Consultant
> Deque Systems
>
> -----Original Message-----
> From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Peter
> Shikli
> Sent: Saturday, March 16, 2019 5:06 PM
> To: WebAIM Forum < = EMAIL ADDRESS REMOVED = >
> Subject: [WebAIM] Accessible P Tag Usage
>
> Access2online audits webpages and electronic documents for compliance with
> WCAG and Section 508. As our understanding of WCAG has deepened and evolved,
> several times we have been confronted with the situation where one section
> of the guideline implies or directly contradicts another section or another
> resource such as WAVE, AXE, or Deque training materials. We often seem to be
> too strict interpreting the guidelines related to 1.3.1. Much of guideline
> would certainly improve usability, but we are aware of the difference
> between accessibility and usability.
> We would like input from the accessibility community about what to do when
> such a situation arises as in the following examples.
>
> The 1.3.1 Info and Relationships states "Information, structure, and
> relationships conveyed through presentation can be programmatically
> determined or are available in text." Further in the "Understanding SC
> 1.3.1" it says "When such relationships are perceivable to one set of users,
> those relationships can be made to be perceivable to all."
> Looking at specific failure conditions, F43 tells us that structural markup
> cannot be used in a way that does not represent relationship in the content.
> Then G115 says:
>
> "... Using the appropriate semantic elements will make sure the
> structure is available to the user agent. This involves explicitly
> indicating the role that different units have in understanding the meaning
> of the content. The nature of a piece of content as a paragraph, header,
> emphasized text, table, etc. can all be indicated in this way. ..."
>
> The strictest interpretation of these items is that it is required that
> relationships in content are programmatically available, including content
> "... such as a paragraph ...". Is this to be taken as saying text should, at
> a minimum, programmatically be a <p> tag, unless there is a more appropriate
> structural tag?
>
> We are aware that the sufficient techniques do not constitute required ways
> of doing things, so we are hesitant to violate a customer based on the
> suggested ways of meeting the criteria. However, when a failure condition
> says content must be semantically appropriate, then a sufficient technique
> lists paragraphs as appropriate semantics for text content, this implies
> that if text content is not in a <p> or a more appropriate tag (like
> headings, lists, etc.) it is not making the relationship/information about
> the text "available to all users."
>
> On the flip side, what about including an empty <p> tag with no text
> content, or only an image?
>
> Our concern arises from the fact that AXE and WAVE do not violate text
> content which is not included in a <p> or other semantically appropriate
> tag and the Deque curriculum says very little about semantics that is not
> addressing tables, headings and the like.
> Deque/AXE suggests that having free-floating text included in an HTML5/ARIA
> landmark is a minimal "best practice". What is the community opinion on
> quandaries like this?
>
> Peter Shikli
> on behalf of inmate Juliette McShane
> www.Access2online.com
>
> > > http://webaim.org/discussion/archives
> >
> > > > >

From: Duff Johnson
Date: Tue, Mar 19 2019 10:03AM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

Just a few observations… I wish I had more time for this fascinating question today...

> I agree with Patrick. This is a very low priority issue and I dont
> think one need to flag it as an violation as there are many ways such
> as inserting <br> tags to provide line breaks between the content.

Let’s not confuse paragraphs with line-breaks! These are very different semantics.

> Please note not marking up headings, tables and list items impacts the
> screen reader users heavily hence these should be flagged as
> violations.

Let’s also not just think in terms of screen readers! Users with ATs that highlight or zoom could well be impacted.

>> My personal opinion is that it is not a requirement for text to be contained
>> in at least a paragraph element. My thinking is that a paragraph element
>> conveys that its contents are all part of a paragraph--and that might not be
>> the information or relationship that the content author wants to convey.

I have to disagree - there’s a clear obligation to provide semantics for each element of content.

It’s not OK to leave some text flopping about in a <div> just because it’s likely that some ATs will stumble over it correctly and in-context!

>> Then G115 says:
>>
>> "... Using the appropriate semantic elements will make sure the
>> structure is available to the user agent. This involves explicitly
>> indicating the role that different units have in understanding the meaning
>> of the content. The nature of a piece of content as a paragraph, header,
>> emphasized text, table, etc. can all be indicated in this way. ..."
>>
>> The strictest interpretation of these items is that it is required that
>> relationships in content are programmatically available, including content
>> "... such as a paragraph ...". Is this to be taken as saying text should, at
>> a minimum, programmatically be a <p> tag, unless there is a more appropriate
>> structural tag?

IMO, this is a correct interpretation.

>> We are aware that the sufficient techniques do not constitute required ways
>> of doing things, so we are hesitant to violate a customer based on the
>> suggested ways of meeting the criteria. However, when a failure condition
>> says content must be semantically appropriate, then a sufficient technique
>> lists paragraphs as appropriate semantics for text content, this implies
>> that if text content is not in a <p> or a more appropriate tag (like
>> headings, lists, etc.) it is not making the relationship/information about
>> the text "available to all users.”

Completely correct.

>> On the flip side, what about including an empty <p> tag with no text
>> content, or only an image?

This is also invalid, although with an admittedly relatively low impact, since software can easily include heuristics to deal with empty elements.

>> Our concern arises from the fact that AXE and WAVE do not violate text
>> content which is not included in a <p> or other semantically appropriate
>> tag

Interesting - IMO, this should be addressed as a bug.

Leaving text lying about in random <divs>… how is that not a straight-up violation of 1.3.1?

Duff.

From: Jonathan Avila
Date: Tue, Mar 19 2019 10:07AM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

> Leaving text lying about in random <divs>… how is that not a straight-up violation of 1.3.1?

Duff, what information and relationship is missing that is not already programmatically available in text? I don't see it as a failure as someone using assistive technology has the same information available as someone with out assistive technology. A paragraph is a

Paragraph: a distinct section of a piece of writing, usually dealing with a single theme and indicated by a new line, indentation, or numbering.

Jonathan




-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Duff Johnson
Sent: Tuesday, March 19, 2019 12:03 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Accessible P Tag Usage

CAUTION: This email originated from outside of the organization. Do not click links or open attachments unless you recognize the sender and know the content is safe.


Just a few observations… I wish I had more time for this fascinating question today...

> I agree with Patrick. This is a very low priority issue and I dont
> think one need to flag it as an violation as there are many ways such
> as inserting <br> tags to provide line breaks between the content.

Let’s not confuse paragraphs with line-breaks! These are very different semantics.

> Please note not marking up headings, tables and list items impacts the
> screen reader users heavily hence these should be flagged as
> violations.

Let’s also not just think in terms of screen readers! Users with ATs that highlight or zoom could well be impacted.

>> My personal opinion is that it is not a requirement for text to be contained
>> in at least a paragraph element. My thinking is that a paragraph element
>> conveys that its contents are all part of a paragraph--and that might not be
>> the information or relationship that the content author wants to convey.

I have to disagree - there’s a clear obligation to provide semantics for each element of content.

It’s not OK to leave some text flopping about in a <div> just because it’s likely that some ATs will stumble over it correctly and in-context!

>> Then G115 says:
>>
>> "... Using the appropriate semantic elements will make sure the
>> structure is available to the user agent. This involves explicitly
>> indicating the role that different units have in understanding the meaning
>> of the content. The nature of a piece of content as a paragraph, header,
>> emphasized text, table, etc. can all be indicated in this way. ..."
>>
>> The strictest interpretation of these items is that it is required that
>> relationships in content are programmatically available, including content
>> "... such as a paragraph ...". Is this to be taken as saying text should, at
>> a minimum, programmatically be a <p> tag, unless there is a more appropriate
>> structural tag?

IMO, this is a correct interpretation.

>> We are aware that the sufficient techniques do not constitute required ways
>> of doing things, so we are hesitant to violate a customer based on the
>> suggested ways of meeting the criteria. However, when a failure condition
>> says content must be semantically appropriate, then a sufficient technique
>> lists paragraphs as appropriate semantics for text content, this implies
>> that if text content is not in a <p> or a more appropriate tag (like
>> headings, lists, etc.) it is not making the relationship/information about
>> the text "available to all users.”

Completely correct.

>> On the flip side, what about including an empty <p> tag with no text
>> content, or only an image?

This is also invalid, although with an admittedly relatively low impact, since software can easily include heuristics to deal with empty elements.

>> Our concern arises from the fact that AXE and WAVE do not violate text
>> content which is not included in a <p> or other semantically appropriate
>> tag

Interesting - IMO, this should be addressed as a bug.

Leaving text lying about in random <divs>… how is that not a straight-up violation of 1.3.1?

Duff.

From: Duff Johnson
Date: Tue, Mar 19 2019 10:24AM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

>
>> Leaving text lying about in random <divs>… how is that not a straight-up violation of 1.3.1?
>
> Duff, what information and relationship is missing that is not already programmatically available in text? I don't see it as a failure as someone using assistive technology has the same information available as someone with out assistive technology. A paragraph is a
>
> Paragraph: a distinct section of a piece of writing, usually dealing with a single theme and indicated by a new line, indentation, or numbering.

If we are speaking of a document with no semantics at all… just a stream of text… then I guess you could just use <div> and call it “equal access”.

But if the document does include semantics, then what?

From: chagnon@pubcom.com
Date: Tue, Mar 19 2019 3:00PM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

The discussion was getting a bit difficult to read so I went back into the WebAIM archives to retrieve the original post: https://webaim.org/discussion/mail_message?id9669

Three key points: 1. The standards are written by people;
2. Over time, the standards evolve and are more eloquently described, defined, and adjusted; and
3. They are interpreted in different ways by testers, checkers, and organizations.

Point 1.
Standards are written by different groups of industry experts from around the world. The primary standards group is the one for HTML / CSS because it's at the root of our current technologies. The WCAG, EPUB, and other standards are subsets that address their particular technology and (hopefully) mesh with the core HTML / CSS standards.

Reading the current definition of the <DIV> tag in HTML 5.1 2nd edition (which I think is the latest from the W3C) at https://www.w3.org/TR/2017/REC-html51-20171003/grouping-content.html#elementdef-div, it states:

<quote> The div element has no special meaning at all. It represents its children. </quote>

Although the HTML definition doesn't explicitly state it, <DIV> for all intents and purposes is a wrapper or container tag that holds other tags. By itself, it has no semantic meaning.

WCAG, PDF/UA, and other accessibility standards provide more details by stating (in their various ways) that "all content must be tagged with a semantically appropriate tag" in order to be accessible to all technologies. So Duff Johnson's comment earlier today is correct; we can't have loose "text flopping about in a <div>". It has to be in a tag inside the <DIV>, a semantically-appropriate tag such as <P>, <Hx>, etc.

All the stakeholders in accessibility -- users, assistive technologies, content creators, software -- must follow the same standards. All of our A T manufacturers are advised to recognize the tags; so when "text is flopping about in a <div>," there's a good chance that one or more of the technologies will not recognize it which can have the same effect as artifacting that content, hiding it from our end users.

<aside> I love Duff's description of text flopping about in a <DIV> </aside>

I don't know of any mark-up language that would allow such a construct; maybe in some half-baked weird XML taxonomy it would be allowed, but not in accessibility.

Point 3:
Not all checkers (human and software) interpret the standards the same way. In theory, they should, but these are voluntary standards, not laws, regulations, or mandates and they are subject to different interpretations and implementations. I think "text flopping about in a <DIV>" should be flagged as a violation in any of our checkers.

We always recommend that our clients use 3 different checkers: one well-trained human plus 2 automated software checkers. That combo should be able to flag items like this. If you find one of your checkers misses this, then submit a bug/feature request to the manufacturer.

<< On the flip side, what about including an empty <p> tag with no text
content, or only an image? >>

I sure hope the empty <P> tags become woven into all of our standards! Although many of our A T tools can be designed to overlook the problem, that kind of gunk really clogs the system when you're trying to migrate content through various technologies -- assistive technologies, cross-media publishing technologies, CMS content management systems, et al.

No double returns between paragraphs.
And while we're at it, no multiple spaces, either.

I'm OK with <IMG>, <FIGURE>, <TABLE> and other elements in a <P>. Sometimes that's the only way we have to insert those items into our content and that technique doesn't produce a hard-stop barrier to those who use A T.

—Bevi

— — —
Bevi Chagnon, founder/CEO | = EMAIL ADDRESS REMOVED =
— — —
PubCom: Technologists for Accessible Design + Publishing
consulting • training • development • design • sec. 508 services
Upcoming classes at www.PubCom.com/classes
— — —
Latest blog-newsletter – Accessibility Tips at www.PubCom.com/blog

-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Duff Johnson
Sent: Tuesday, March 19, 2019 12:03 PM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Accessible P Tag Usage

Just a few observations… I wish I had more time for this fascinating question today...

> I agree with Patrick. This is a very low priority issue and I dont
> think one need to flag it as an violation as there are many ways such
> as inserting <br> tags to provide line breaks between the content.

Let’s not confuse paragraphs with line-breaks! These are very different semantics.

> Please note not marking up headings, tables and list items impacts the
> screen reader users heavily hence these should be flagged as
> violations.

Let’s also not just think in terms of screen readers! Users with ATs that highlight or zoom could well be impacted.

>> My personal opinion is that it is not a requirement for text to be
>> contained in at least a paragraph element. My thinking is that a
>> paragraph element conveys that its contents are all part of a
>> paragraph--and that might not be the information or relationship that the content author wants to convey.

I have to disagree - there’s a clear obligation to provide semantics for each element of content.

It’s not OK to leave some text flopping about in a <div> just because it’s likely that some ATs will stumble over it correctly and in-context!

>> Then G115 says:
>>
>> "... Using the appropriate semantic elements will make sure the
>> structure is available to the user agent. This involves explicitly
>> indicating the role that different units have in understanding the
>> meaning of the content. The nature of a piece of content as a
>> paragraph, header, emphasized text, table, etc. can all be indicated in this way. ..."
>>
>> The strictest interpretation of these items is that it is required
>> that relationships in content are programmatically available,
>> including content "... such as a paragraph ...". Is this to be taken
>> as saying text should, at a minimum, programmatically be a <p> tag,
>> unless there is a more appropriate structural tag?

IMO, this is a correct interpretation.

>> We are aware that the sufficient techniques do not constitute
>> required ways of doing things, so we are hesitant to violate a
>> customer based on the suggested ways of meeting the criteria.
>> However, when a failure condition says content must be semantically
>> appropriate, then a sufficient technique lists paragraphs as
>> appropriate semantics for text content, this implies that if text
>> content is not in a <p> or a more appropriate tag (like headings,
>> lists, etc.) it is not making the relationship/information about the text "available to all users.”

Completely correct.

>> On the flip side, what about including an empty <p> tag with no text
>> content, or only an image?

This is also invalid, although with an admittedly relatively low impact, since software can easily include heuristics to deal with empty elements.

>> Our concern arises from the fact that AXE and WAVE do not violate
>> text content which is not included in a <p> or other semantically
>> appropriate tag

Interesting - IMO, this should be addressed as a bug.

Leaving text lying about in random <divs>… how is that not a straight-up violation of 1.3.1?

Duff.

From: Patrick H. Lauke
Date: Tue, Mar 19 2019 3:16PM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

On 19/03/2019 21:00, = EMAIL ADDRESS REMOVED = wrote:
[...]
> Reading the current definition of the <DIV> tag in HTML 5.1 2nd edition (which I think is the latest from the W3C) at https://www.w3.org/TR/2017/REC-html51-20171003/grouping-content.html#elementdef-div, it states:
>
> <quote> The div element has no special meaning at all. It represents its children. </quote>
>
> Although the HTML definition doesn't explicitly state it, <DIV> for all intents and purposes is a wrapper or container tag that holds other tags. By itself, it has no semantic meaning.
>
> WCAG, PDF/UA, and other accessibility standards provide more details by stating (in their various ways) that "all content must be tagged with a semantically appropriate tag" in order to be accessible to all technologies. So Duff Johnson's comment earlier today is correct; we can't have loose "text flopping about in a <div>". It has to be in a tag inside the <DIV>, a semantically-appropriate tag such as <P>, <Hx>, etc.

When the markup is serialised though, "floppy" runs of text inside a
<div> are turned into text nodes in the DOM. Consistently so, in all
user agents. And this has been the case for decades when it comes to HTML.

Note that the definition for <div>
https://www.w3.org/TR/html52/grouping-content.html#elementdef-div says
its content model (unless inside a <dl>) is "Flow content". And flow
content https://www.w3.org/TR/html52/dom.html#flow-content contains,
apart from elements such as <a>, <p>, etc., also pure "text".

> All the stakeholders in accessibility -- users, assistive technologies, content creators, software -- must follow the same standards. All of our A T manufacturers are advised to recognize the tags; so when "text is flopping about in a <div>," there's a good chance that one or more of the technologies will not recognize it which can have the same effect as artifacting that content, hiding it from our end users.

Not if they follow the standard HTML serialisation that's been in place
in user agents for aeons. And follow the actual standard, its rules for
serializing markup into a DOM tree, etc.

Other markup languages/structures like PDF/UA may be different/stricter
here. But for HTML, pure text nodes inside <div>s are allowed and
there's a spec-conformant way in which user agents process them and turn
them into a consistent DOM representation.
[...]

> I'm OK with <IMG>, <FIGURE>, <TABLE> and other elements in a <P>. Sometimes that's the only way we have to insert those items into our content and that technique doesn't produce a hard-stop barrier to those who use A T.

I'm not aware of any hard-stop barriers that are the result of "floppy"
text inside a <div> without a <p> or similar around it. Are there any?

P
--
Patrick H. Lauke

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

From: Jonathan Avila
Date: Tue, Mar 19 2019 5:47PM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

> [Bevi wrote] all content must be tagged with a semantically appropriate tag"

Regarding WCAG -- could you point to a success criteria that states that? SC 1.3.1 Information and relationship says
"Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text. "

The key is "are programmatically determined or are available as text". In theory I could communicate that something was a heading through text and still meet the requirement. Similarly, I could communicate sections of page via heading elements and not landmarks or communicate the selected state of something via text "selected" before the days of ARIA this was common.

Programmatically determined is defined as "determined by software from author-supplied data provided in a way that different user agents, including assistive technologies, can extract and present this information to users in different modalities"

Information about sentences and paragraphs in many languages can be determined by punctuation, sentences that are not separated by a blank line, etc. These elements are programmatically determinable by today's and yesterday's assistive technology.

Requiring all paragraphs to be in a p element and forbidding empty p elements would add no value to users assistive technology and divert efforts away from fixing items that are true barriers and delay accessible to people with disabilities.

Jonathan Avila, CPWA

-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of = EMAIL ADDRESS REMOVED =
Sent: Tuesday, March 19, 2019 5:00 PM
To: 'WebAIM Discussion List' < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Accessible P Tag Usage

CAUTION: This email originated from outside of the organization. Do not click links or open attachments unless you recognize the sender and know the content is safe.


The discussion was getting a bit difficult to read so I went back into the WebAIM archives to retrieve the original post: https://webaim.org/discussion/mail_message?id9669

Three key points: 1. The standards are written by people; 2. Over time, the standards evolve and are more eloquently described, defined, and adjusted; and 3. They are interpreted in different ways by testers, checkers, and organizations.

Point 1.
Standards are written by different groups of industry experts from around the world. The primary standards group is the one for HTML / CSS because it's at the root of our current technologies. The WCAG, EPUB, and other standards are subsets that address their particular technology and (hopefully) mesh with the core HTML / CSS standards.

Reading the current definition of the <DIV> tag in HTML 5.1 2nd edition (which I think is the latest from the W3C) at https://www.w3.org/TR/2017/REC-html51-20171003/grouping-content.html#elementdef-div, it states:

<quote> The div element has no special meaning at all. It represents its children. </quote>

Although the HTML definition doesn't explicitly state it, <DIV> for all intents and purposes is a wrapper or container tag that holds other tags. By itself, it has no semantic meaning.

WCAG, PDF/UA, and other accessibility standards provide more details by stating (in their various ways) that "all content must be tagged with a semantically appropriate tag" in order to be accessible to all technologies. So Duff Johnson's comment earlier today is correct; we can't have loose "text flopping about in a <div>". It has to be in a tag inside the <DIV>, a semantically-appropriate tag such as <P>, <Hx>, etc.

All the stakeholders in accessibility -- users, assistive technologies, content creators, software -- must follow the same standards. All of our A T manufacturers are advised to recognize the tags; so when "text is flopping about in a <div>," there's a good chance that one or more of the technologies will not recognize it which can have the same effect as artifacting that content, hiding it from our end users.

<aside> I love Duff's description of text flopping about in a <DIV> </aside>

I don't know of any mark-up language that would allow such a construct; maybe in some half-baked weird XML taxonomy it would be allowed, but not in accessibility.

Point 3:
Not all checkers (human and software) interpret the standards the same way. In theory, they should, but these are voluntary standards, not laws, regulations, or mandates and they are subject to different interpretations and implementations. I think "text flopping about in a <DIV>" should be flagged as a violation in any of our checkers.

We always recommend that our clients use 3 different checkers: one well-trained human plus 2 automated software checkers. That combo should be able to flag items like this. If you find one of your checkers misses this, then submit a bug/feature request to the manufacturer.

<< On the flip side, what about including an empty <p> tag with no text content, or only an image? >>

I sure hope the empty <P> tags become woven into all of our standards! Although many of our A T tools can be designed to overlook the problem, that kind of gunk really clogs the system when you're trying to migrate content through various technologies -- assistive technologies, cross-media publishing technologies, CMS content management systems, et al.

No double returns between paragraphs.
And while we're at it, no multiple spaces, either.

I'm OK with <IMG>, <FIGURE>, <TABLE> and other elements in a <P>. Sometimes that's the only way we have to insert those items into our content and that technique doesn't produce a hard-stop barrier to those who use A T.

—Bevi

— — —
Bevi Chagnon, founder/CEO | = EMAIL ADDRESS REMOVED = — — —
PubCom: Technologists for Accessible Design + Publishing consulting • training • development • design • sec. 508 services Upcoming classes at www.PubCom.com/classes — — — Latest blog-newsletter – Accessibility Tips at www.PubCom.com/blog

-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Duff Johnson
Sent: Tuesday, March 19, 2019 12:03 PM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Accessible P Tag Usage

Just a few observations… I wish I had more time for this fascinating question today...

> I agree with Patrick. This is a very low priority issue and I dont
> think one need to flag it as an violation as there are many ways such
> as inserting <br> tags to provide line breaks between the content.

Let’s not confuse paragraphs with line-breaks! These are very different semantics.

> Please note not marking up headings, tables and list items impacts the
> screen reader users heavily hence these should be flagged as
> violations.

Let’s also not just think in terms of screen readers! Users with ATs that highlight or zoom could well be impacted.

>> My personal opinion is that it is not a requirement for text to be
>> contained in at least a paragraph element. My thinking is that a
>> paragraph element conveys that its contents are all part of a
>> paragraph--and that might not be the information or relationship that the content author wants to convey.

I have to disagree - there’s a clear obligation to provide semantics for each element of content.

It’s not OK to leave some text flopping about in a <div> just because it’s likely that some ATs will stumble over it correctly and in-context!

>> Then G115 says:
>>
>> "... Using the appropriate semantic elements will make sure the
>> structure is available to the user agent. This involves explicitly
>> indicating the role that different units have in understanding the
>> meaning of the content. The nature of a piece of content as a
>> paragraph, header, emphasized text, table, etc. can all be indicated in this way. ..."
>>
>> The strictest interpretation of these items is that it is required
>> that relationships in content are programmatically available,
>> including content "... such as a paragraph ...". Is this to be taken
>> as saying text should, at a minimum, programmatically be a <p> tag,
>> unless there is a more appropriate structural tag?

IMO, this is a correct interpretation.

>> We are aware that the sufficient techniques do not constitute
>> required ways of doing things, so we are hesitant to violate a
>> customer based on the suggested ways of meeting the criteria.
>> However, when a failure condition says content must be semantically
>> appropriate, then a sufficient technique lists paragraphs as
>> appropriate semantics for text content, this implies that if text
>> content is not in a <p> or a more appropriate tag (like headings,
>> lists, etc.) it is not making the relationship/information about the text "available to all users.”

Completely correct.

>> On the flip side, what about including an empty <p> tag with no text
>> content, or only an image?

This is also invalid, although with an admittedly relatively low impact, since software can easily include heuristics to deal with empty elements.

>> Our concern arises from the fact that AXE and WAVE do not violate
>> text content which is not included in a <p> or other semantically
>> appropriate tag

Interesting - IMO, this should be addressed as a bug.

Leaving text lying about in random <divs>… how is that not a straight-up violation of 1.3.1?

Duff.

From: Patrick H. Lauke
Date: Tue, Mar 19 2019 6:18PM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

On 19/03/2019 23:47, Jonathan Avila wrote:
[...]
> The key is "are programmatically determined or are available as text". In theory I could communicate that something was a heading through text and still meet the requirement. Similarly, I could communicate sections of page via heading elements and not landmarks or communicate the selected state of something via text "selected" before the days of ARIA this was common.
>
> Programmatically determined is defined as "determined by software from author-supplied data provided in a way that different user agents, including assistive technologies, can extract and present this information to users in different modalities"

Just on the topic of headings though, "programmatically determined"
means, in essence, in a machine-readable unambiguous way. How would you
communicate that something's a heading this way? If you mean just adding
something like "Heading: ..." in the text, then you're really relying on
heuristics in software to pick up on any variation (in any human
language) and make a guess that you meant that to signify that it's a
heading. So...probably not a good example of providing programmatically
determined info.

However, for "paragraphs" the concept is a lot more handwavy
(particularly, as noted elsewhere in the thread, even an image can be
wrapped in a <p> and is deemed ok). Taking the concept of paragraph to
mean, very generally, a chunk of content that "goes together", then
surely any wrapper element (a <p>, a <div>, an <aside>, etc) would be
appropriate, though.

[...]

> Requiring all paragraphs to be in a p element and forbidding empty p elements would add no value to users assistive technology and divert efforts away from fixing items that are true barriers and delay accessible to people with disabilities.
Agreed. It's a waste of effort and resources - even the lengthy
discussion around this, though necessary, feels like a lot of effort
when at the same time there's so many more important and fundamental
aspects that cause real barriers.

P
--
Patrick H. Lauke

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

From: Mallory
Date: Wed, Mar 20 2019 6:14AM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

When I audit, I may make a note or warning (not a violation) if divs are used instead of paragraphs for what looks like paragraphs.
Two reasons:
1. some AT can use <p> tags for navigation (again, this is a Low-prio thing)
2. The new Text Spacing for some reason decided to specify paragraphs. Why it didn't say "blocks of text" like 1.4.8 talks about, I dunno.
As a user, making a difference between "blocks of text" vs "Spacing following paragraphs to at least 2 times the font size" seems silly: either you care about what I see as a bunch of text or not.
As an auditor, I feel free to be as draconian as I want, since we don't waste too much time on "compliance-only" customers. We put the effort into the ones who want their stuff to work best. We tell the latter group that it's best to use paragraph tags for paragraphs. The former group doesn't care either way and would build everything out of aria-foo'd div soup if they could get away with it, which legally they usually can. Don't waste hair loss on those.

cheers,
_mallory

From: Patrick H. Lauke
Date: Wed, Mar 20 2019 9:48AM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

On 20/03/2019 12:14, Mallory wrote:
> When I audit, I may make a note or warning (not a violation) if divs are used instead of paragraphs for what looks like paragraphs.
> Two reasons:
> 1. some AT can use <p> tags for navigation (again, this is a Low-prio thing)
> 2. The new Text Spacing for some reason decided to specify paragraphs. Why it didn't say "blocks of text" like 1.4.8 talks about, I dunno.
> As a user, making a difference between "blocks of text" vs "Spacing following paragraphs to at least 2 times the font size" seems silly: either you care about what I see as a bunch of text or not.

Note that WCAG's language is not HTML specific, but tech-agnostic. So
when it talks about "paragraphs", it doesn't necessarily mean "<p>"
elements (the same way that when it talks about "labels" for form
controls, it doesn't necessarily mean "<label>" elements, but any text
that acts as a (visual) label for a control).

> As an auditor, I feel free to be as draconian as I want, since we don't waste too much time on "compliance-only" customers. We put the effort into the ones who want their stuff to work best. We tell the latter group that it's best to use paragraph tags for paragraphs.

But how do you define "best"? Tangible advantages? Ability in some AT to
jump to next paragraph that may not be available if marked as <div>?

P
--
Patrick H. Lauke

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

From: Jonathan Avila
Date: Thu, Mar 21 2019 6:10PM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

> But how do you define "best"? Tangible advantages? Ability in some AT to jump to next paragraph that may not be available if marked as <div>?

Both NVDA and JAWS move to next and prior divs with the same command as paragraphs control+down and control+up arrows -- there appears to be no difference. I'm not sure that a JAWS or NVDA user would have any idea if a div or paragraph was used on a webpage without looking at code.

Jonathan

Jonathan Avila, CPWA

-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Patrick H. Lauke
Sent: Wednesday, March 20, 2019 11:48 AM
To: Mallory < = EMAIL ADDRESS REMOVED = >; = EMAIL ADDRESS REMOVED =
Subject: Re: [WebAIM] Accessible P Tag Usage

CAUTION: This email originated from outside of the organization. Do not click links or open attachments unless you recognize the sender and know the content is safe.


On 20/03/2019 12:14, Mallory wrote:
> When I audit, I may make a note or warning (not a violation) if divs are used instead of paragraphs for what looks like paragraphs.
> Two reasons:
> 1. some AT can use <p> tags for navigation (again, this is a Low-prio
> thing) 2. The new Text Spacing for some reason decided to specify paragraphs. Why it didn't say "blocks of text" like 1.4.8 talks about, I dunno.
> As a user, making a difference between "blocks of text" vs "Spacing following paragraphs to at least 2 times the font size" seems silly: either you care about what I see as a bunch of text or not.

Note that WCAG's language is not HTML specific, but tech-agnostic. So when it talks about "paragraphs", it doesn't necessarily mean "<p>"
elements (the same way that when it talks about "labels" for form controls, it doesn't necessarily mean "<label>" elements, but any text that acts as a (visual) label for a control).

> As an auditor, I feel free to be as draconian as I want, since we don't waste too much time on "compliance-only" customers. We put the effort into the ones who want their stuff to work best. We tell the latter group that it's best to use paragraph tags for paragraphs.

But how do you define "best"? Tangible advantages? Ability in some AT to jump to next paragraph that may not be available if marked as <div>?

P
--
Patrick H. Lauke

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

From: Duff Johnson
Date: Tue, Apr 02 2019 7:37PM
Subject: Re: Accessible P Tag Usage
← Previous message | Next message →

Sorry to pause this so long - I was away on vacation.

I continue to be confused by what I’ve read on this point, so I hope you will bear with me,

> On Mar 21, 2019, at 20:10, Jonathan Avila < = EMAIL ADDRESS REMOVED = > wrote:
>
>> But how do you define "best"? Tangible advantages? Ability in some AT to jump to next paragraph that may not be available if marked as <div>?
>
> Both NVDA and JAWS move to next and prior divs with the same command as paragraphs control+down and control+up arrows -- there appears to be no difference. I'm not sure that a JAWS or NVDA user would have any idea if a div or paragraph was used on a webpage without looking at code.


So that tells you that <div> is (functionally) mapped to <p>. Will that be correct in all cases? It seems like the claim here is “yes”. Maybe, if that were all, I could see it...

But <div> (or <span>) could be used in all sorts of ways that conflict with correct representation of the semantics.

Here’s a snippet of HTML in which we have a “floppy" <div>:

<p>…and the bank account number is 123 456 789"<p>
<div>223</div>

What’s the relationship between the <p> and the <div>? We don’t know.

If it were unambiguously tagged for semantics, it would either be:

<p>…and the bank account number is 123 456 789"<p>
<p>223</p>

or...

<p>…and the bank account number is 123 456 789 223<p>

These would have very different meanings, and serialization doesn’t solve the problem.

<div> doesn’t “mean" anything at all. Seems to me that the “floppy” use of <div> makes for an inability to guarantee full recovery of semantics. Reliance on serialization to order the content correctly isn’t the same as ensuring disambiguation has occurred.

How can you assume the semantics of content that’s only wrapped in <div>? As a fallback, mere serialization seems of course necessary but also insufficient, no?

Duff.

From: Patrick H. Lauke
Date: Fri, Apr 05 2019 5:27AM
Subject: Re: Accessible P Tag Usage
← Previous message | No next message

On 03/04/2019 02:37, Duff Johnson wrote:
[...]
> Here’s a snippet of HTML in which we have a “floppy" <div>:
>
> <p>…and the bank account number is 123 456 789"<p>
> <div>223</div>
>
> What’s the relationship between the <p> and the <div>? We don’t know.
>
> If it were unambiguously tagged for semantics, it would either be:
>
> <p>…and the bank account number is 123 456 789"<p>
> <p>223</p>
>
> or...
>
> <p>…and the bank account number is 123 456 789 223<p>
>
> These would have very different meanings, and serialization doesn’t solve the problem.

It can't be the second one, as the first paragraph is closed already
(i'm assuming your code sample meant to have </p> and not <p> at the end
of that line.

Anyway, I'd still say: for heaven's sake, there's so much more important
stuff that does really cause an actual problem to users. Can we stop
wasting time on splitting hairs about this?

P
--
Patrick H. Lauke

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