Site bug: Use alt attribute *only* for accessibility

[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

 



Hi.

============================= TL;DR =============================
Please do what the subject says; otherwise screen readers on all
platforms will spew out things you don't want them to. Thanks! :)
=================================================================

On (at least) start.fedoraproject.org, you have the following:

<a href="https://www.redhat.com/";>A Red Hat-Sponsored Community
Project&nbsp;&nbsp;<img
src="/static/images/sponsors/redhat-community.png"
alt="Project-Id-Version: Fedora Websites
Report-Msgid-Bugs-To: EMAIL@ADDRESS
POT-Creation-Date: 2012-10-16 16:59+0200
PO-Revision-Date: 2012-10-17 19:17+0000
Last-Translator: Kévin Raymond <shaiton@xxxxxxxxxxxxxxxxx>
Language-Team: LANGUAGE <LL@xxxxxx>
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Generated-By: Babel 0.9.6
Language: en
Plural-Forms: nplurals=2; plural=(n != 1);
"></a>

This is a recentish change.

If you look at this W3C spec [1], you'll note that failing the use of an
aria-label or aria-labelledby attribute, the accessible name of the
'img' element should be the content of the attribute. And the Accessible
Name is what a screen reader SHOULD present (speak and display in
braille) to users.

Furthermore, if you look in that same spec for the 'a' element [2],
you'll notice that the name should come from the element subtree. This
means the accessible name of the link, that all screenreaders are
expected to speak and display in braille when that link gets focus or is
otherwise read, is:

    "A Red Hat-Sponsored Community Project  Project-Id-Version: Fedora
    Websites Report-Msgid-Bugs-To: EMAIL@ADDRESS POT-Creation-Date:
    2012-10-16 16:59+0200 PO-Revision-Date: 2012-10-17 19:17+0000
    Last-Translator: Kévin Raymond <shaiton@xxxxxxxxxxxxxxxxx>
    Language-Team: LANGUAGE <LL@xxxxxx> MIME-Version: 1.0 Content-Type:
    text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit
    Generated-By: Babel 0.9.6 Language: en Plural-Forms: nplurals=2;
    plural=(n != 1);]"

I've attached two screen shots of Accerciser illustrating that the above
really is the accessible name of the link for both Gecko (using Firefox,
but SeaMonkey shows it too) and WebKitGtk (using Epiphany). That name is
what Orca speaks when the user Tabs to that link. (That's how I
discovered this issue.)

I have also attached a screenshot taken using Apple's VoiceOver
screenreader (with the spoken output display enabled) in OS X using
Safari. What is displayed is what VoiceOver speaks when you Tab to that
link. Mind you, it says more than what is displayed; the "..." at the
end merely indicates what is to be spoken exceeds the space allocated by
the container.

>From the aforementioned spec references, you'll note that one way to
work around this is through the use of ARIA attributes. HOWEVER, that
strikes me as a hack, not to mention additional work, that wouldn't be
necessary if you only used the alt attribute for accessibility. If the
value really needs to be in the element, please put it in some other
data attribute. That would solve the problem without ARIA.

All of this said, my guess is some authoring tool is responsible for
this. In which case, it might be worth filing a bug against that
authoring tool. Regardless, if you could fix this img's alt value and,
if applicable, search the rest of the Fedora Project content for this
issue and fix any other instances, that would be awesome.

Please let me know if you have any questions. And thanks for your time
and attention to this issue!

--joanie
  Orca maintainer, ARIA spec editor, Fedora user -- and recommender

[1] https://rawgit.com/w3c/aria/master/html-aam/html-aam.html#img-element
[2] https://rawgit.com/w3c/aria/master/html-aam/html-aam.html#a-element

Attachment: accerciser-firefox.png
Description: PNG image

Attachment: accerciser-epiphany.png
Description: PNG image

Attachment: voiceover-safari.png
Description: PNG image

--
websites mailing list
websites@xxxxxxxxxxxxxxxxxxxxxxx
https://lists.fedoraproject.org/admin/lists/websites@xxxxxxxxxxxxxxxxxxxxxxx

[Index of Archives]     [Fedora Users]     [Linux ARM]     [ARM Kernel]     [Older Fedora Users]     [Fedora Advisory Board]     [Fedora Security]     [Fedora Devel Java]     [Fedora Desktop]     [ATA RAID]     [Fedora Marketing]     [Fedora Mentors]     [Fedora Package Announce]     [Fedora Package Review]     [Fedora Music]     [Fedora Packaging]     [Centos]     [Fedora SELinux]     [Coolkey]     [Yum Users]     [Yosemite News]     [KDE Users]     [Fedora Art]     [Fedora Docs]     [Asterisk PBX]

  Powered by Linux