Page MenuHomePhabricator

screenreaders should have a way to skip InfoBoxes content.
Open, LowPublicFeature

Description

Author: mail.an.leo

Description:
Hello!

I am a user of de.wikipedia.org since 2005 and would like to propose a probably very easy to implement feature for blind people.

I have a brother who is blind and uses the JAWS Screenreader and a "Refreshable Braille display" and he experiences severe difficulties navigating wikipedia articles.

The Problem is:
At the beginning of the article the screenreader reads out Information boxes (with tables, showing on the right) for minutes, and you really cannot listen to that and white until its over all the time, while you just wait for the article introduction. If my brother tries to skip it, the screenreader jumps to the first headline and so he misses the articles introduction.
In the rest of the articles the screenreader reads out picture box information and stuff like that for over 50% of the time.

When i propose this i speak on behalf of my brother and several blind people whom we are in contact with

My proposal:
Please implement a feature like the "print version", maybe calles "pure text for blind people" that shows not much more than the article text and does especially not show

  • big info boxes
  • image galleries
  • edit buttons
  • missing sources ... tags for wikipedia users that edit

So that blind people have a version they can just quickly read through.

If that is possible i would like to tender 100€ for a easy-acessable and working text-only-output version for blind people!

If you have further questions please answer to:
user:nerdi in german wikipedia
mail.an.leo@web.de

Kind regards!


Version: unspecified
Severity: enhancement

Details

Reference
bz33787
ReferenceSource BranchDest BranchAuthorTitle
toolforge-repos/wikibugs2!21work/bd808/ignore-more-phorge-eventsmainbd808Ignore more phorge transaction types
Customize query in GitLab

Event Timeline

bzimport raised the priority of this task from to Low.Nov 22 2014, 12:05 AM
bzimport set Reference to bz33787.
bzimport added a subscriber: Unknown Object (MLST).

In theory, this can easily be implemented with Aural CSS: http://www.w3.org/TR/CSS21/aural.html

You can specify that infoboxes, galleries and other elements should have a CSS class "nospeak", defined with the following code:

.nospeak {

speak: none;

}

However, I have no idea how well Aural CSS is supported by screen reader software. Since it has been around since CSS2.1 support (at least for 2.1 elements) is hopefully good, but as I said, I have no idea.

I don't think setting the infobox to speak:none; for everyone is a good idea. There might be users who want to hear it.

So we need an optional way to skip it, I can think of two ways to do that:

  1. Along with Jump to: navigation, search we also add main content, or maybe Skip: infobox.
  2. Add another heading between the infobox and the main paragraph. That way skipping a heading wont skip the entire intro text.

@Volker_E @TheDJ what do you think?

I think the best way, would be with skip forth and skip back links at the top and bottom of the infobox itself.

Yes, agreed. If a technical solution is aimed for a skip link sounds like the most accurate. I'd be cautious though introducing a new skip link as it might interfere with learnt workflows for screenreader users.
As this task dates back to 2012, the landscape and also technical possibilities for affected users (especially navigation-wise) have changed when we look at our support of ARIA roles for example.

I agree with TheDJ - an infobox/sidebar skip link is easy to do with just template or module code, and a bit of JS or CSS if you want to hide the skip link.

One way I've done it, the sidebar contains a few divs, the first of which is a skip link, and the last of which is a skip link target.

sidebar_root
    :tag('div')
        :addClass('skip-link')
        :wikitext('[[#introduction|Jump to introduction]]')

-- other divs: previous/next navigation, image and caption, data lists

return tostring(sidebar_root) .. '<div id="introduction"></div>'

Wikipedia's infoboxes are mostly <table>s, thanks 2004, but the modules could insert link and target divs before and after each table.

There are lots of JS and CSS techniques to hide skip links when inactive, but here's the CSS one I use.

.skip-link {
    position: absolute;
    top: -3.5em;
    box-sizing: border-box;
    padding-right: 2em;
    width: 100%;
    text-align: center;
}
.skip-link a, .skip-link a:hover, .skip-link a:visited {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}
.skip-link a:active, .skip-link a:focus {
    position: static;
    width: auto;
    height: auto;
}

I think the best way, would be with skip forth and skip back links at the top and bottom of the infobox itself.

Makes sense to me. Do you think you'll have time to (co-)mentor this for Google-Code-in-2017?

I re-read @Volker_E's comment and he has a point, too many skip to links is a problem. I'd say, by having just one, that is along with the Jump to links that are already there we could solve the problem at hand without disrupting what people are used to.

In the case that the reader skips the infobox and goes directly to the content and now wants to hear the infobox, they can always jump back to the main heading hear the entire thing.

Aklapper changed the subtype of this task from "Task" to "Feature Request".Feb 4 2022, 11:14 AM