WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: "labelling" links to inaccessible PDFs, blackend content?

for

From: Erick Wilder
Date: Jun 24, 2022 9:20AM

In this case visually hidden *must not* be translated to a display: none as
this will remove the element from the accessibility tree, making it
inaccessible.

You may check sr-only class of major UI frameworks like bootstrap for
examples of how to implement a visually hidden content.

Question: why don't you render “Redacted text” in the black box for *all
users*? I'm trying to think about neuro diversity here and maybe the black
box _with the textual content visible_ may be useful for someone with
reading disabilities to better understand what the purpose of the black
boxes are.

On Fri, 24 Jun 2022 at 17:09, Joachim Lindenberg < <EMAIL REMOVED> >
wrote:

> Hello Erick,
> thanks for the suggestion. Actually the * represent the redacted
> characters and ensure proper spacing. I experimented with explicit width on
> the span, but couldn´t get that to work as expected (also considering text
> wrap), probably because I am not too familiar with CSS either. If I
> translate "visually-hidden" to "display:none;" it will run into zero space
> being used, and that is not the appearance I am after. Or what CSS do you
> have in mind?
> Thanks,
> Joachi
>
> -----Ursprüngliche Nachricht-----
> Von: WebAIM-Forum <> Im Auftrag von Erick Wilder
> Gesendet: Friday, 24 June 2022 15:47
> An: WebAIM Discussion List < <EMAIL REMOVED> >
> Betreff: Re: [WebAIM] "labelling" links to inaccessible PDFs, blackend
> content?
>
> Hello Joachim,
>
> I don't have experience about the pdf ideia you raised however I may chip
> in the web page validation issue
>
> The way I see is that the asterisks in the web page added inside the span
> tag are unnecessary and I assume they're mostly there to keep help with
> styling with CSS(?). My recommendation here would be to use a relevant
> content instead. That content should be visually hidden and avoid changing
> the text color to black.
>
> Example
>
> <span class=“redacted-text”><span class=“visually-hidden”>Redacted
> text</span></span>
>
> CSS for redacted text should focus on creating a black box considering
> that text color should still be accessible
>
> The visually hidden class will ensure nothing is shown in the UI, making
> the use of background and colour as black unnecessarily
>
> Note: I'm no copywriter and the actual text need to be validated with
> users of assistive technologies if possible (I.e. maybe using “redacted
> email”, “redacted address” instead of a generic text)
>
> On Fri, 24 Jun 2022 at 15:21, Joachim Lindenberg < <EMAIL REMOVED> >
> wrote:
>
> > Hello,
> >
> > and also thanks for the WebAIM WAVE tool that I started using today to
> > improve accessibility of some of my web pages.
> >
> > I am struggling with two issues right now, mix of lack of
> > understanding and tool knowledge..
> >
> > 1. Links to PDFs. Most of the PDFs are also not accessible and some
> > of them likely will never be. I am now adding an icon after PDF links
> > and aria-label “link to PDF, not accessible” (actually in German). Not
> > sure this use of aria-label is adequate. Can someone share insights
> > please? Also the WAVE tool does complain despite these additions, is
> > there a way to suppress the warning?
> > 2. I do have some HTML pages that display email conversations but
> for
> > privacy reasons names and addresses etc. are blackened. The HTML
> > markup looks like <span
> > style="background-color:black;color:black;">********</span>. WAVE
> > complains about low contrast. Sure! Again, I can add aria-label or the
> > like if that is acceptable. And again, can one stop WAVE to complain?
> >
> > Thanks a lot for any suggestions or insights.
> >
> > Joachim
> >
> > > > > > archives at http://webaim.org/discussion/archives
> > > >
> --
> Enviado do Gmail para celular
> > > at http://webaim.org/discussion/archives
> >
> > > > >
--
Enviado do Gmail para celular