E-mail List Archives
Thread: Fwd: Examples of bad web page designs, for a presentation
Number of posts in this thread: 6 (In chronological order)
From: Birkir Rúnar Gunnarsson
Date: Fri, Aug 27 2010 9:18AM
Subject: Fwd: Examples of bad web page designs, for a presentation
No previous message | Next message →
Hello listers
I apologize if this is double postd.
I got no responses to the first one and I suspect it might not have
come through to the list.
Feel free to at least notify me off list that the mail made it through.
Perhaps this horse of a topic is so dead that people don't respond to
it any more, which is fine *smile*.
Happy weekend all.
-Birkir
---------- Forwarded message ----------
From: Birkir Rúnar Gunnarsson < = EMAIL ADDRESS REMOVED = >
Date: Thu, 26 Aug 2010 16:34:32 +0000
Subject: Examples of bad web page designs, for a presentation
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Listers
I've been asked to give presentations at a Norwegian and Icelandic web
confrerences in the next couple of months. Basic introduction of
screen reading, the challenges it creates and common web navigation
problems (short and general enough so e.g. I can't get into the
details of, say, Ajax accessibility).
I am wondering about a couple of things and samples to give and if
anyone can give me a good web page example of such behavior (I can
find those myself, of course, but if someone knows off them right
away, that'd be cool, also if someone has a lot of experience with
such presentations, any tidbits of knowledge that would be good to
cover)?
Firstly at CSUN my colleague saw a presentation, I think from one of
the god folks at W3C, where they had the same ewb site with same looks
but two versions, one that was very accessible, other version was very
badly designed. Visually it looked the same but to a screen reader it
was night and day to navigate. Does anyone know which web site this
might be referring to?
Also I am looking for a few specific examples.
One would be a heading that is created visually by indenting text but
not with an html heading.
Another would be a page using the relative location of the text to
indicate the purpose of a graphic or button, rather than a label
(something where the text clearly shows visually that this button does
X, but button is not labelled so a blind user, not having the benefit
of spatial layout of the page, cannot deduce this from the context).
Then a page with unlabelled edit fields or form elements.
or a page where the labels for all fields are read first and then all
the edit fields come after, leaving the user to guess which label
belongs to which field (I often see this with state/city/zip code in
forms, for instance).
Finally, if anyone knows of an example of an ungraceful recovery,
where user has to use a mouse to get out of a page that'd be kind of
neat to show I think (i.e. gets into a loop where keyboard cannot get
the user out of).
Possibly I was wondering of a page with live regions that update, I am
not even 100% sure how that wors with, say, Jaws, I suppose Jaws would
ignore them unless an Aria control was implemented with sufficient
priority to grab focus and move it to the updated area, but I suspect
this might be getting too technical, plus I have to do better studying
of Aria myself before presenting it much.
This is a blindness specific talk. I will point out problems with
other disability groups as well, but the majority of the presentation
will be to explain screen readers and how they are used to access web
sites, as well as pointing out pit falls.
Any feedback/ideas/examples would be very much appreciated.
Thanks guys
-Birkir
From: Bevi Chagnon | PubCom
Date: Fri, Aug 27 2010 9:27AM
Subject: Re: Fwd: Examples of bad web page designs, for a presentation
← Previous message | Next message →
There are several websites devoted to this topic, and the most well-known is
http://www.webpagesthatsuck.com/
(I did not make up that URL!)
But, what do you mean by "bad design?"
-- bad design for accessibility?
-- bad visual design & aethestics?
-- poor site architecture and organization of the content?
-- poor navigation aides?
-- failure to communicate the message or mission of the site's owners?
-- inaccurate or misleading information?
Just curious!
--Bevi Chagnon
: : : : : : : : : : : : : : : : : : :
: : : : : : : : : : : : :
Bevi Chagnon | PubCom | = EMAIL ADDRESS REMOVED = | 301-585-8805
Government publishing specialists, trainers, consultants | print, press,
web, Acrobat PDF & 508
Online at the blog: Its 2010. Wheres your career heading?
www.pubcom.com/newsletter
-----Original Message-----
From: = EMAIL ADDRESS REMOVED =
[mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Birkir Rúnar
Gunnarsson
Sent: Friday, August 27, 2010 11:18 AM
To: WebAIM Discussion List
Subject: [WebAIM] Fwd: Examples of bad web page designs, for a presentation
Hello listers
I apologize if this is double postd.
I got no responses to the first one and I suspect it might not have come
through to the list.
Feel free to at least notify me off list that the mail made it through.
Perhaps this horse of a topic is so dead that people don't respond to it any
more, which is fine *smile*.
Happy weekend all.
-Birkir
---------- Forwarded message ----------
From: Birkir Rúnar Gunnarsson < = EMAIL ADDRESS REMOVED = >
Date: Thu, 26 Aug 2010 16:34:32 +0000
Subject: Examples of bad web page designs, for a presentation
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Listers
I've been asked to give presentations at a Norwegian and Icelandic web
confrerences in the next couple of months. Basic introduction of screen
reading, the challenges it creates and common web navigation problems (short
and general enough so e.g. I can't get into the details of, say, Ajax
accessibility).
I am wondering about a couple of things and samples to give and if anyone
can give me a good web page example of such behavior (I can find those
myself, of course, but if someone knows off them right away, that'd be cool,
also if someone has a lot of experience with such presentations, any tidbits
of knowledge that would be good to cover)?
Firstly at CSUN my colleague saw a presentation, I think from one of the god
folks at W3C, where they had the same ewb site with same looks but two
versions, one that was very accessible, other version was very badly
designed. Visually it looked the same but to a screen reader it was night
and day to navigate. Does anyone know which web site this might be referring
to?
Also I am looking for a few specific examples.
One would be a heading that is created visually by indenting text but not
with an html heading.
Another would be a page using the relative location of the text to indicate
the purpose of a graphic or button, rather than a label (something where the
text clearly shows visually that this button does X, but button is not
labelled so a blind user, not having the benefit of spatial layout of the
page, cannot deduce this from the context).
Then a page with unlabelled edit fields or form elements.
or a page where the labels for all fields are read first and then all the
edit fields come after, leaving the user to guess which label belongs to
which field (I often see this with state/city/zip code in forms, for
instance).
Finally, if anyone knows of an example of an ungraceful recovery, where user
has to use a mouse to get out of a page that'd be kind of neat to show I
think (i.e. gets into a loop where keyboard cannot get the user out of).
Possibly I was wondering of a page with live regions that update, I am not
even 100% sure how that wors with, say, Jaws, I suppose Jaws would ignore
them unless an Aria control was implemented with sufficient priority to grab
focus and move it to the updated area, but I suspect this might be getting
too technical, plus I have to do better studying of Aria myself before
presenting it much.
This is a blindness specific talk. I will point out problems with other
disability groups as well, but the majority of the presentation will be to
explain screen readers and how they are used to access web sites, as well as
pointing out pit falls.
Any feedback/ideas/examples would be very much appreciated.
Thanks guys
-Birkir
From: Birkir Rúnar Gunnarsson
Date: Fri, Aug 27 2010 9:36AM
Subject: Re: Fwd: Examples of bad web page designs, for a presentation
← Previous message | Next message →
Thanks very much for that pointer, and amusing url.
I am thinking specifically from a blind user accessibility perspective
(for this particular purpose).
I am thinking of demoing a few things that look, visually, fine and
well organized but, because structured html was not used or label not
correctly applied, completely fail for screen reader users or, at
best, are majorly confusing.
I am mostly thinking about tables that are created by tabs or spacing
rather than the table tag, ditto for a heading, label text located
directly above or next to a button without being the button label,
those kind of things.
The topic is specifically how blind people navigate the web and what
problems they encounter.
Thanks
-Birkir
On 8/27/10, Bevi Chagnon | PubCom < = EMAIL ADDRESS REMOVED = > wrote:
> There are several websites devoted to this topic, and the most well-known is
> http://www.webpagesthatsuck.com/
>
> (I did not make up that URL!)
>
> But, what do you mean by "bad design?"
> -- bad design for accessibility?
> -- bad visual design & aethestics?
> -- poor site architecture and organization of the content?
> -- poor navigation aides?
> -- failure to communicate the message or mission of the site's owners?
> -- inaccurate or misleading information?
>
> Just curious!
> --Bevi Chagnon
>
> : : : : : : : : : : : : : : : : : : :
> : : : : : : : : : : : : :
> Bevi Chagnon | PubCom | = EMAIL ADDRESS REMOVED = | 301-585-8805
> Government publishing specialists, trainers, consultants | print, press,
> web, Acrobat PDF & 508
> Online at the blog: It’s 2010. Where’s your career heading?
> www.pubcom.com/newsletter
>
> -----Original Message-----
> From: = EMAIL ADDRESS REMOVED =
> [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Birkir Rúnar
> Gunnarsson
> Sent: Friday, August 27, 2010 11:18 AM
> To: WebAIM Discussion List
> Subject: [WebAIM] Fwd: Examples of bad web page designs, for a presentation
>
> Hello listers
>
> I apologize if this is double postd.
> I got no responses to the first one and I suspect it might not have come
> through to the list.
> Feel free to at least notify me off list that the mail made it through.
> Perhaps this horse of a topic is so dead that people don't respond to it any
> more, which is fine *smile*.
> Happy weekend all.
> -Birkir
>
>
> ---------- Forwarded message ----------
> From: Birkir Rúnar Gunnarsson < = EMAIL ADDRESS REMOVED = >
> Date: Thu, 26 Aug 2010 16:34:32 +0000
> Subject: Examples of bad web page designs, for a presentation
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>
> Listers
>
> I've been asked to give presentations at a Norwegian and Icelandic web
> confrerences in the next couple of months. Basic introduction of screen
> reading, the challenges it creates and common web navigation problems (short
> and general enough so e.g. I can't get into the details of, say, Ajax
> accessibility).
> I am wondering about a couple of things and samples to give and if anyone
> can give me a good web page example of such behavior (I can find those
> myself, of course, but if someone knows off them right away, that'd be cool,
> also if someone has a lot of experience with such presentations, any tidbits
> of knowledge that would be good to cover)?
> Firstly at CSUN my colleague saw a presentation, I think from one of the god
> folks at W3C, where they had the same ewb site with same looks but two
> versions, one that was very accessible, other version was very badly
> designed. Visually it looked the same but to a screen reader it was night
> and day to navigate. Does anyone know which web site this might be referring
> to?
> Also I am looking for a few specific examples.
> One would be a heading that is created visually by indenting text but not
> with an html heading.
> Another would be a page using the relative location of the text to indicate
> the purpose of a graphic or button, rather than a label (something where the
> text clearly shows visually that this button does X, but button is not
> labelled so a blind user, not having the benefit of spatial layout of the
> page, cannot deduce this from the context).
> Then a page with unlabelled edit fields or form elements.
> or a page where the labels for all fields are read first and then all the
> edit fields come after, leaving the user to guess which label belongs to
> which field (I often see this with state/city/zip code in forms, for
> instance).
> Finally, if anyone knows of an example of an ungraceful recovery, where user
> has to use a mouse to get out of a page that'd be kind of neat to show I
> think (i.e. gets into a loop where keyboard cannot get the user out of).
> Possibly I was wondering of a page with live regions that update, I am not
> even 100% sure how that wors with, say, Jaws, I suppose Jaws would ignore
> them unless an Aria control was implemented with sufficient priority to grab
> focus and move it to the updated area, but I suspect this might be getting
> too technical, plus I have to do better studying of Aria myself before
> presenting it much.
>
> This is a blindness specific talk. I will point out problems with other
> disability groups as well, but the majority of the presentation will be to
> explain screen readers and how they are used to access web sites, as well as
> pointing out pit falls.
> Any feedback/ideas/examples would be very much appreciated.
> Thanks guys
> -Birkir
>
From: Stephan Wehner
Date: Fri, Aug 27 2010 2:03PM
Subject: Re: Fwd: Examples of bad web page designs, for a presentation
← Previous message | Next message →
2010/8/27 Birkir Rúnar Gunnarsson < = EMAIL ADDRESS REMOVED = >:
> Thanks very much for that pointer, and amusing url.
> I am thinking specifically from a blind user accessibility perspective
> (for this particular purpose).
> I am thinking of demoing a few things that look, visually, fine and
> well organized but, because structured html was not used or label not
> correctly applied, completely fail for screen reader users or, at
> best, are majorly confusing.
> I am mostly thinking about tables that are created by tabs or spacing
> rather than the table tag, ditto for a heading, label text located
> directly above or next to a button without being the button label,
> those kind of things.
> The topic is specifically how blind people navigate the web and what
> problems they encounter.
Is facebook a good example?
Stephan
> Thanks
> -Birkir
>
>
> On 8/27/10, Bevi Chagnon | PubCom < = EMAIL ADDRESS REMOVED = > wrote:
>> There are several websites devoted to this topic, and the most well-known is
>> http://www.webpagesthatsuck.com/
>>
>> (I did not make up that URL!)
>>
>> But, what do you mean by "bad design?"
>> -- bad design for accessibility?
>> -- bad visual design & aethestics?
>> -- poor site architecture and organization of the content?
>> -- poor navigation aides?
>> -- failure to communicate the message or mission of the site's owners?
>> -- inaccurate or misleading information?
>>
>> Just curious!
>> --Bevi Chagnon
>>
>> : : : : : : : : : : : : : : : : : : :
>> : : : : : : : : : : : : :
>> Bevi Chagnon | PubCom | = EMAIL ADDRESS REMOVED = | 301-585-8805
>> Government publishing specialists, trainers, consultants | print, press,
>> web, Acrobat PDF & 508
>> Online at the blog: It’s 2010. Where’s your career heading?
>> www.pubcom.com/newsletter
>>
>> -----Original Message-----
>> From: = EMAIL ADDRESS REMOVED =
>> [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Birkir Rúnar
>> Gunnarsson
>> Sent: Friday, August 27, 2010 11:18 AM
>> To: WebAIM Discussion List
>> Subject: [WebAIM] Fwd: Examples of bad web page designs, for a presentation
>>
>> Hello listers
>>
>> I apologize if this is double postd.
>> I got no responses to the first one and I suspect it might not have come
>> through to the list.
>> Feel free to at least notify me off list that the mail made it through.
>> Perhaps this horse of a topic is so dead that people don't respond to it any
>> more, which is fine *smile*.
>> Happy weekend all.
>> -Birkir
>>
>>
>> ---------- Forwarded message ----------
>> From: Birkir Rúnar Gunnarsson < = EMAIL ADDRESS REMOVED = >
>> Date: Thu, 26 Aug 2010 16:34:32 +0000
>> Subject: Examples of bad web page designs, for a presentation
>> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>>
>> Listers
>>
>> I've been asked to give presentations at a Norwegian and Icelandic web
>> confrerences in the next couple of months. Basic introduction of screen
>> reading, the challenges it creates and common web navigation problems (short
>> and general enough so e.g. I can't get into the details of, say, Ajax
>> accessibility).
>> I am wondering about a couple of things and samples to give and if anyone
>> can give me a good web page example of such behavior (I can find those
>> myself, of course, but if someone knows off them right away, that'd be cool,
>> also if someone has a lot of experience with such presentations, any tidbits
>> of knowledge that would be good to cover)?
>> Firstly at CSUN my colleague saw a presentation, I think from one of the god
>> folks at W3C, where they had the same ewb site with same looks but two
>> versions, one that was very accessible, other version was very badly
>> designed. Visually it looked the same but to a screen reader it was night
>> and day to navigate. Does anyone know which web site this might be referring
>> to?
>> Also I am looking for a few specific examples.
>> One would be a heading that is created visually by indenting text but not
>> with an html heading.
>> Another would be a page using the relative location of the text to indicate
>> the purpose of a graphic or button, rather than a label (something where the
>> text clearly shows visually that this button does X, but button is not
>> labelled so a blind user, not having the benefit of spatial layout of the
>> page, cannot deduce this from the context).
>> Then a page with unlabelled edit fields or form elements.
>> or a page where the labels for all fields are read first and then all the
>> edit fields come after, leaving the user to guess which label belongs to
>> which field (I often see this with state/city/zip code in forms, for
>> instance).
>> Finally, if anyone knows of an example of an ungraceful recovery, where user
>> has to use a mouse to get out of a page that'd be kind of neat to show I
>> think (i.e. gets into a loop where keyboard cannot get the user out of).
>> Possibly I was wondering of a page with live regions that update, I am not
>> even 100% sure how that wors with, say, Jaws, I suppose Jaws would ignore
>> them unless an Aria control was implemented with sufficient priority to grab
>> focus and move it to the updated area, but I suspect this might be getting
>> too technical, plus I have to do better studying of Aria myself before
>> presenting it much.
>>
>> This is a blindness specific talk. I will point out problems with other
>> disability groups as well, but the majority of the presentation will be to
>> explain screen readers and how they are used to access web sites, as well as
>> pointing out pit falls.
>> Any feedback/ideas/examples would be very much appreciated.
>> Thanks guys
>> -Birkir
>>
From: Margit Link-Rodrigue
Date: Fri, Aug 27 2010 2:45PM
Subject: Re: Fwd: Examples of bad web page designs, for a presentation
← Previous message | Next message →
I live in Baton Rouge, Louisiana, and the City of Baton Rouge site is so
outdated that you will find plenty of simple accessibility issues. Granted,
Louisiana has such a bad budget deficit, not much is going forward here at
all.
http://brgov.com/govt/
- no skip navigation
- bad use of image alt attribute
- no heading markup
- link to an inaccessible video page
From: Chris Hoffman
Date: Fri, Aug 27 2010 10:54PM
Subject: Re: Fwd: Examples of bad web page designs, for a presentation
← Previous message | No next message
My perennial favorite example of inexplicably inaccessible web design
is at www.assistivetek.com. It is truly something to behold.
On Fri, Aug 27, 2010 at 4:42 PM, Margit Link-Rodrigue < = EMAIL ADDRESS REMOVED = > wrote:
> I live in Baton Rouge, Louisiana, and the City of Baton Rouge site is so
> outdated that you will find plenty of simple accessibility issues. Granted,
> Louisiana has such a bad budget deficit, not much is going forward here at
> all.
>
> http://brgov.com/govt/
>
>
> - no skip navigation
> - bad use of image alt attribute
> - no heading markup
> - link to an inaccessible video page
>