Your SlideShare is downloading. ×
Inclusive and accessible mobile
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Inclusive and accessible mobile

2,858
views

Published on

An introduction to mobile accessibility for Mobile Monday, June 11, 2012

An introduction to mobile accessibility for Mobile Monday, June 11, 2012

Published in: Technology, Design

1 Comment
2 Likes
Statistics
Notes
No Downloads
Views
Total Views
2,858
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
17
Comments
1
Likes
2
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Inclusive  and  Accessible  Mobile   #MobA11y  Henny  Swan  Senior  Usability  and  Accessibility  Specialist,  BBC  henny@iheni.com  
  • 2. Mobile  and   Diverse  user  model,  age,  technology,  accessibility   temporary   Mobile  is  by  defini9on  disabling   Mobile  is  by  defini9on  enabling   USA  21st  Century  Communica9ons  and   Video  Act  ‘There  are  62  million  poten9ally  disabled  users  in  the  UK’    Gareth  Ford  Williams,  BBC  
  • 3. Mobile  Accessibility  Guidelines  &   techniques   Coming  soon  
  • 4. 1.  Support  device  capabiliEes   Content   must  not  break  device  accessibility   Web  and  plaKorm  specific  controls   should  be  used  as  intended   Accessibility  features  must  be   implemented  in  a  way  that  is  not   mutually  exclusive   Device  specific  guidelines  should  be   followed   Device  capability  
  • 5. 2.  AlternaEves   Provide  alterna9ves  for  content  and   func9onality:   HTML:  alt=“Description”! iOS:  labels,  hints and  traits! Android:  android:contentDescription! Hide  non  content  and  func9onality   objects:   HTML:  alt=“”! iOS  do  not  ‘Enable  Accessibility’     Android  do  not  make  focusable  via   android:focusable ! Provide  appropriate  editorial   Alterna9ves  
  • 6. 3.  NavigaEon   Provide  consistent,  recognisable   naviga9on   Group  related  links:     Tabindex=“-1”not  supported   a  single  link  ahref  is  supported   Remove  skip  links  on  touch  and  mobile   Links  
  • 7. Provide  a   logical  focus  order  and  content  order  4.  Structure     Use  headings  (H1  to  H6),  WAI  ARIA   Landmarks,  HTML5  sec9oning  elements   ‘Accordion’  structure  from  desktop  to   mobile   Structure  
  • 8. Desktop   www.smashingmagazine.com   Structure  
  • 9. Main  naviga9on  packed  away   Mobile   Banner,  naviga9on   landmarks  can  be   removed  Heading  structure  collapsed   Structure  
  • 10. 5.  Touch   Visual  cues  to  help  users  navigate  BBC  iPhone  app  for  iPlayer   Audible  cues  for  voice  output  users   ‘BBC  Two   No9fy  screen  readers  of  changes  to   layout   Provide  enough  ‘read-­‐tap  symmetry’   Touch  targets  should  be  large  enough   Touch  
  • 11. Talk  is  cheap  Screen  reader  tes9ng  on  mobile  
  • 12. There  is  no  subs9tute  for  tes9ng  with  users  with  disabili9es  on  mobile  
  • 13. Thank  you  henny@iheni.com