Media is too big
VIEW IN TELEGRAM
23. List Reordering Exercise
Marcy demonstrates how to implement keyboard accessibility for a list reordering exercise. They show how to add keyboard event handlers to allow users to reorder items in the list using the arrow keys. They also discuss the importance of accessibility on mobile devices and provide tips for making touch targets larger and more accessible.
- https://enterprise-accessibility.vercel.app/topics/a11y-in-js-apps/exercise-4
#lesson
Marcy demonstrates how to implement keyboard accessibility for a list reordering exercise. They show how to add keyboard event handlers to allow users to reorder items in the list using the arrow keys. They also discuss the importance of accessibility on mobile devices and provide tips for making touch targets larger and more accessible.
- https://enterprise-accessibility.vercel.app/topics/a11y-in-js-apps/exercise-4
#lesson
Media is too big
VIEW IN TELEGRAM
24. Test Automation Guidelines
Marcy discusses the importance of automation in testing for accessibility in software development. They explain that while automation can help with certain aspects of testing, there are still limitations and the need for manual testing. The instructor also provides examples of what can be automated and what still requires manual testing in terms of accessibility. They emphasize the importance of creating your own test coverage and ensuring that automated tests align with real browser behavior.
- https://enterprise-accessibility.vercel.app/topics/test-automation/how-guidelines-fit
#lesson
Marcy discusses the importance of automation in testing for accessibility in software development. They explain that while automation can help with certain aspects of testing, there are still limitations and the need for manual testing. The instructor also provides examples of what can be automated and what still requires manual testing in terms of accessibility. They emphasize the importance of creating your own test coverage and ensuring that automated tests align with real browser behavior.
- https://enterprise-accessibility.vercel.app/topics/test-automation/how-guidelines-fit
#lesson
Media is too big
VIEW IN TELEGRAM
25. Testing Approaches
Marcy discusses different approaches to testing and various testing tools that can be used. They emphasize the importance of finding the right tools for the job and using whatever helps make testing easier and more efficient. The instructor also mentions specific tools like eslint, axe-linter, Jest, testing library, Cypress, Storybook, and Playwright, and provides insights on how to configure these tools for accessibility testing. They also mention the integration testing and end-to-end testing, and highlight the benefits of using snapshot tests for accessibility and visual testing.
#lesson
Marcy discusses different approaches to testing and various testing tools that can be used. They emphasize the importance of finding the right tools for the job and using whatever helps make testing easier and more efficient. The instructor also mentions specific tools like eslint, axe-linter, Jest, testing library, Cypress, Storybook, and Playwright, and provides insights on how to configure these tools for accessibility testing. They also mention the integration testing and end-to-end testing, and highlight the benefits of using snapshot tests for accessibility and visual testing.
#lesson
Media is too big
VIEW IN TELEGRAM
26. Continuous Integration & Accessibility Test API
Marcy discusses continuous integration (CI) and its importance in software development. They explain that CI involves merging code into a central repository and running automated tests to ensure that the code doesn't break anything. The instructor also mentions different tools and platforms that can be used for CI, and they touch on the topic of flaky tests and how to handle them. Additionally, they introduce the concept of using accessibility testing APIs like axe-core to automate accessibility testing in CI environments.
#lesson
Marcy discusses continuous integration (CI) and its importance in software development. They explain that CI involves merging code into a central repository and running automated tests to ensure that the code doesn't break anything. The instructor also mentions different tools and platforms that can be used for CI, and they touch on the topic of flaky tests and how to handle them. Additionally, they introduce the concept of using accessibility testing APIs like axe-core to automate accessibility testing in CI environments.
#lesson
Media is too big
VIEW IN TELEGRAM
27. Accessibility Testing Exercise
Marcy discusses writing tests for a component in an insurance portal. They explain the importance of writing tests when fixing bugs and how it helps prevent future issues. The instructor demonstrates writing tests using Jest and Testing Library, focusing on keyboard support and link navigation. They also mention the limitations of Jest and suggest using other testing tools like Cypress for certain scenarios.
- https://enterprise-accessibility.vercel.app/topics/test-automation/exercise-5
#lesson
Marcy discusses writing tests for a component in an insurance portal. They explain the importance of writing tests when fixing bugs and how it helps prevent future issues. The instructor demonstrates writing tests using Jest and Testing Library, focusing on keyboard support and link navigation. They also mention the limitations of Jest and suggest using other testing tools like Cypress for certain scenarios.
- https://enterprise-accessibility.vercel.app/topics/test-automation/exercise-5
#lesson
Media is too big
VIEW IN TELEGRAM
28. Creating a Culture of Accessibility
Marcy discusses the importance of considering factors beyond code and assertions in software testing. They emphasize the need to work together as a team and provide clear instructions for reproducing issues or testing steps. The lesson also highlights the importance of building institutional knowledge and creating a culture of accessibility within an organization. The speaker provides tips for promoting accessibility awareness and involving everyone in the process.
- https://enterprise-accessibility.vercel.app/topics/org-skill-building/tips-for-building-knowledge
#lesson
Marcy discusses the importance of considering factors beyond code and assertions in software testing. They emphasize the need to work together as a team and provide clear instructions for reproducing issues or testing steps. The lesson also highlights the importance of building institutional knowledge and creating a culture of accessibility within an organization. The speaker provides tips for promoting accessibility awareness and involving everyone in the process.
- https://enterprise-accessibility.vercel.app/topics/org-skill-building/tips-for-building-knowledge
#lesson
Media is too big
VIEW IN TELEGRAM
29. Larger Codebases
Marcy discusses how to navigate and contribute to large code bases, particularly in an enterprise or larger engineering team context. They provide practical tips such as using core components, observing conventions, suggesting accessible improvements, testing accessibility, and gathering information from code authors. The lesson emphasizes the importance of consistency, documentation, and communication when working with large code bases.
#lesson
Marcy discusses how to navigate and contribute to large code bases, particularly in an enterprise or larger engineering team context. They provide practical tips such as using core components, observing conventions, suggesting accessible improvements, testing accessibility, and gathering information from code authors. The lesson emphasizes the importance of consistency, documentation, and communication when working with large code bases.
#lesson
Media is too big
VIEW IN TELEGRAM
30. Inclusive Hiring & Workplace
Marcy discusses the importance of inclusive hiring in workplaces and the need to involve people with disabilities in the development process. They highlight the barriers that people with disabilities face in accessing job opportunities and emphasize the importance of true inclusion and civil rights. The instructor also encourages learners to listen to the experiences and frustrations of people with disabilities, particularly on disability Twitter, to gain insights and improve accessibility.
#lesson
Marcy discusses the importance of inclusive hiring in workplaces and the need to involve people with disabilities in the development process. They highlight the barriers that people with disabilities face in accessing job opportunities and emphasize the importance of true inclusion and civil rights. The instructor also encourages learners to listen to the experiences and frustrations of people with disabilities, particularly on disability Twitter, to gain insights and improve accessibility.
#lesson
Media is too big
VIEW IN TELEGRAM
31. Prioritizing Accessibility & Discussion
Marcy discusses the importance of making accessibility a requirement and part of the regular workflow. They emphasize the need to include accessibility in tickets, stories, and issues, and to ensure that team members in various roles are on board. The instructor also suggests ways to make accessibility a reality, such as building it into automated tests, performance reviews, and interviews.
#lesson
Marcy discusses the importance of making accessibility a requirement and part of the regular workflow. They emphasize the need to include accessibility in tickets, stories, and issues, and to ensure that team members in various roles are on board. The instructor also suggests ways to make accessibility a reality, such as building it into automated tests, performance reviews, and interviews.
#lesson
Media is too big
VIEW IN TELEGRAM
32. Wrapping Up
Marcy wraps up the topic of accessibility by discussing its importance in organizations. They pose questions for the learners to consider, such as who needs to be convinced to prioritize accessibility and how to scope and prioritize feedback to increase the chances of getting approval. The instructor also shares examples and experiences related to accessibility challenges and successes. The lesson concludes with the instructor expressing gratitude to the learners for their participation and encouraging them to continue making a difference in accessibility.
#lesson
Marcy wraps up the topic of accessibility by discussing its importance in organizations. They pose questions for the learners to consider, such as who needs to be convinced to prioritize accessibility and how to scope and prioritize feedback to increase the chances of getting approval. The instructor also shares examples and experiences related to accessibility challenges and successes. The lesson concludes with the instructor expressing gratitude to the learners for their participation and encouraging them to continue making a difference in accessibility.
#lesson
Title: Web App Accessibility (feat. React)
Description: Elevate your React projects by integrating accessibility standards and practices. Gain expertise in WCAG, ARIA, screen readers, semantic HTML, and accessibility testing to create inclusive and compliant web applications.
Link: https://frontendmasters.com/courses/react-accessibility/
Time: 5 hours, 19 minutes
Lessons: 29 / 29
Tags: #course #frontendmasters #720p
Description: Elevate your React projects by integrating accessibility standards and practices. Gain expertise in WCAG, ARIA, screen readers, semantic HTML, and accessibility testing to create inclusive and compliant web applications.
Link: https://frontendmasters.com/courses/react-accessibility/
Time: 5 hours, 19 minutes
Lessons: 29 / 29
Tags: #course #frontendmasters #720p
Frontendmasters
Advance Your Skills in React Web Accessibility | Boost Inclusivity and Compliance
Elevate your React projects by integrating accessibility standards and practices. Gain expertise in WCAG, ARIA, screen readers, semantic HTML, and accessibility testing to create inclusive and compliant web applications.
Media is too big
VIEW IN TELEGRAM
1. Introduction
Marcy Sutton Todd begins the course by sharing how she became interested in accessibility. She discusses areas of accessibility and the cost of having inaccessible content. A core principle of accessibility is ensuring all people, regardless of ability, can interact with the information or services provided by a website.
- https://github.com/marcysutton/frontend-masters-web-accessibility-v3
- https://web-accessibility-v3.vercel.app/topics
#lesson
Marcy Sutton Todd begins the course by sharing how she became interested in accessibility. She discusses areas of accessibility and the cost of having inaccessible content. A core principle of accessibility is ensuring all people, regardless of ability, can interact with the information or services provided by a website.
- https://github.com/marcysutton/frontend-masters-web-accessibility-v3
- https://web-accessibility-v3.vercel.app/topics
#lesson
Media is too big
VIEW IN TELEGRAM
2. Benefits of Accessibility
Marcy describes the benefits of accessible websites like SEO, performance, and business growth. She also spends a few minutes myth-busting some common accessibility misconceptions and discusses privacy issues related to screen readers.
#lesson
Marcy describes the benefits of accessible websites like SEO, performance, and business growth. She also spends a few minutes myth-busting some common accessibility misconceptions and discusses privacy issues related to screen readers.
#lesson
Media is too big
VIEW IN TELEGRAM
3. Accessibility Standards & Definitions
Marcy introduces the Web Content Accessibility Guidelines (WCAG), a standard criteria for measuring accessibility. Accessible Rich Internet Applications (ARIA) is another standard containing roles, states, and properties to apply in your HTML markup to supply accessible information.
#lesson
Marcy introduces the Web Content Accessibility Guidelines (WCAG), a standard criteria for measuring accessibility. Accessible Rich Internet Applications (ARIA) is another standard containing roles, states, and properties to apply in your HTML markup to supply accessible information.
#lesson
Media is too big
VIEW IN TELEGRAM
4. Screen Readers
Marcy describes how screen readers work and talks through the APIs platforms provide for screen reader integration. The steps for enabling the built-in screen readers for MacOS, iOS, Windows, and Android are also shared in this lesson.
#lesson
Marcy describes how screen readers work and talks through the APIs platforms provide for screen reader integration. The steps for enabling the built-in screen readers for MacOS, iOS, Windows, and Android are also shared in this lesson.
#lesson
Media is too big
VIEW IN TELEGRAM
5. Alternative Text
Marcy explains the importance of alternative text (alt text), which describes the appearance or function of an image on a page. Alt text is also displayed on the page if the image fails to load. If an image is decorative or doesn't add important context to the page, an empty alt attribute can be included to tell screen readers to ignore the image.
#lesson
Marcy explains the importance of alternative text (alt text), which describes the appearance or function of an image on a page. Alt text is also displayed on the page if the image fails to load. If an image is decorative or doesn't add important context to the page, an empty alt attribute can be included to tell screen readers to ignore the image.
#lesson
Media is too big
VIEW IN TELEGRAM
6. Assistive Technologies
Marcy introduces additional assistive technologies like Braille displays, speech recognition, voice control, switch devices, screen magnification, and transcripts. Understanding how individuals experience a website helps engineers build more accessible content.
#lesson
Marcy introduces additional assistive technologies like Braille displays, speech recognition, voice control, switch devices, screen magnification, and transcripts. Understanding how individuals experience a website helps engineers build more accessible content.
#lesson
Media is too big
VIEW IN TELEGRAM
7. Screen Reader Exercise
Student are instructed to navigate through a web page using a screen reader.
- https://web-accessibility-v3.vercel.app/topics/screen-readers/exercise-1
#lesson
Student are instructed to navigate through a web page using a screen reader.
- https://web-accessibility-v3.vercel.app/topics/screen-readers/exercise-1
#lesson