denise: Image: Me, facing away from camera, on top of the Castel Sant'Angelo in Rome (Default)
Denise ([staff profile] denise) wrote in [site community profile] dw_accessibility2013-01-15 10:39 pm

Inaccessible websites?

I'm doing a talk on web accessibility at LinuxConf Australia and would like to give specific examples!

So, gimme your best examples of websites with specific accessibility problems that drive you nuts. Use of tabular data where it doesn't make any sense, sites with horrible contrast or that won't let you change font sizes, restaurant websites that are entirely flash-based, etc, etc.

Also, if anybody knows of good illustrative videos of a) people listening to a screenreader and b) people dictating to their computer, point me at 'em?
lightgetsin: The Doodledog with frisbee dangling from her mouth, looking mischievious, saying innocence personified. (Default)

[personal profile] lightgetsin 2013-01-16 03:54 am (UTC)(link)
Google with Instant turned on. Can't reliably type into the search field, can't read what I've written if I actually do, half the time it starts searching when I'm not done typing, or it just fails to run the search at all no matter what I do.
qem_chibati: (^_^;; - misc shoujo)

[personal profile] qem_chibati 2013-01-16 04:08 am (UTC)(link)
There was an example that came up on [community profile] accessibility_fail the other week with wikipedia - http://accessibility-fail.dreamwidth.org/54620.html

Basically, you can't rate a wikipedia article unless you select the stars with your mouse. If you are trying to access it using VoiceOver (as your using a screenreader) it does not work, if you are trying to select it using tabs etc as you don't have a mouse, it does not work.

I think Dragon Dictation has some videos, but I'm not able to go through and find one in regards to b)

http://australia.nuance.com/dragon/accessibility/index.htm
jeshyr: Blessed are the broken. Harry Potter. (Default)

[personal profile] jeshyr 2013-01-16 04:35 am (UTC)(link)
Ohh, Tumblr! There is a bizarre "fashion" I've only seen on Tumblr to make websites that have a sidebar that ends up ON TOP of the main text when I expand the web page in Safari with command-+.

The only example I can find right now is a NSFW blog although this particular page is PG rated - http://fuckyeahfrosthawk.tumblr.com/post/39650827372/a-hawk-unmade-imsorry-imsosorry-i-have

So initially when I press command-+ a bunch of times I see this:
https://www.evernote.com/shard/s56/sh/dbf65098-5157-45b3-ad96-f0da59fe78ed/f3d8353da2f604af276273bd8fbc0e74

The actual content image is way over to the right - the "You have heart" image on the left is the top of the sidebar. But when I scroll horizontally to see the content I get this:
https://www.evernote.com/shard/s56/sh/d0e825f1-06fb-4d69-a570-4ff4f58ca025/96084d827bef231d966a3717b648c718
There's no way to get the stupid sidebar out of the way except by manipulating the CSS with bookmarklets, etc. Luckily I am techy enough to do this, but it shouldn't be needed!!!

I've pretty sure that I've never seen this sidebar-on-top behaviour outside of tumblr. I suspect that one of the very early Tumblr layouts had this coded in and everybody since then has copied it or something - it's probably a good example of how a "small" accessibility mistake can snowball if it ends up in a much-copied layout!
jeshyr: Blessed are the broken. Harry Potter. (Default)

[personal profile] jeshyr 2013-01-16 04:37 am (UTC)(link)
The other annoyance is the stupid meta header that prevents zooming which Apple has implemented - it's really common on mobile sites. Luckily I can load those pages up in Firefox and view them anyway because Firefox still lets them zoom, at least so far. *touch wood*
not_a_sniglet: A fox and a deer touching noses. (Default)

[personal profile] not_a_sniglet 2013-01-16 07:27 am (UTC)(link)
http://www.subeta.net

I'm not sure WHY it's inaccessible. I think it may be flash, though not something my screen reader's recognizing as flash, and everything is in mouse-able dropdown menus. Tabbing will get you the first item in a menu, but not the rest. I've tweeted at them and tried to explain this several times, but nobody's ever replied, and it's extra sad because the site used to be entirely accessable till they went and had a redesign.
not_a_sniglet: A fox and a deer touching noses. (Default)

[personal profile] not_a_sniglet 2013-01-16 07:28 am (UTC)(link)
Ohhhh gaaah. Google instant is a pain. I'm so glad someone mentioned that!
shanaqui: Jo from Supernatural, with a gun. ((Jo) Careful now)

[personal profile] shanaqui 2013-01-16 11:30 am (UTC)(link)
The colour scheme on goodreads.com is horrific -- links like "edit" and "delete" are often in tiny tiny pale grey text. Serif fonts. Some images aren't given proper alt-text. And when people ask for changes to be made, they mutter about brand identity or never answer at all.
forthwritten: stained glass spiral (Default)

[personal profile] forthwritten 2013-01-16 11:42 am (UTC)(link)
http://www.lechienetmoi.com - one of my friends and I mock this site on a regular basis. Highlights include their contact page and what happens when you ctrl +

(Anonymous) 2013-01-16 01:08 pm (UTC)(link)
http://singaporeseen.stomp.com.sg/singaporeseen/

Once, my mouse broke, and I realized the nightmare of navigating this site on a keyboard. Half the time I don't even know where the focus flies off to when tab-scrolling, and the other half of the time, I kept wondering why the arrow keys never scroll.

But the most cumbersome part is, every time I want to read the next article, I had to backspace (go back previous page) then retab all the way from the beginning again to reach the next article.

After a week, I gave up and bought a mouse.
carene_waterman: An image of the Carina Nebula (Default)

[personal profile] carene_waterman 2013-01-16 03:41 pm (UTC)(link)
cbc.ca is a good example of something that I see on a lot of sites, often on new, cutting edge redesigns.

Horizontal menus that don't wrap and therefore don't scale. On the CBC site, with my font minimum set to 13px, the listen link is half under the search box. If I up the font size a little more, the watch link goes bye-bye too.

I gave them feedback on this, I do it all the time on sites that introduce menus that only work if you leave the tiny 10px font alone. I have a little boilerplate bit of text about aging populations and accessibility for everyone of all ability levels. Don't know if it's doing any good, but I keep doing it.

The other main problem area for me is shopping sites that display a grid of items. They often use fixed height elements for the image and the text, so the text just overflows out of visibility range at anything big enough to read.
prototypical: (lemme think about that)

[personal profile] prototypical 2013-01-16 05:22 pm (UTC)(link)
This is where I admit I wish I knew how to turn it off, but don't!
prototypical: (applause)

[personal profile] prototypical 2013-01-16 05:23 pm (UTC)(link)
Too many sites these days have icons without descriptive text when you hover over the icon -- Tumblr, I'm looking at you because you're the one I spend the most time at.
Edited 2013-01-16 17:23 (UTC)
deborah: the Library of Congress cataloging numbers for children's literature, technology, and library science (Default)

[personal profile] deborah 2013-01-16 07:17 pm (UTC)(link)
+1

in order to make Google work I either have to let it set cookies so I can turn off instant (which I refuse to do -- I don't give Google more information than I have to), or turn off JavaScript. But because so many other sites right now are using Google tools which rely on JavaScript from Google.com (not to mention captcha tools which use Google JavaScript), I end up turning on and off Google JavaScript 20 times a day.
deborah: the Library of Congress cataloging numbers for children's literature, technology, and library science (Default)

[personal profile] deborah 2013-01-16 07:35 pm (UTC)(link)
I have videos of me controlling software with Dragon; I will send them to you. There are great videos of people using JAWS; I will send you my favorite link from my accessibility presentation.

I hate anything that automatically captures the cursor, unless there is seriously only one thing you can do on that page. For an example, http://worldcat.org/ -- incredibly useful site which I use all the time (interlibrary loan for the win), but every single page reload captures the cursor and I have to free it in order to do anything the a keyboard/voice.

luckily restaurant websites that are entirely flash-based are less common, although they and children's author websites are still astonishingly frequently flash only.

Anything that overrides basic keystroke commands without giving you a way to turn them off. I tried using remember the milk -- https://www.rememberthemilk.com/ -- and it was completely impossible, because every single normal keystroke is overridden, and you can't turn them off without turning off JavaScript, which completely breaks the site. I especially get angry at any site which thinks it is clever by overridding keystrokes which are common browser shorthand on common browsers. The demo version of jira doesn't exhibit the behavior where typing "/" automatically takes you to the search box, thus overriding the "/" synonym for ctrl-F in Firefox, which makes me think that they finally fixed it, boo yeah. (We are using an older version at work.)

Any site which is completely broken with JavaScript turned off, not just RTM as above, but how about the entire gawker family of pages. I know it it the latest surveys are saying that most screen reader users browse with JavaScript turned on, but there is more to accessibility than just screen reader users, and for reasons as above (mostly having to do with turning off ways so-called clever designers overrode the keyboard or captured my cursor) I need to turn off JavaScript *frequently*. The fact that I have to turn it on again to visit io9 or jezebel or lifehacker is why I mostly Boycott those sites.

Sites which make information available only via title element, obviously, but also sites which make that same information available only via title or alt. Xkcd comes to mind -- jokes which are only funny if you have access to that. The alt is at least theoretically available to non-mouse users, Say, if they are me, and technically savvy enough to make it really easy to turn off images in their browsers, so that the can read the alternative text. But I'm assuming that most keyboard/voice-only users don't necessarily have that ability; it's non-trivial in most browsers.
deborah: the Library of Congress cataloging numbers for children's literature, technology, and library science (Default)

[personal profile] deborah 2013-01-16 07:42 pm (UTC)(link)
by the way, the video of me controlling software with Dragon is NOT me controlling a website. I am happy to make a new one of me controlling websites, if you like, both a good website and a bad website.

For what it's worth, such videos are necessarily slow-moving. While experienced screen reader users can move at a speed that non-screen reader users can't even parse (I recently read this interesting study about has screen reader users and accusing a different part of the brain in order to parse sounds faster than non-screen reader users. \o/ SCIENCE), dictation is necessarily a slow process, at least for command and control.
carene_waterman: An image of the Carina Nebula (Default)

[personal profile] carene_waterman 2013-01-16 11:08 pm (UTC)(link)
This post just came up on my reading list: http://css-tricks.com/zooming-squishes/

It's an interesting case of a complaint about a responsive design that doesn't work well at large font and the designers choice of repair which is not what the person wanted, but might be the best fix.

Raises a question about who is responsible to make the effort for a site to be fully usable that isn't answered, but certainly bears thinking about.

pauamma: Cartooney crab holding drink (Default)

[personal profile] pauamma 2013-01-16 11:38 pm (UTC)(link)
http://en.wikipedia.org/wiki/Wikipedia_talk:Five_pillars#Accessibility_and_equality is a prime example of the entrenched culture that makes so many sites stay inaccessible.
lightgetsin: The Doodledog with frisbee dangling from her mouth, looking mischievious, saying innocence personified. (Default)

[personal profile] lightgetsin 2013-01-17 01:30 am (UTC)(link)
Well, this is a whole other thing. There is a link available to screen readers at the top of the page -- "click here to turn off google instant." I have no idea what they do with it visually -- maybe make it invisible? In any case, it only works for the duration of the session, and doesn't save when you close the window. Also requires cookies. In a conversation with a Google person I had over a year ago, she said they knew about this problem and were trying to fix. So . . . around 2018 then.

You can also turn off javascript, but for the reasons [personal profile] jadelennox talked about, this is really annoying in the google context.

[personal profile] treeowl 2013-01-17 08:47 am (UTC)(link)
It took me a couple minutes to find the contact page. I'm not sure what makes it much worse than the rest, aside from the fact that it's pretty hard to figure out where to click on it. The whole side is a toy—it's pretty and "clever", but not actually good for anything as far as I can tell.

[personal profile] treeowl 2013-01-17 08:54 am (UTC)(link)
It doesn't seem quite fair to blame websites that use Javascript responsibly. It's a key technology of the modern web. Now sites that do absurd things with it, or that present their content in Flash, are a whole different story.
forthwritten: stained glass spiral (Default)

[personal profile] forthwritten 2013-01-17 02:47 pm (UTC)(link)
For me, it's the sideways handwriting and the old - sorry, "vintage" map that doesn't bear much resemblance to what's there now. Navigate by landmarks and want to find this place? Hahaha, good luck.

More unfortunately, this seems to be a popular local web designer and their crappy flash-based design extends to things like restaurants.
deborah: the Library of Congress cataloging numbers for children's literature, technology, and library science (Default)

[personal profile] deborah 2013-01-17 03:58 pm (UTC)(link)
D asked for websites with specific accessibility problems which drive us nuts, and I gave her one. That is not "blaming websites"; if we can't talk about accessibility issues we have when we are asked about them, how will we advance? Moreover, I don't believe that one is using JavaScript responsibly if a site is entirely nonfunctional without JavaScript.

When I spent this past year in a key responsibility position for redesigning a website from the ground up, my instruction to the developers was that key content needed to be discoverable and viewable with JavaScript turned off. It didn't need to be pretty, it didn't need to be elegant, it didn't need to be as pleasant a user experience as if javascript was turned on. Clearly all kinds of functionality such as light boxes and sliders didn't need to be reproduced. But what I requested -- and what they easily delivered, even though it took extra time -- was that you could still use the search box and view the text or images on the page.

Yes, it takes more time -- although not a lot more time, if what you are talking about is making a search box work without JavaScript, or the text of your article appear on the page without JS. But accessibility does take more time. Not a lot more, if it's a key element of the design from the ground up.

And of course some functionality will not be available to people who have JavaScript turned off. Heck, some functionality will always be unavailable to people who have Flash turned off.

Not to mention, from a pure business perspective, content which is unavailable without JavaScript is usually invisible to search engines. SEO demands revealing your text content to the stupidest browser available, that is, a crawler. And while you can jump through hoops to make your text available to crawlers, you might as well jump through the same hoops and make your text available without JavaScript.

[personal profile] treeowl 2013-01-17 09:54 pm (UTC)(link)
Touché. I wasn't properly keeping in mind the distinction between using Javascript and relying on it, which is an entirely different matter. Yes, websites should be usable without Javascript and without CSS. Pet peeve: the limitations inherent to CSS make it difficult to impossible to produce certain visually reasonable layouts without mucking up the HTML structure so it's a bit wonky without CSS.
marahmarie: my initials (MM) (Default)

[personal profile] marahmarie 2013-01-18 05:46 am (UTC)(link)
For privacy reasons not giving the specific example I have in mind but it's a Silverlight based website that is a nightmare now that it's no longer coded in plain old HTML. This website was bad anyway because before Silverlight it was coded in tables so it was clunky and hard to navigate, but now the Silverlight seems to have disabled a lot of the keyboard-based navigation of the site altogether.

Also on my list of Websites That Should Not Exist In Their Current Form: any site done in Flash, any site with a splash or landing page of any sort (outside of purely navigational index pages, which I think can actually be useful as primary landing pages if done right), any website that makes you log in on a secondary page (one or more clicks away) from the home page, any site that autoloads previous and newly arriving comments FB and/or Disqus style (for me the scripts never load right or at all no matter how good my computer, browser, or connection is), any site behind frames, any site that doesn't function or look right without gobs of JS, any site that starts you off with teeny-tiny or too-large text even if the font is adjustable, any site that disables view source, any site that remotely loads the content you're viewing and/or uses a script to deliver it so that the content cannot be viewed in source at all, and uh, I'm running out of stuff on my short list, but I'll add on later if I think of more.

Anything that's bad for accessibility is bad for the public (and therefore bad for websites' bottom lines and popularity) overall. If you think about just my basic examples above, all of them annoy and inconvenience not just users with accessibility issues but many others as well.
Edited 2013-01-18 05:48 (UTC)
marahmarie: my initials (MM) (Default)

[personal profile] marahmarie 2013-01-18 05:56 am (UTC)(link)
There are userscripts on userscripts.org that can turn it off for you, if you're into using scripts.
cellio: (Default)

[personal profile] cellio 2013-01-20 08:20 pm (UTC)(link)
Yeah, CNN does that "fixed space, truncate or overlap the text as needed" thing, so with larger fonts I can't read many of the headlines.

Google+ does not allow you to change the font size for entries, and if you use your browser to do it it zooms the whole page (which already has horizontal scrolling). If you have to zoom a page it should *always* re-lay itself out to fit within the browser window, but few actually do. :-(
cellio: (Default)

[personal profile] cellio 2013-01-20 08:22 pm (UTC)(link)
Flash is the poster child for anti-accessibility. Nothing you can do through the browser has any effect on it; you get the colors, font sizes, and content-area sizes that the developer of the flash content hard-wired, and that's that. (Unfortunately, the worst offenders that I know of off-hand are things I'm required to use on our corporate network, which doesn't help for this query.)
jeshyr: Blessed are the broken. Harry Potter. (Default)

[personal profile] jeshyr 2013-01-29 01:58 am (UTC)(link)
I know this is a bit late, but headers that won't scroll off the screen.

Here's an article from Forbes.com: https://www.evernote.com/shard/s56/sh/e2183e64-08bd-40f8-981c-35eec2e8e43b/e50a6ea999bf687050bb77e40dded528

That huge brown header at the top stays there ALL the time, and as you can see once I have increased the text size to something that's readable for me it takes up enough of the screen to be really annoying and also useless because the text all runs into other bits of text.

I'd like to be able to tell the stupid thing to just scroll normally like everything else on the page - if I want to go back and find it I can always scroll up again!


sophie: A cartoon-like representation of a girl standing on a hill, with brown hair, blue eyes, a flowery top, and blue skirt. ☀ (Default)

[personal profile] sophie 2013-02-21 09:48 am (UTC)(link)
I just saw this comment, and I can tell you how to turn it off permanently. You need to go to the Search settings link (visually, it appears as an item in a menu that pops up when you click a button with a cog symbol on it after you've done a search; I'm not sure how it shows up in screenreaders). On that page, there's a section for "Google Instant predictions", with the question "When should we show you results as you type?". You need to change that to "Never show Instant results", then click the Save button at the bottom.

The page doesn't seem to use standard radio buttons, oddly, but the ones they do use seem like they should be accessible.
lightgetsin: The Doodledog with frisbee dangling from her mouth, looking mischievious, saying innocence personified. (Default)

[personal profile] lightgetsin 2013-03-02 04:13 pm (UTC)(link)
Huh, good to know. That's definitely new for values of "new" meaning sometime in the last year. Though of course requires always being logged in, which I'm definitely definitely not okay with in a lot of contexts. Oh google.

[personal profile] jazzyjj 2014-07-01 01:17 am (UTC)(link)
I have a few examples of inaccessible websites, or at least websites which are inaccessible to me and perhaps other screen readers. I'll try to make this somewhat brief, because there's a rather big T-storm brewing outside. But my first example is WebCT, the online academic platform. A few years ago I took an online medical terminology class through a local community college. WebCT was what the college used at the time. Back then I was still a Windows user, and I found most parts of the site pretty much a nightmare to navigate. I was able to do the quizzes with little difficulty, but I couldn't just navigate from one question to the next. I had to basically tab all over, back to the beginning and then use my screen reader's Find command to locate the next question. I had to do this each time I filled in my answer and needed to advance to each new question. Thank goodness for these Find commands! As if that weren't bad enough, the exams were all timed and I found myself getting all worked up just to try and beat the clock. It didn't help that my professor lacked the communication skills necessary to assist me. She even lied once, but it was too late. I was sent to one of the college's campuses only to discover that the exam I was to take had actually been taken off the site. So that was no fun at all. I haven't had reason to test WebCT with VoiceOver or Chromevox, but perhaps I will sometime just for kicks. Then, there is the website for a local taxi service. Their website uses flash, which if done properly has the potential of working pretty well with screen readers. But their flash player does not read well at all. It's a good thing that a phone option is available. The third example I have is a site that was set up specifically for tracking participant goals. This was for a nonprofit organization in which I have been involved since the summer of 2004. I don't exactly know what the issue was as I could never get anyone to help figure it out. But for whatever reason both screen readers I used at the time couldn't pick up some of the side links. But that website has since been discontinued in favor of a more modern approach to goal tracking. Well I said I'd be brief, but it sounds like the storm has passed.

[personal profile] jazzyjj 2014-07-02 02:13 am (UTC)(link)
This is just an addendum to my previous post. The website for the taxicab service I mentioned is http://www.303taxi.com . I couldn't get it to work well with VoiceOver or Chromevox either. But their site seems to have been overhauled. I just went there with VoiceOver, and the process for ordering a cab online seems to be a lot more accessible although there do seem to be some minor issues with it. I uninstalled Chromevox awhile ago because it kept crashing, but perhaps it has since been updated. The other 2 websites mentioned in my last post required logging in and are no longer available. The other point I wanted to make was that I don't much care for web-based email, at least most web-based mail sites. The reason for this is that they tend to be so incredibly cluttered, and they refresh a lot which is kind of a "no-no" for screen readers. For example, I use AT&T and their site does have a link which will turn off automatic page refreshing for screen readers. I have in fact tried this and while it works okay, it is by no means what I'd consider a viable solution.
Edited 2016-01-15 03:22 (UTC)