E-mail List Archives
Thread: alt text contrast question
Number of posts in this thread: 3 (In chronological order)
From: Sarah Ferguson
Date: Tue, Sep 26 2017 1:38PM
Subject: alt text contrast question
No previous message | Next message →
one more question from our developer (hopefully the last for a while):
Is there any reason this might be bad practice for accessibility:
adding a copy of the alt text as a child pseudo-element of the image
(img::after {content: attr(alt);}) and styling this copy using CSS. The
"true" alt text is in the HTML but is not styled. The copy was hidden by
the image and would only be seen if images were off. The copy overlaid the
alt text itself so with images off, you'd only see the copy. This mechanism
allowed for a black background mask behind white text, which would always
show up. We did this because with images off, some alt text was not high
contrast enough.
thanks
From: Ben Regis
Date: Wed, Sep 27 2017 2:42AM
Subject: Re: alt text contrast question
← Previous message | Next message →
Couldn't you just add a class to the image and apply a black background and white text or vice versa to that?
Ben
-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Sarah Ferguson
Sent: 26 September 2017 20:38
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: [WebAIM] alt text contrast question
one more question from our developer (hopefully the last for a while):
Is there any reason this might be bad practice for accessibility:
adding a copy of the alt text as a child pseudo-element of the image (img::after {content: attr(alt);}) and styling this copy using CSS. The "true" alt text is in the HTML but is not styled. The copy was hidden by the image and would only be seen if images were off. The copy overlaid the alt text itself so with images off, you'd only see the copy. This mechanism allowed for a black background mask behind white text, which would always show up. We did this because with images off, some alt text was not high contrast enough.
thanks
From: Sarah Ferguson
Date: Wed, Sep 27 2017 9:34AM
Subject: Re: alt text contrast question
← Previous message | No next message
Hi Ben,
I'm not a developer, so I don't know, but I will pass this on to her.
On Wed, Sep 27, 2017 at 4:42 AM, Ben Regis < = EMAIL ADDRESS REMOVED = > wrote:
> Couldn't you just add a class to the image and apply a black background
> and white text or vice versa to that?
>
> Ben
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Sarah Ferguson
> Sent: 26 September 2017 20:38
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: [WebAIM] alt text contrast question
>
> one more question from our developer (hopefully the last for a while):
>
> Is there any reason this might be bad practice for accessibility:
>
> adding a copy of the alt text as a child pseudo-element of the image
> (img::after {content: attr(alt);}) and styling this copy using CSS. The
> "true" alt text is in the HTML but is not styled. The copy was hidden by
> the image and would only be seen if images were off. The copy overlaid the
> alt text itself so with images off, you'd only see the copy. This mechanism
> allowed for a black background mask behind white text, which would always
> show up. We did this because with images off, some alt text was not high
> contrast enough.
>
> thanks
> > > at http://webaim.org/discussion/archives
> >
>
> > > > >