Standards.Next - Cognition and accessibility

These were notes taken live, so they will contain errors, omissions and ridiculous typos.

Antonia Hyde

Accessibility beyond code

Antonia's presentation slides * Antonia's review of Standards.Next

  • People are not defined by their disabilities - "People are people."

  • People with learning disabilities do use websites

  • Taking time and being anonymous is important.'People with learning disabilities won't use my website."

Video of Martin - ebay

  • Video (YouTube): Martin using eBay

  • Video (Easier YouTube): Martin using eBay

  • Types "ebay" into Google

  • Clicks first link - eBay

  • types into eBay's search box. ** Searching for CDs and Picture frames ** Showing the mobile phone page (on ebay? he said, this is website that sells mobile phones) ** Enlarge (to look at mobile phones) is useful. ** Bought phone for £2.99 - didn't work. ** Making a bid.

  • Looking for how to buy mobile phone ** Click "buy now" rolling over and over, but doesn't work. ** Got there in the end.

  • He was good at computers, knew the site.

  • Site had big meaningful pictures.

  • Search was consistent

  • Layout was clean

  • Enlarge icon & text worked - they reinforce one another

  • "Buy it now" problem -- appears twice once as text and once as an image. You would think they were both actions based on where they were placed.

  • "Buy it now" tells you that it is available to buy, but you can't click it

Video of Martin - amazon

  • Video (YouTube): Martin using Amazon for the first time

  • Video (Easy YouTube): Martin using Amazon for the first time

  • "nice and bright"

  • looking at sizing - brings up another window

  • orange border is helpful

  • getting frustrated

  • Using account - "How would you go into my account?" ** Found it. ** Can't see because of pale grey on account screen

  • Sign out

  • Not enough big, meaningful icons. (except for product pictures, shopping cart)

  • Bad typography

  • Poor contrast

  • Buttons are not defined enough

He did not have access to areas of the site

Screenshot of site in progress

  • Big Pictures
  • Confusing words linked (green) and defined

Another comment ###'Making everything literal will annoy other uses."

Escalator picture (tube)- picture

  • Consider the image looks like you should run down the escalator

  • Not literal enough

  • Group things together.

  • "i" icon (for information) didn't work. Questions marks for both Help and What is this site about.

Audience question - just watching w/o asking questions during user testing?

  • She feels it is important to facilitate learning by asking questions.

Icons plus words: less room for error. *Q: Standards or best practices for icons?

  • Yes, but I missed it.

Color coding can be elegant

  • Guardian
  • very helpful

Allow people to change text size and color schemes

  • People don't know how to change their browser settings
  • Also means you don't have to damage your design.

Space around things can give the impression that things are bigger.

  • BBC Home Page - weather pictures not large, but in their own container emphasizes them.

  • Audience feedback: far to busy for me. Who was this?'it's not my responsibility"

  • Everyone shares responsibility for making a site accessible - developers, content producers and managers.

  • Content is useless if people can't access it. Don't lock them out. People tend to blame themselves not the website.

  • Videos will be on youtube.

  • Blog: http://hiantonia.wordpress.com

  • Twitter @hiantonia

  • YouTube: http://www.youtube.com/hiantonia

Jamie Knight

Autism, the Internet & Antelopes

Jamie's presentation slides * Jamie's review of Standards.Next

Austism isn't

  • being stupid
  • being difficult

Autism is

  • a different thinking process
  • a spectrum

Sensory process

  • A lot of information coming in at once, processing can be hard
  • Example: can't read when there is noise in the background
  • Try to get away from

Language Processing

  • Videos w/ people talking quickly
  • "Turning words into 'almost sign'"
  • Rewatching videos over & over to try & understand

Social###

Little social things

  • e.g. "Go and wash your hands in the toilet"
  • e.g. "Adding friends" means different things on different social network sites, on facebook means two different things

The web is empowering###

  • Web has been his career
  • In retail couldn't keep up with what people consider normal

Paying Council tax

  • Didn't go very well
  • Asked for numbers but didn't tell you where to find them, unless you get them wrong.
  • "Print for you records" - paper on printers are "records"

Q&A

  • Henny: Follow up on video. How can we make it easier to understand?

  • Jamie: Captioning. Transcripts. Making sure you communicate context.

  • Henny: Using a screen reader. You built your own?

  • Jamie: AppleScript and VoiceOver. Microformats & embedded semantics. Wrote a script to look at the html and restructure the page and read it in the "correct order." Ignore intro.

  • Bruce: could we use to show the usefulnese (to Microsoft, et. al.) the usefulness of HTML5 tags.

  • Jim: And ARIA role="content"

  • Marking something up well doesn't always mean it's accessible.

  • Please don't use "title tags" (e.g. attributes) He hears it 3 times!

  • Snow Leopard. Trackpad has a one-to-one relationship between the trackpad and the screen. Very easy to use.

  • Screen readers that try to sound human & Screen readers that try to sound clear. Some aren't phonically accurate. Prefers dialogue & things written in a "human voice" to sound human. Sounds stupid for a robot to say "I" or "me."

  • Get an iMetLion.com sticker

  • Finds high level thinking more challenging

  • Explaining translating language to sign. Learned to sign & talk almost at the same time. When he reads something, it turns into "smoky signals," then turns into something he can understand

  • Couldn't spell equilibrium (letters too similar), but could spell it in sign (letters are distinct).

David Owens

Lessons Learned Doing Usability testing

David's presentation notes

Kirsty

  • Trouble using complex instructions
  • Had to rewrite user testing scripts. Provide context. Make them more explicit.
  • Looking

Lesson #1

  • Make sure your testing script doesn't make things more complex than they need to be.

Lesson #2

  • Placing context first (skip links)
  • Move cursor through the site in the order you'd expect them to be from looking at the site. People with autism will get confused if they are looking at the site and using a screen reader.

Lesson #3

  • Using Widgets on websites to control the way pages are presented.
  • Richard (learning disabilities) couldn't remember how to change text.

Lesson #4

  • Hit flash. Just gave up (had tried to make accessible controls.) Put controls first.
  • Understand preconceptions and work with them.

Sharing Results of User Testing

Share results of testing. Share lessons learned. A centralized website for sharing results?

Another Lesson

Don't stop one person taking advantage of something because somebody else can't.

Q&A

Q: How did you keep records? A: Used Shore Trust. Spent day at testing centre in Wales. Having client there helped. Client was involved closely the whole time. Makes it easier if the client sees someone having a problem.

Audience coment: build text resizer to work with browser resizing, then build html widget on top of that.

Ian Pouncey

Content and Cognition

Ian's presentation slides * Ian's review of Standards.Next

Ian works at Yahoo on the front page.

Will Cover #How to use content #Forms #Things to avoid

Consistency

  • Navigation - keep consistent across all pages
  • Fonts - don't use too many
  • Interactive elements, links and buttons - Leave css alone. Makes buttons consistent across all sites

Structure

  • Headings - clear & meaningful. represent content
  • lists - fantastic, focus concentration
  • Whitespace - it is structure. Want a separation between headings and paragraphs.
  • Clear differentiation between content types. Make form labels, etc. distinct from regular content

focus###

  • users are task-driven. don't want distractions

Avoid

  • contrasting blocks of color. Don't make navigation bright pink. It's just distracting
  • Don't use auto-playing sounds.
  • Moving content - ads that
  • Pop-ups - this includes lightbox

Readability

  • Adequate text size and line hieght (10px as a minimum, but 11px or 12px )
  • Line height should be 1/2 the size of the text itself.
  • Limited line length. Users with difficulty reading often have trouble reading long lines (80 characters). Avoid "rivers of white" - don't justify text. These can "suck focus into them."
  • Colour contrast
  • Short paragraphs. Each paragraph focused on a single point.

Transformability

  • Users will use
  • Text-resizing
  • Support user styles
  • Page zoom vs. font-resize - each user will determine what they prefer. There is a problem with people knowing they can do these things.
  • Don't set widths in ems. Can't do text resizing without page zoom. Give the user the choice.
  • Work without images or styles. Your site may never be used this way, but your content may be.
  • Provide an API of feed.

Content

  • spelling and grammar can be a major blocker for people who have trouble with reading. Get screen reader to read back what you've just written. Avoids spelling
  • Definitions of terms -- abbreviations acronyms technical terms
  • One subject
  • Summarize - introductory paragraph is useful

Audience comment: Printability

Let's make something

Accessiblity.next example

  • avoid positional language (e.g. "top right"), assumes styles and an understanding of what "right" means

Generated content

  • Content inserted with CSS
  • Not read out by screen-reader software
  • Use on in cases where the content is presentation
  • Use image to show where the search box is (image w/ arrow pointing to the search box)

Icons

  • Do they cause confusion? Needs more research.

Audio and Video

  • Can often help
  • Keep it simple
  • Speak clearly
  • Don't have a beard which makes people not able to read your lips.

Tasks (for preventing spam)

  • 2 + 2 vs. 2 / 2 (if you don't know what "+" or "/" means, these can be confused and have very different results)

  • Don't assume simple tasks are easy

  • Same applies to "what colour is the sky?" - language problems

  • Blog: http://ianpouncey.com

  • Twitter: @IanPouncey