WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Span classes in H1 tags


From: Nick Beranek
Date: Sep 28, 2018 1:20PM

Hi Sudheer,

What you have shared will be just fine. The heading will help satisfy SC
1.3.1 Info and Relationships and I think it's great that you're including a
different style while maintaining the heading tag level; a proper heading
hierarchy is very important! The <span> as a child of the <h1> is valid
HTML and will not negatively impact the accessibility of the heading unless
you style it so that the heading text cannot be read.


On Fri, Sep 28, 2018 at 3:14 PM Sudheer Babu < <EMAIL REMOVED> > wrote:

> There is an ask to use H1 and H2 etc tags with few styling options.
> Example code snippet:
> <h1>
> <span class="boardit">Portfolio</span>
> </h1>
> Please let me know if this affects any of the wcag guidelines and be non
> accessibility compliant.
> Thanks in advance
> Sudheer
> > > https://urldefense.proofpoint.com/v2/url?u=http-3A__list.webaim.org_&d=DwICAg&c=pLULRYW__RtkwsQUPxJVDGboCTdgji3AcHNJU0BpTJE&r=dC_UMEUmMt99VWyKrKPEqR3CTKGfGj3o3ZNFy9eOtyTH5I1FN_SWdh0fxgPpm-RI&m=v-j8J-66GX3f4jFOpuIUhHr_j4pBxUSvDT9CMihZvTc&s=kZyj-g5mg85ZWsA0UZhIO6AmrB9Dy7QTGJK6AFQ0A9Q&e=
> List archives at
> https://urldefense.proofpoint.com/v2/url?u=http-3A__webaim.org_discussion_archives&d=DwICAg&c=pLULRYW__RtkwsQUPxJVDGboCTdgji3AcHNJU0BpTJE&r=dC_UMEUmMt99VWyKrKPEqR3CTKGfGj3o3ZNFy9eOtyTH5I1FN_SWdh0fxgPpm-RI&m=v-j8J-66GX3f4jFOpuIUhHr_j4pBxUSvDT9CMihZvTc&s=3kbYZffEgGZawxXiXeiwPqWeW7pHPo0XQWQvB_y6FKA&e=
> >

Nick Beranek
Accessibility Tech Lead
Digital Accessibility Team
Capital One

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.