Successfully reported this slideshow.
Your SlideShare is downloading. ×

Web Accessibility & It's Guidelines.pptx

Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Loading in …3
×

Check these out next

1 of 38 Ad

Web Accessibility & It's Guidelines.pptx

Download to read offline

Web accessibility is about creating web content, design, and tools that can be used by everyone regardless of ability. Web accessibility is the need for websites to utilize tools and technologies developed to aid the perception, understanding, contribution, navigation, and interaction of a person with disabilities on the site. Integrating accessibility can seem intimidating to those that are just getting acquainted with it, but it is a vital element of user experience. Accessibility should be built into the web development and design process, rather than trying to retrofit it as an afterthought.

Web accessibility is about creating web content, design, and tools that can be used by everyone regardless of ability. Web accessibility is the need for websites to utilize tools and technologies developed to aid the perception, understanding, contribution, navigation, and interaction of a person with disabilities on the site. Integrating accessibility can seem intimidating to those that are just getting acquainted with it, but it is a vital element of user experience. Accessibility should be built into the web development and design process, rather than trying to retrofit it as an afterthought.

Advertisement
Advertisement

More Related Content

Similar to Web Accessibility & It's Guidelines.pptx (20)

Recently uploaded (20)

Advertisement

Web Accessibility & It's Guidelines.pptx

  1. 1. Table of Content • What is web accessibility? • Why is it important? • Who is affected by poor accessibility? • How can accessibility be improved? • When to think about accessibility?
  2. 2. What is Web Accessibility?
  3. 3. What is Web Accessibility?
  4. 4. • Differently abled person can use the web equally. What is Web Accessibility?
  5. 5. • Differently abled person can use the web equally. • The web is for many people an essential part of daily life. What is Web Accessibility?
  6. 6. • Differently abled person can use the web equally. • The web is for many people an essential part of daily life. • At work What is Web Accessibility?
  7. 7. • Differently abled person can use the web equally. • The web is for many people an essential part of daily life. • At Home What is Web Accessibility?
  8. 8. • Differently abled person can use the web equally. • The web is for many people an essential part of daily life. • And on the road. What is Web Accessibility?
  9. 9. • Differently abled person can use the web equally. • The web is for many people an essential part of daily life. • It refers to the inclusive practice of removing barriers that prevent interaction with, or access to, website by people with limited abilities. What is Web Accessibility?
  10. 10. "We need to make every single things accessible to every single person with disabilities. " - Stevie Wonder What is Web Accessibility?
  11. 11. Why is Accessibility Important? What’s accessibility all about?
  12. 12. • The web is the world's preferred channel for: • Knowledge • Social Interaction • Commerce • But it's not always easy for: • Differently-abled persons • Those who are getting older • And for everyone ... • Accessibility can increase the profitability of a website. • Accessibility is a legal requirement. [CDDO UK 2018] Why is Accessibility Important?
  13. 13. Lee, Online shopper with color blindness • Common visual disabilities that affect men: red and green color blindness • When red and green color combinations are used, Lee cannot distinguish between the two, since both look brown to him • It is also very difficult for him to make product choices when color swatches are not labeled with the name of the color Source: https://www.healthline.com/health/color-blindness#symptoms Source: https://www.w3.org/WAI/people-use-web/user-stories/#shopper Why is Accessibility Important? Story of a Web User
  14. 14. Source: https://www.globaldownsyndrome.org/about-down-syndrome/misconceptions-vs-reality/ Why is Accessibility Important? Story of a Web User Luis, with Down syndrome • Difficulty with abstract concepts, reading, and math calculations. • Went to groceries, he is sometimes confused by the large number of product choices and sometimes has problem finding his favorite items when the store layout is change. • Recently, a friend showed him an app for online grocery purchases that has consistent, easy-to-use navigation with clear and direct instructions • Luis now uses the shopping app a couple of times a month for frequently purchased items and buys a few fresh items regularly from the store.
  15. 15. Who is Affected by Poor Accessibility? More People than you think.
  16. 16. Can your website be used by people with common disabilities? • Blindness • Visual impairments • Deafness • Hearing impairments • Motor impairment • Cognitive disability
  17. 17. How different people can access web? A person with complete visual impairment: • You can't see images, photos, graphics or videos • You probably use a screen reader to listen to web pages • You may use the Tab key to jump from link to link • You probably don't use mouse A person with partial visual impairment: • You may use a screen enlarger to view website
  18. 18. How different people can access web? A person with complete/partial hearing impairment: • You may use assistive technology to convert audio into text A person with motor disabilities: • You may not be able to use a mouse • You may rely on voice activated software
  19. 19. Myth – 1: Only a small percentage of the global population has disability. It's just for a minority of people !? • CDC estimates that 26% of US adults are living with a certain disability. • 12 million people in UK have a recognized disability. • 1 in 5 Americans have difficulty performing functional or participatory activities (US Census) • 15% of the global population report challenges in dealing with basic daily tasks and interactions (WHO) • > 30% of us will have some form of disabilities by the time we retire (StatsCan)
  20. 20. Myth – 2: It's too expensive – not enough ROI(Return on Investment) • PWD(People with disabilities) represent a market worth £80bn per year in the UK approx. £320bn across EU(European Union). • Google increased 30% of traffic after they introduce translation feature. • 83% of disabled people will not return to a business that does not meet their access needs. • If a company’s website is harder to use , people will visit a competitor's site which is easier to use. • Tesco – In 2001 an accessible version of their shopping site was launched at a cost £35K and yielded £13M turnover a year. Source: https://www.slideshare.net/coolfields/beginners-guidetowebaccessibilitywpuk2013v1
  21. 21. Myth – 3: Yes, but my site is not meant for the blind/deaf/motor impaired • People don't always browse/buy just for themselves • You can't make assumption about people • Studies in US show that friends and family of PWD will also avoid inaccessible sites • Think about your site's reputation amongst friends and family of PWD(People with disabilities) Source: https://www.slideshare.net/coolfields/beginners-guidetowebaccessibilitywpuk2013v1
  22. 22. Myth – 4: If I ignore it, it'll go away • We are all getting older • One in four will be over 65 by 2061 • How are you going to use webapps that you build now after 30/40/50 years back? Source: https://www.slideshare.net/coolfields/beginners-guidetowebaccessibilitywpuk2013v1
  23. 23. How Can Accessibility be Improved? It's not rocket science.
  24. 24. Some Example: Remember lee, Source: https://www.healthline.com/health/color-blindness#symptoms
  25. 25. Lee, online shopper with color blindness Fig: Color swatches without label Some Example:
  26. 26. Fig: Color swatches without label Fig: Color swatches with label Some Example: Lee, online shopper with color blindness
  27. 27. Simple things we can do Few websites are totally impossible for those with impairments to use.
  28. 28. Images –correct use of alternate text (alt attribute) • Describe what image shows or what it represents. • If a link, describe destination. • If decorative, leave blank (alt = "").
  29. 29. Links - Fig: Link list from JAWA screen reader • Ensure that destination is clear from the link: My Blog Post: Read more Rather than My Blog Post: Read more • Don’t just use click here • If link opens new tab or window inform the user.
  30. 30. Use heading properly ● Semantic elements ● Often used as navigation mechanism by screen reader user ● Signpost content Fig: Heading list from JAWA screen reader
  31. 31. Keyboard focus and operation • Focus should be easily visible • Tab order should make sense • Ensure all functionality accessible by keystrokes
  32. 32. • Good color contrast • Should allow itself to be resized without breaking layout(initially) • Use of color alone to convey meaning Text
  33. 33. Markup forms correctly • Use labels for input fields • Field set for grouping controls • Clear display of errors and use text • Don't use harder CAPTCHAs
  34. 34. WAI-ARIA (Web Accessibility Initiative – Accessible Rich Internet Applications ) • Roles and Landmarks help signpost parts of web pages • Live regions of dynamic content • More advance roles for ajax sites and apps- including mobile apps. Fig: Button element without wai-aria
  35. 35. • Roles and Landmarks help signpost parts of web pages • Live regions of dynamic content • More advance roles for ajax sites and apps- including mobile apps Fig: Button element without wai-aria Fig: Button element with wai-aria WAI-ARIA (Web Accessibility Initiative – Accessible Rich Internet Applications )
  36. 36. When Should I Think About Accessibility? Think of it as another requirements – one which may not be explicitly asked for.
  37. 37. Implementing accessibility "Our small step leads to big changes in someone's life."

×