[Owncloud] please care about screenreader accessibility

[Thomas Tanghus]

On Tuesday 01 May 2012 21:53 Henning Oschwald wrote:
> Hi,
> 
> The owncloud web interface has some accessibility issues which makes it
> difficult or partially impossible to use for screenreader users. A
> screenreader is a software that allows blind people to work with a
> computer as it basicly gathers the required information and presents it
> through text-to-speech or a braille display.
> 
> The biggest issue are custom UI elements such as div or span elements
> with an onclick event listener attached to it. Neither are such elements
> focussable with the keyboard, nor can they triggered by pressing the
> enter key or space bar. To test this, just leave your mouse where it is
> and try to focus the settings icon with the tab key of your keyboard -
> you won't be able to manage that. :-(
> 
> The keyboard focus problem can be solved by adding the tabindex="0" and
> role="button" attributes to the settings div. This allows to focus the
> settings icon with the tab key but still you can not activate the
> "button" by pressing enter, as you would need to add a keydown event
> listener as well. For that reason it is recommended to use native dialog
> elements whenever possible, where you get focus management and keyboard
> navigation for free.
> 
> I will file bugs for these issues as well, but I also wanted to raise
> this topic here on the list.
> 
> I've found the following less accessible or inaccessible UI elements so
> far:
> - The settings div in the navigation bar, as mentioned above
> - all navigation elements in settings/apps (I had to enable applications
>   directly in the Sqlite database.)
> - The share dialog. Here I can't tell the exact problem yet, but I'll
>   investigate that further. All I can tell for now is that the elements are
>   not labeled correctly and behave weirdly. :-)
> - Well, and the search edit box should get a label, as currently it is
>   announced as "log out". :-( However, this is just a matter of:
>   <label for="searchbox"><?php echo $l->t('Search');?></label>
>   added to core/templates/layout.user.php.
> 
> Here are some links that may helpful to get an idea about common
> accessibility problems and what to care about.
> 
> <http://kinlan-presentations.appspot.com/a11y/index.html>
> <http://yaccessibilityblog.com/library/easy-fixes-to-common-accessibility-pr
> oblems.html>
> <http://www.marcozehe.de/2010/02/10/easy-aria-tip-5-aria-expanded-and-aria-
> controls/>
> 
> The Android app also seems to have unlabeled buttons (missing
> content-describtions). I will also file bugreports.
> 
> There's a helpful article about how to make android apps accessible at
> the android developers site:
> <http://developer.android.com/guide/topics/ui/accessibility/apps.html>
> 
> If you have questions regarding accessibily of owncloud or you need a
> tester, just let me know. :-)

Thanks for taking time to investigate and report these issues. The thought has 
crossed my mind from time to time, but it never got further than that.

-- 
Med venlig hilsen / Best Regards

Thomas Tanghus