In this presentation, I talked about the need for building software with accessibility in mind. You will also learn the business values accrued to building for all user groups and how to go about it.
mouse • View a screen • See low contrast text • Hear dialogue or music • Understand complex language These people need: • Keyboard support • Screen reader support • High contrast text • Captions and transcripts • Plain language
your site more usable by other groups, such as the • Older people, • People in rural areas, • People in developing countries where the internet might be slow. • People still operating on older browsers, phones etc. SEO Accessible websites improve Search Engine Optimization(SEO), making your site index-able by search engines. Best practice Overall, accessible websites are preferred and inaccessible sites are frowned at everywhere. It’s an edge you’ll have over your peers if you learn accessibility concepts. Empathy The ability to understand and share the feelings of another.
text for non-text based content - Images | Audio | Video A visually impaired person cannot view a picture or video content. Providing a plain text alternative for all functional and informative non-text contents makes it possible for such persons to access the content. 2. Specify the Language of a Page Use the lang attribute to specify the language of a page on the HTML element. Also if the language of an element differs from the rest of the page use the lang attribute to specify the language of that element 3. Use semantic elements Use the right element tag for paragraphs, headings, lists, and tables. Also use semantic elements such as <header>, <nav>, <footer> to structure the layout of your website. 4. Structure elements in a logical reading order Assistive technologies read web contents in the order they appear in the source code. So elements should always be placed in the order it should be read. CSS can always be used to place elements anywhere, but the order in which it appears in the source code should be in the logical reading order. 5. Ensure interactive elements are keyboard accessible Interactive elements such as buttons, links, and form controls are by default keyboard accessible. However other custom built interactive widgets are not accessible via the keyboard. To add keyboard accessibility, use the tabindex="0" attribute on the target element. 6. Avoid using CAPTCHAs for authentication CAPTCHAs can be problematic to some kinds of users. You can opt for alternative methods such as automatic detection or interface interactions to verify that all inputs are generated by a human. 7. Use Linters Linters are tools/plugins that help report bottlenecks and recommend fixes in our codes. Some of them identify accessibility bottlenecks and recommends fixes for developers. Example: eslint-plugin-jsx-a11y
using: 1. Good enough fonts 2. Good contrast colors 3. Big enough buttons 4. Making sure all elements have textual descriptions 5. Everything is navigable and accessible with the keyboard
lost most of its flexibility, and thus we are no longer able to focus on close objects such as our mobile device or the laptop screen ----- Sure, there are optic tools that can help — eye glasses, contacts, and sometimes surgeries — but even then, it is still not as good as it used to be Around 60yrs> our resolution decreases as time goes by no matter what, and this can’t even be fixed with either glasses or surgery. And speaking of receptors, we also need to remember that not everyone has all of them — some people are color blind and can only see certain colors. The point is... so sooner or later, we will all be a part of the target audience for accessibility.
lost most of its flexibility, and thus we are no longer able to focus on close objects such as our mobile device or the laptop screen ----- Sure, there are optic tools that can help — eye glasses, contacts, and sometimes surgeries — but even then, it is still not as good as it used to be Around 60yrs> our resolution decreases as time goes by no matter what, and this can’t even be fixed with either glasses or surgery. And speaking of receptors, we also need to remember that not everyone has all of them — some people are color blind and can only see certain colors. And when that time comes, you will thank yourself for having contributed to making it possible for your future self to access the web !!
kenny_io
mza
marcelosomers
sferik
ammeep
destraynor
addyosmani
akosma
sergeychernyshev
chriscoyier
kevinliebholz
rasmusluckow
