E-mail List Archives
Thread: Combining headers and images: is this a "no no"?
Number of posts in this thread: 4 (In chronological order)
From: caron.darbyson@gmail.com
Date: Thu, May 07 2020 3:48PM
Subject: Combining headers and images: is this a "no no"?
No previous message | Next message →
Greetings!
This is my first posting and hoping you can help. I'm an instructional
designer for higher education online. A huge part of my work these days
concerns accessibility and I love learning how to make the experience better
for everyone. (I took Accessible Docs not long ago and learned a ton!)
My query: It is incorrect to combine a image (icon) and a header? That is,
something like <H3>Some text and an icon </H3>?
Please let me know if you need more info.
Thanks!
Caron
From: glen walker
Date: Thu, May 07 2020 4:41PM
Subject: Re: Combining headers and images: is this a "no no"?
← Previous message | Next message →
"Incorrect" could have lots of meanings. From an html parsing perspective,
it's not "incorrect" (sorry for the double negative), meaning it's legal
html.
From a WCAG perspective, there's nothing inherently "incorrect" either, if
coded correctly.
If the icon is decorative, then it should be hidden from assistive
technology using either alt="" (if an <img>) or aria-hidden="true". If
it's decorative, I don't see the need to include the icon inside the <h3>,
but that's just a personal preference for me.
If the icon conveys information, then it would need alternative text.
It really depends if you feel the icon should be part of the heading but in
general, there's nothing bad about doing it.
On Thu, May 7, 2020 at 3:49 PM < = EMAIL ADDRESS REMOVED = > wrote:
> Greetings!
>
>
>
> This is my first posting and hoping you can help. I'm an instructional
> designer for higher education online. A huge part of my work these days
> concerns accessibility and I love learning how to make the experience
> better
> for everyone. (I took Accessible Docs not long ago and learned a ton!)
>
>
>
> My query: It is incorrect to combine a image (icon) and a header? That is,
> something like <H3>Some text and an icon </H3>?
>
>
>
> Please let me know if you need more info.
>
>
>
> Thanks!
>
> Caron
>
> > > > >
From: Murphy, Sean
Date: Thu, May 07 2020 6:04PM
Subject: Re: Combining headers and images: is this a "no no"?
← Previous message | Next message →
Caron
I always start with the question why? Why do you need the icon or image in the heading? What added value is it providing? Then move into the a11y space. If you really want to get good feedback. Engage some PWD users who might get impacted with the image in the heading.
Sean
Sean Murphy | Digital System specialist (Accessibility)
Telstra Digital Channels | Digital Systems
Mobile: 0405 129 739 | Desk: (02) 9866-7917
-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of = EMAIL ADDRESS REMOVED =
Sent: Friday, 8 May 2020 7:49 AM
To: = EMAIL ADDRESS REMOVED =
Subject: [WebAIM] Combining headers and images: is this a "no no"?
[External Email] This email was sent from outside the organisation â be cautious, particularly with links and attachments.
Greetings!
This is my first posting and hoping you can help. I'm an instructional designer for higher education online. A huge part of my work these days concerns accessibility and I love learning how to make the experience better for everyone. (I took Accessible Docs not long ago and learned a ton!)
My query: It is incorrect to combine a image (icon) and a header? That is, something like <H3>Some text and an icon </H3>?
Please let me know if you need more info.
Thanks!
Caron
From: caron.darbyson@gmail.com
Date: Fri, May 08 2020 10:11AM
Subject: Re: Combining headers and images: is this a "no no"?
← Previous message | No next message
Greetings!
Glen, thanks so much for the fast response on this... and for the good news on both ends! All good about the icon, too.
I love this community.
Happy weekend!
Caron Darbyson
-----Original Message-----
From: glen walker < = EMAIL ADDRESS REMOVED = >
Sent: May 7, 2020 6:42 PM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Combining headers and images: is this a "no no"?
"Incorrect" could have lots of meanings. From an html parsing perspective, it's not "incorrect" (sorry for the double negative), meaning it's legal html.
>From a WCAG perspective, there's nothing inherently "incorrect" either,
>if
coded correctly.
If the icon is decorative, then it should be hidden from assistive technology using either alt="" (if an <img>) or aria-hidden="true". If it's decorative, I don't see the need to include the icon inside the <h3>, but that's just a personal preference for me.
If the icon conveys information, then it would need alternative text.
It really depends if you feel the icon should be part of the heading but in general, there's nothing bad about doing it.
On Thu, May 7, 2020 at 3:49 PM < = EMAIL ADDRESS REMOVED = > wrote:
> Greetings!
>
>
>
> This is my first posting and hoping you can help. I'm an instructional
> designer for higher education online. A huge part of my work these
> days concerns accessibility and I love learning how to make the
> experience better for everyone. (I took Accessible Docs not long ago
> and learned a ton!)
>
>
>
> My query: It is incorrect to combine a image (icon) and a header? That
> is, something like <H3>Some text and an icon </H3>?
>
>
>
> Please let me know if you need more info.
>
>
>
> Thanks!
>
> Caron
>
> > > archives at http://webaim.org/discussion/archives
> >