RE: [External Sender] <ol start="3"> Is this accessible? [SEC=UNOFFICIAL]

Hi Jeana

Since you’re working on a site redesign, I’d rethink this approach.  For example, throw out the ordered list with nested paragraphs and interrupting ads, and instead, create a list with links to headings.  This will give you an unbroken list, and the user will be able to see what’s coming up and jump to the point they’re interested in, AND the page will have a stronger structure.

For example:

<p>Here are 5 treatments for your lower back pain:</a>
<ol>
<li><a href=”#first”>1st Long surgery Description<a/></li>
<li><a href=”#second”>2nd Long surgery description<a/></li>
<li><a href=”#third”>3rd Long surgery description<a/></li>
<li><a href=”#fourth”>4th Long surgery description<a/></li>
</ol>

<h2><a id=”first”><a/>1st Long surgery Description</h2>
<p>Text text text</p>
<p>Text text text</p>
<div><ad></div>

<h2><a id=”second”><a/>2nd Long surgery Description</h2>
<p>Text text text</p>
<p>Text text text</p>
<div><ad></div>


Hope this helps …

Regards
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Paul E. Matthews
User Interface Designer


From: Jeana Clark [mailto:jclark@veritashealth.com]
Sent: Wednesday, 20 November 2019 7:05 AM
To: Brian Lovely
Cc: W3C WAI ig
Subject: Re: [External Sender] <ol start="3"> Is this accessible?

**EXTERNAL EMAIL – Think quick before you click**


Admittingly - there is inconsistent use of ordered and un-ordered lists, but this will be cleaned up in our redesign.

A list might describe the ordered steps of a surgery that could be sequential.

A list might also just be a list, where order is not important and it could just be bullets <ul>.

I’m working on writing standards and styles for this, but it’s looking more and more like I have to change editorial style guides as well — not just design/code.

It’s also sounding like start=“3” is generally acceptable and an ok use within WCAG standards. But I’m likely dealing with other html structure issues here. Also - there doesn’t seem to be a written standard that says it’s bad to interrupt a grouping of like content with unrelated content.

The more written standards I can point to, the more buy-in I have.  “Bad User Experience” or “Just bad Design” doesn’t receive much buy-in :( Hence, why I was hoping there was something in the Accessibility standards that I could lean on here.

Thanks,
Jeana




On Nov 19, 2019, at 1:21 PM, Brian Lovely <brian.lovely@capitalone.com<mailto:brian.lovely@capitalone.com>> wrote:

Is there a necessary sequential logic to the list items that is necessary to understanding the list as a whole? For instance a series of steps:

<ol>
     <li>Turn doorknob</li>
     <li>Open door</li>
     <li>Step through</li>
</ol>

On Tue, Nov 19, 2019 at 1:48 PM Jeana Clark <jclark@veritashealth.com<mailto:jclark@veritashealth.com>> wrote:
I mean something like

<ol>
<li><p>Long surgery Description</p>
      <p>More surgery description</p></li>
</ol>

<div><ad></div>

<ol start=“2”>
<li><p>2nd Long surgery description
      <p>More 2nd long surgery description</p></li>
<li><p>3rd Long surgery description
      <p>More 34d long surgery description</p></li>
<li><p>4th Long surgery description
      <p>More 4th long surgery description</p></li>
</ol>





________________________________

Jeana Clark



On Nov 19, 2019, at 12:36 PM, Brian Lovely <brian.lovely@capitalone.com<mailto:brian.lovely@capitalone.com>> wrote:

Ugh, you mean like:

<ol>
     <li>Something</li>
     <div>An advertisement</div>
     <li>Something else</li>
</ol>

That's a violation of WCAG 2.1 SC 4.1.1 Parsing. The ol contains a non-supported child (the div). Before any accessibility is looked at, a page must be able to pass an HTML linter with no errors. This would throw a parent/child error.

On Tue, Nov 19, 2019 at 1:25 PM Marc Haunschild <haunschild@mhis.onmicrosoft.de<mailto:haunschild@mhis.onmicrosoft.de>> wrote:
Then its a matter of presentation (CSS) not semantics (HTML).

Respect the separation of concerns principle and things will become much easier.

Flex box offers a easy way to make space between two elements when using margin: auto for example - in this gap you can place your add - although I still might not understand all aspects of your particular component, I think I would use something like this

<ul>
  <li>{text}</li>
  <li>{text}</li>
  <li>{text}</li>
  <li>{advertisement}</li>
</ul>

With order you can rearrange the items and by putting the ad at the end you don’t interrupt the logical order

In a future redesign you won't need to touch the HTML - all changes can be made in the CSS (or SASS/LESS if you prefer to work with a preprocessor)

Marc

On 19. Nov 2019, at 18:58, Jeana Clark <jclark@veritashealth.com<mailto:jclark@veritashealth.com>> wrote:

Hi Patrick - Thanks for your comment.

The problem is we want to put an ad in the middle of a list - but not make it a list item. So sometimes if it’s a numbered list, we will close the list, insert the ad, and restart the list (hence start=“3” on the ol)




________________________________

Jeana Clark




On Nov 19, 2019, at 11:48 AM, Patrick H. Lauke <redux@splintered.co.uk<mailto:redux@splintered.co.uk>> wrote:

On 19/11/2019 17:12, Jeana Clark wrote:

Sometimes the lists were used as a design solution… writers wanted to make the content more ’scannable’, and they really aren’t list items. They’re just bulleted, indented paragraphs — those I can deal with with redesign.
But sometimes they are ‘lists’ as like, here are 5 treatments for your lower back pain.. but each ‘list item’ is a thorough multi-paragraphed description of the treatment, within a list item.

Even in those cases, you should be able to just stick them all in an <li>...</li> without the need for breaking up a list and starting it at a particular number later, unless I'm missing something.

P
--
Patrick H. Lauke

www.splintered.co.uk<https://urldefense.com/v3/__http:/www.splintered.co.uk/__;!0Ns9_1dOjwg!LbjzArpgSoEASxfWUXXXLwkCCFWvrg2bfhy6xx3Bwckv9YpzbWfQuBfgSsBEedUrTQwiLQ$> | https://github.com/patrickhlauke<https://urldefense.com/v3/__https:/github.com/patrickhlauke__;!0Ns9_1dOjwg!LbjzArpgSoEASxfWUXXXLwkCCFWvrg2bfhy6xx3Bwckv9YpzbWfQuBfgSsBEedVvmm5Vyg$>
http://flickr.com/photos/redux/<https://urldefense.com/v3/__http:/flickr.com/photos/redux/__;!0Ns9_1dOjwg!LbjzArpgSoEASxfWUXXXLwkCCFWvrg2bfhy6xx3Bwckv9YpzbWfQuBfgSsBEedWx4pJZHw$> | http://redux.deviantart.com<https://urldefense.com/v3/__http:/redux.deviantart.com/__;!0Ns9_1dOjwg!LbjzArpgSoEASxfWUXXXLwkCCFWvrg2bfhy6xx3Bwckv9YpzbWfQuBfgSsBEedW-YlDhJA$>
twitter: @patrick_h_lauke | skype: patrick_h_lauke




--
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.





--
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.



**********************************************************************
IMPORTANT
The information transmitted is for the use of the intended
recipient only and may contain confidential and/or legally
privileged material. Any review, re-transmission, disclosure,
dissemination or other use of, or taking of any action in
reliance upon, this information by persons or entities other
than the intended recipient is prohibited and may result in
severe penalties. If you have received this e-mail in error
please notify the Privacy Hotline of the Australian Taxation
Office, telephone 1300 661 542 and delete all copies of this
transmission together with any attachments.
**********************************************************************