Accessibility 101 - Revision history

Kirabug: Replaced content with "This information has been moved to [https://accessibility.perpendicularangel.com/basic-elements-of-accessibility/accessibility-101/ Accessibility 101] on Perpendicular A..."

2021-09-11T02:01:09Z

Replaced content with "This information has been moved to [https://accessibility.perpendicularangel.com/basic-elements-of-accessibility/accessibility-101/ Accessibility 101] on Perpendicular A..."

← Older revision		Revision as of 19:01, 10 September 2021
Line 1:		Line 1:
	[~~[Category~~: Accessibility]]		This information has been moved to [https://accessibility.perpendicularangel.com/basic-elements-of-accessibility/accessibility-101/ Accessibility 101] on [[Perpendicular Angel]]

	~~These are the things you need to know to get started.~~		[[Category:Accessibility]]

	* [https://www.marcozehe.de/2015/12/14/the-web-accessibility-basics/ The Web Accessibility Basics] by [[Marco Zehe]] on [[Marco's Accessibility Blog]]
	* [https://the-pastry-box-project.net/monika-piotrowicz/2014-April-29# Getting Started with Web Accessibility] by [[Monika Piotrowicz]] at [[The Pastry Box]].
	* Dos and don'ts on designing for accessibility by Karwai Pun on Gov.UK. Includes posters for designing for [[~~Autism \| people on the autism spectrum]], [[:~~Category:Vision issues \| people using screen readers or with low vision]], people with physical or motor disabilities, [Deafness \| people who are deaf or hard of hearing]], and [[Dyslexia \| people with dyslexia]].
	* [https://www.invisionapp.com/blog/designing-for-inclusivity/ Designing for Inclusivity: How and Why to Get Started] by Allison Shaw at the Invision Design Blog
	* [https://exclusive-design.vasilis.nl Exclusive Design] by Vasilis van Gemert is a thesis describing what design would be like if we designed not inclusively, but exclusively for people with disabilities. It's a long read, but covers a lot of ground about our current assumptions.

	[https://medium.com/the-u-s-digital-service/mythbusters-guide-to-accessibility-92ccd88655c6#.b2qtwlpuf Mythbuster's Guide to Accessibility] by the US Digital Service outlines myths about accessibility that affect all technologists:

	* Myth: Government accessibility is harder than it is in the private sector. Reality: Accessibility is the same inside and outside the government.
	* Myth: Accessibility requires very specific implementations. Reality: Content is accessible when it can be used by users with a disability, period. There are many ways to achieve this. Following a particular implementation pattern is not necessary to achieve accessibility.
	* Myth: It's possible to build something that's 100% accessible. Reality: no product is perfect by any metric.
	* Myth: It's easy to treat accessibility as an afterthought. Reality: Designing for accessibility from the beginning is way easier.
	* Myth: Implementing accessibility can only be done by 10x Rockstar Ninja Guru A-Player Front-End Engineers. Reality: Accessibility is straightforward for mid-level developers.
	* Myth: Testing can be done without consulting assistive technologies or users with disabilities. Reality: The only way to ensure that users with a disability get a comparable experience is to test with them and the tools they use.
	~~Myth: Text-only versions of your content are accessible. Reality: "Separate but equal" accommodations are a lose-lose.~~


	~~==Design considerations==~~

	~~[https://www.creativebloq.com/advice/14-easy-ways-to-make-your-website-more-accessible 14 easy ways to make your website more accessible] by Carl Cahill and Joss Cook cover:~~

	~~# Remember alt text~~
	~~# Consider animations carefully~~
	~~# Think about other languages (especially around line heights)~~
	~~# Keep the writing straightforward~~
	~~# Use simple colors and shapes~~
	~~# Empower the user~~
	~~# Offer multiple options~~
	~~# Offer customizations~~
	~~# Think about tab order~~
	~~# Don't forget about bots~~
	~~# Get the right line length and amount of text~~
	~~# Avoid anxiety-inducing prompts~~
	~~# Add in verifications and checks~~
	~~# Confirm the end of a user journey~~

	~~It is not coincidental that these are all usability concerns as well.~~

	~~==Developer considerations==~~

	~~[https://benrobertson.io/accessibility/common-accessibility-mistakes-and-how-to-avoid-them Common~~ Accessibility ~~Mistakes and How To Avoid Them~~] ~~by Ben Robertson outlines four of his own principles for developing accessible websites.~~

	~~# Web Design is more than graphic design~~
	~~# Be ASAP: As Semantic As Possible~~
	~~# Websites should look good naked~~
	~~# Talk to your computer (Use ARIA attributes)~~

	~~It also outlines common accessibility mistakes:~~

	* Missing page titles
	* Poor heading structure
	* Link text should tell where or what a user is clicking on
	* Inputs missing a <label>
	* CSS Grid / Flexbox: visual reordering sets a mismatch between logical ordering and visual ordering
	* Missing or poor alt attributes for images
	* Removing focus outlines
	* Missing keyboard functionality
	* Hiding things the wrong way

	~~[https://alistapart.com/article/paint-the-picture-not-the-frame Paint the Picture, Not the Frame: How Browsers Provide Everything Users Need~~] by Eric Bailey on A List Apart outlines some major browser functionality that is sometimes recreated by developers, such as a scroll-to-top pattern, scrollbar designs, scrolling, highlighting, text resizing, high-contrast themes, moving the focus, the clipboard, and browser history, that really probably shouldn't be messed with unless you're going to be incredibly thorough and consider a wide array of inclusive use cases.

Kirabug at 04:35, 6 May 2020

2020-05-06T04:35:39Z

← Older revision		Revision as of 21:35, 5 May 2020
Line 4:		Line 4:

	* [https://www.marcozehe.de/2015/12/14/the-web-accessibility-basics/ The Web Accessibility Basics] by [[Marco Zehe]] on [[Marco's Accessibility Blog]]		* [https://www.marcozehe.de/2015/12/14/the-web-accessibility-basics/ The Web Accessibility Basics] by [[Marco Zehe]] on [[Marco's Accessibility Blog]]
	* [https://the-pastry-box-project.net/monika-piotrowicz/2014-April-29# Getting Started with Web Accessibility] by Monika Piotrowicz at The Pastry Box.		* [https://the-pastry-box-project.net/monika-piotrowicz/2014-April-29# Getting Started with Web Accessibility] by [[Monika Piotrowicz]] at [[The Pastry Box]].
	* Dos and don'ts on designing for accessibility by Karwai Pun on Gov.UK. Includes posters for designing for [[Autism \| people on the autism spectrum]], [[:Category:Vision issues \| people using screen readers or with low vision]], people with physical or motor disabilities, [Deafness \| people who are deaf or hard of hearing]], and [[Dyslexia \| people with dyslexia]].		* Dos and don'ts on designing for accessibility by Karwai Pun on Gov.UK. Includes posters for designing for [[Autism \| people on the autism spectrum]], [[:Category:Vision issues \| people using screen readers or with low vision]], people with physical or motor disabilities, [Deafness \| people who are deaf or hard of hearing]], and [[Dyslexia \| people with dyslexia]].
	* [https://www.invisionapp.com/blog/designing-for-inclusivity/ Designing for Inclusivity: How and Why to Get Started] by Allison Shaw at the Invision Design Blog		* [https://www.invisionapp.com/blog/designing-for-inclusivity/ Designing for Inclusivity: How and Why to Get Started] by Allison Shaw at the Invision Design Blog

Kirabug at 04:18, 6 May 2020

2020-05-06T04:18:46Z

← Older revision		Revision as of 21:18, 5 May 2020
Line 3:		Line 3:
	These are the things you need to know to get started.		These are the things you need to know to get started.

	* [https://www.marcozehe.de/2015/12/14/the-web-accessibility-basics/~~?utm_content=buffer40247&utm_medium=social&utm_source=twitter.com&utm_campaign=buffer~~ The Web Accessibility Basics] by Marco's Accessibility Blog		* [https://www.marcozehe.de/2015/12/14/the-web-accessibility-basics/ The Web Accessibility Basics] by [[Marco Zehe]] on [[Marco's Accessibility Blog]]
	* [https://the-pastry-box-project.net/monika-piotrowicz/2014-April-29# Getting Started with Web Accessibility] by Monika Piotrowicz at The Pastry Box.		* [https://the-pastry-box-project.net/monika-piotrowicz/2014-April-29# Getting Started with Web Accessibility] by Monika Piotrowicz at The Pastry Box.
	* Dos and don'ts on designing for accessibility by Karwai Pun on Gov.UK. Includes posters for designing for [[Autism \| people on the autism spectrum]], [[:Category:Vision issues \| people using screen readers or with low vision]], people with physical or motor disabilities, [Deafness \| people who are deaf or hard of hearing]], and [[Dyslexia \| people with dyslexia]].		* Dos and don'ts on designing for accessibility by Karwai Pun on Gov.UK. Includes posters for designing for [[Autism \| people on the autism spectrum]], [[:Category:Vision issues \| people using screen readers or with low vision]], people with physical or motor disabilities, [Deafness \| people who are deaf or hard of hearing]], and [[Dyslexia \| people with dyslexia]].

Kirabug at 19:45, 28 December 2019

2019-12-28T19:45:09Z

@@ Line 8: / Line 8: @@
 * [https://www.invisionapp.com/blog/designing-for-inclusivity/ Designing for Inclusivity: How and Why to Get Started] by Allison Shaw at the Invision Design Blog
 * [https://exclusive-design.vasilis.nl Exclusive Design] by Vasilis van Gemert is a thesis describing what design would be like if we designed not inclusively, but exclusively for people with disabilities. It's a long read, but covers a lot of ground about our current assumptions.
 ==Design considerations==

Kirabug at 17:20, 13 February 2019

2019-02-13T17:20:08Z

← Older revision		Revision as of 10:20, 13 February 2019
Line 7:		Line 7:
	* Dos and don'ts on designing for accessibility by Karwai Pun on Gov.UK. Includes posters for designing for [[Autism \| people on the autism spectrum]], [[:Category:Vision issues \| people using screen readers or with low vision]], people with physical or motor disabilities, [Deafness \| people who are deaf or hard of hearing]], and [[Dyslexia \| people with dyslexia]].		* Dos and don'ts on designing for accessibility by Karwai Pun on Gov.UK. Includes posters for designing for [[Autism \| people on the autism spectrum]], [[:Category:Vision issues \| people using screen readers or with low vision]], people with physical or motor disabilities, [Deafness \| people who are deaf or hard of hearing]], and [[Dyslexia \| people with dyslexia]].
	* [https://www.invisionapp.com/blog/designing-for-inclusivity/ Designing for Inclusivity: How and Why to Get Started] by Allison Shaw at the Invision Design Blog		* [https://www.invisionapp.com/blog/designing-for-inclusivity/ Designing for Inclusivity: How and Why to Get Started] by Allison Shaw at the Invision Design Blog
			* [https://exclusive-design.vasilis.nl Exclusive Design] by Vasilis van Gemert is a thesis describing what design would be like if we designed not inclusively, but exclusively for people with disabilities. It's a long read, but covers a lot of ground about our current assumptions.

	==Design considerations==		==Design considerations==

Kirabug at 22:19, 11 February 2019

2019-02-11T22:19:06Z

← Older revision		Revision as of 15:19, 11 February 2019
Line 1:		Line 1:
			[[Category: Accessibility]]

	These are the things you need to know to get started.		These are the things you need to know to get started.

Kirabug: Created page with "These are the things you need to know to get started. * [https://www.marcozehe.de/2015/12/14/the-web-accessibility-basics/?utm_content=buffer40247&utm_medium=social&utm_sour..."

2019-02-11T22:18:46Z

Created page with "These are the things you need to know to get started. * [https://www.marcozehe.de/2015/12/14/the-web-accessibility-basics/?utm_content=buffer40247&utm_medium=social&utm_sour..."

New page

These are the things you need to know to get started.

* [https://www.marcozehe.de/2015/12/14/the-web-accessibility-basics/?utm_content=buffer40247&utm_medium=social&utm_source=twitter.com&utm_campaign=buffer The Web Accessibility Basics] by Marco's Accessibility Blog
* [https://the-pastry-box-project.net/monika-piotrowicz/2014-April-29# Getting Started with Web Accessibility] by Monika Piotrowicz at The Pastry Box.
* Dos and don'ts on designing for accessibility by Karwai Pun on Gov.UK. Includes posters for designing for [[Autism | people on the autism spectrum]], [[:Category:Vision issues | people using screen readers or with low vision]], people with physical or motor disabilities, [Deafness | people who are deaf or hard of hearing]], and [[Dyslexia | people with dyslexia]].
* [https://www.invisionapp.com/blog/designing-for-inclusivity/ Designing for Inclusivity: How and Why to Get Started] by Allison Shaw at the Invision Design Blog

==Design considerations==

[https://www.creativebloq.com/advice/14-easy-ways-to-make-your-website-more-accessible 14 easy ways to make your website more accessible] by Carl Cahill and Joss Cook cover:

# Remember alt text
# Consider animations carefully
# Think about other languages (especially around line heights)
# Keep the writing straightforward
# Use simple colors and shapes
# Empower the user
# Offer multiple options
# Offer customizations
# Think about tab order
# Don't forget about bots
# Get the right line length and amount of text
# Avoid anxiety-inducing prompts
# Add in verifications and checks
# Confirm the end of a user journey

It is not coincidental that these are all usability concerns as well.

==Developer considerations==

[https://benrobertson.io/accessibility/common-accessibility-mistakes-and-how-to-avoid-them Common Accessibility Mistakes and How To Avoid Them] by Ben Robertson outlines four of his own principles for developing accessible websites.

# Web Design is more than graphic design
# Be ASAP: As Semantic As Possible
# Websites should look good naked
# Talk to your computer (Use ARIA attributes)

It also outlines common accessibility mistakes:

* Missing page titles
* Poor heading structure
* Link text should tell where or what a user is clicking on
* Inputs missing a <label>
* CSS Grid / Flexbox: visual reordering sets a mismatch between logical ordering and visual ordering
* Missing or poor alt attributes for images
* Removing focus outlines
* Missing keyboard functionality
* Hiding things the wrong way

[https://alistapart.com/article/paint-the-picture-not-the-frame Paint the Picture, Not the Frame: How Browsers Provide Everything Users Need] by Eric Bailey on A List Apart outlines some major browser functionality that is sometimes recreated by developers, such as a scroll-to-top pattern, scrollbar designs, scrolling, highlighting, text resizing, high-contrast themes, moving the focus, the clipboard, and browser history, that really probably shouldn't be messed with unless you're going to be incredibly thorough and consider a wide array of inclusive use cases.