Practical Accessibility (A11y)

•

1 recomendación•125 vistas

There are a lot of talks about why it’s important to make your app accessible to non-sighted users and others, but it’s hard to know how to get started. This talk walks through how to read the official web accessibility standards, three automated tools that can help, and two manual testing approaches you can take. It should equip you to make major strides toward accessibility.

Software

Accessibility: A Practical
Getting-Started Guide
Josh Justice
ReactATL July 21, 2020
1 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

Accessibility (A11y)
…the practice of making your websites usable by as many people as
possible. We traditionally think of this as being about people with
disabilities, but the practice of making sites accessible also benefits
other groups such as those using mobile devices, or those with slow
network connections.
https://developer.mozilla.org/en-US/docs/Learn/Accessibility/
What_is_accessibility
2 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

3 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

A11y:
A lot to learn.
Hard to know how to
get started.
4 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

Purpose:
To give you what you need to
get started improving the
a11y of your app.
5 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

About Me
Josh Justice
Twitter: @CodingItWrong
Email: jjustice@bignerdranch.com
6 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

7 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

Outside-In Frontend
Development
https://outsidein.dev
8 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21,
2020 - @codingitwrong

Caveat: I'm an a11y
beginner.
9 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

A11y: Three Steps
1. Read background information.
2. Run automated tools.
3. Manually test.
10 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

A11y: Three Steps
1. Read background information.
2. Run automated tools.
3. Manually test.
11 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

https://reactjs.org/docs/accessibility.html
12 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

• Start with docs if you like to read the instructions, or want the big
picture.
• Start with automated tools if you like to dive right in, and learn just-
in-time.
13 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

A11y: Three Steps
1. Read background information.
2. Run automated tools.
3. Manually test.
14 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

2. Run automated a11y
tools.
• eslint-react-jsx-a11y
• react-axe
• Siteimprove Accessibility Checker
15 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

2. Run automated a11y
tools.
• eslint-react-jsx-a11y
• react-axe
• Siteimprove Accessibility Checker
16 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

eslint-react-jsx-a11y
https://www.npmjs.com/package/eslint-plugin-jsx-a11y
• Runs as part of your ESLint setup
• Some rules enabled by default in Create React App apps
• Warnings in editor
• A lot it can't catch
17 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

eslint-react-jsx-a11y
DEMO
18 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

2. Run automated a11y
tools.
• eslint-react-jsx-a11y
• react-axe
• Siteimprove Accessibility Checker
19 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

react-axe
https://www.npmjs.com/package/react-axe
• axe is general accessibility tools
• react-axe hooks in to React (dev environment only)
• Warnings in browser web console
20 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

react-axe
DEMO
21 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

2. Run automated a11y
tools.
• eslint-react-jsx-a11y
• react-axe
• Siteimprove Accessibility Checker
22 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

Siteimprove Accessibility
Checker
https://bit.ly/siteimprove-ext
• Chrome extension
• Run it on-request on a page
23 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

Siteimprove Accessibility
Checker
DEMO
24 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

2. Run automated a11y
tools.
• eslint-react-jsx-a11y
• react-axe
• Siteimprove Accessibility Checker
25 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

A11y: Three Steps
1. Read background information.
2. Run automated tools.
3. Manually test.
26 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

3. Manually test.
• Keyboard-only usage
• VoiceOver
27 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

3. Manually test.
• Keyboard-only usage
• VoiceOver
28 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

Keyboard-Only Usage
• Visible focus indicators
• Tab order
29 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

Keyboard-Only Usage
DEMO
30 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

3. Manually test.
• Keyboard-only usage
• VoiceOver
31 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

VoiceOver
• A macOS and iOS screen reader technology.
• Shows you how non-sighted users experience your app.
32 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

33 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

34 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

35 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

VoiceOver
DEMO
36 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

VoiceOver
https://www.apple.com/voiceover/info/guide/_1121.html
37 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

3. Manually test.
• Keyboard-only usage
• VoiceOver
38 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

A11y: Three Steps
1. Read background information.
2. Run automated tools.
3. Manually test.
39 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

40 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

Questions?
41 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

Thanks!
@codingitwrong
me@codingitwrong.com
Links:
- React Accessibility
- eslint-react-jsx-a11y
- react-axe
- SiteImprove Accessibility Checker
- VoiceOver
42 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

Más contenido relacionado

Similar a Practical Accessibility (A11y)

AT&T Mobile App & IoT Hackathon @ Catalyst

Ed Donahue

IdeaSpace-DLSU Presentation

SMART DevNet

IRJET- Socially Smart an Aggregation System for Social Media using Web Sc...

IRJET Journal

OSDC - Open and Accessible

Christian Heilmann

Rebooting the EU App Economy / Fraunhofer HHI, Berlin, Germany / 13th November 2013 Dimitris Michalakos, Web Technology Lead, VisionMobile "How Can Web Devs Reach the Mobile Market?" Dimitris Michalakos is the web technology lead at VisionMobile. At VisionMobile, Dimitris is in charge of the Developer Economics portal and also leads the company’s research on web technologies. Dimitris is a developer and entrepreneur. As a developer he is fluent with HTML5, JavaScript, Node.js, SQL, Git, J2EE and PHP - including tinkering with JS visualisations. Dimitris is an engineer at heart. He enjoys breaking things apart to see how the work, except of course for his precious Firefox OS phone.

"How Can Web Devs Reach the Mobile Market?" by Dimitris Michalakos, Web Techn...

Eurapp

This workshop was held several times during the week of 10th-14th of December as part of the semester 'Designing Mobile Experiences' at the department of Computer Science at the Faculty of Digital Media and Creative Industries Amsterdam. This workshop is dedicated to Developers and the development of privacy-friendly services & systems. It explores hands-on & playfully how a privacy-friendly service & system can be designed & developed, according to 8 Privacy Design Strategies & Tactics (Hoepman, 2018). For homework, we asked students to explore privacypatterns.org as well, in order to see if students were able to work from a strategic perspective towards an implementation plan. Another goal of this workshop is to explore if this theoretical foundation can become a potential language for both Designers & Developers, when they are creating privacy-friendly services & systems together. The explosion of big data and digital information has transpired with little attention to ethical considerations of consent, privacy, and confidentiality. In our 00’s strive for sharing & connecting, we seem to have lost the potential quality of the private sphere, resulting in an ambiguous unlimited spreading of personal data to both governmental and commercial parties. At this moment we have no notion of the unintended consequences, algorithmic bias, nor do we know much about the troubling power of persuasive technology. Although GDPR has resulted in awareness and strategic implementation of privacy-sensitive information, we still need to look for methods & tools to implement privacy into our daily designer-development workflows, so that we can guide ourselves towards the creation of privacy-friendly systems that maintain the basic values of democracy.

Privacy by Design workshop for Developers - School for Computer Science (HBO-...

Anne Marleen

Hadoop, Iot and Analytics- The Three Musketeers

Edureka!

With the current pandemic, privacy concerns have emerged around the large number of applications being published and promoted around the globe. From symptom tracking to contact tracing, the COVID-19 App Tracker Project (https://covid19apptracker.org) aims to automate detection of new and modified applications published on the Google Play Store. Our session will discuss C19 app trends around the globe, emerging concerns, and what is required for greater transparency around the applications created and data collected by governments around the world.

Who needs spwyare when you have COVID-19 apps?

Megan DeBlois

Everyone wants (someone else) to do it: writing documentation for open source...

Jody Garnett

Mobile App Ecosystem: IdeaSpace Ateneo

Jim Ayson

Lecture #3 activities and intents

Vitali Pekelis

SeleniumCamp 2020 - Shift Right and Observability

Marcus Merrell

On May 15th, the day before Global Accessibility Awareness Day, we hosted SIGNA11Y - our very first accessibility and inclusive design event - at the CodeClan premises in Edinburgh. Here are the presentations from our expert group of speakers -including our very own Software Engineer Claire Smith, Allan Hutcheon (COO of Neatebox), Iris Winter (Frontend Developer at Modulr Finance) and Chris Wait (Director of Engineering at Passio).

SIGNA11Y - Speaker Presentations

Cello Signal

Engr. Redwan Ferdous took a session on "Smart Life: Hands-On training on property automation design and commissioning through IoT" in collaboration with Dept. of CSE and BHTPA in Chittagong University of Engineering and Technology (CUET) back in 27th December-2021 Monday. In total 02 sessions, almost 120 students participated in the hands-on training. 1st session attended from 2pm-4:50pm and 2nd session attended from 5pm-6:50pm. All the participants were from L-3,T-2 of Dept. of CSE of CUET. In the session, different commercial IoT based home automation products were shown along with their controlling mechanism-practically. Also, different career and research opportunities were also discussed in the session.

Smart life: Hands on training on property automation design and commissioning...

Redwan Ferdous

Internet of things - انترنت الأشياء

geeksvalley

What companies need to know about web accessibility in 2020

Lisandra Armas

sustainability-open presentation during BEMNext hack fest

Jeroen Coenders

Choosing the wrong mobile tech stack sets you up for a world of pain. But how do you select the right one from a plethora of current options? As an iOS developer I am convinced that a carefully designed native app provides the best user experience. So why would we choose Ionic2/Angular2 on Cordova (a bleeding edge Hybrid JavaScript framework) for our latest mobile App? In this short talk I will share our thinking and experiences on the current landscape of mobile stack options. I will introduce the contenders: Native (iOS and Android) vs Semi-Native (Xamarin and React Native) vs Hybrid (Ionic2/Angular2 on Cordova) vs Web. We will then go through some of the prominent tradeoffs between the different options: cost, reuse, single language, speed and user experience, device support, learning curve. This should give you some (opinionated) guidelines to choosing the right mobile stack for your particular App.

Hybrid vs native mobile development – how to choose a tech stack

Jacques De Vos

Why should we care about Digital Accessibility?

Matthew Deeprose

Ajaxworld Opensocial Presentation

Chris Schalk

Similar a Practical Accessibility (A11y) (20)

AT&T Mobile App & IoT Hackathon @ Catalyst

IdeaSpace-DLSU Presentation

IRJET- Socially Smart an Aggregation System for Social Media using Web Sc...

OSDC - Open and Accessible

"How Can Web Devs Reach the Mobile Market?" by Dimitris Michalakos, Web Techn...

Privacy by Design workshop for Developers - School for Computer Science (HBO-...

Hadoop, Iot and Analytics- The Three Musketeers

Who needs spwyare when you have COVID-19 apps?

Everyone wants (someone else) to do it: writing documentation for open source...

Mobile App Ecosystem: IdeaSpace Ateneo

Lecture #3 activities and intents

SeleniumCamp 2020 - Shift Right and Observability

SIGNA11Y - Speaker Presentations

Smart life: Hands on training on property automation design and commissioning...

Internet of things - انترنت الأشياء

What companies need to know about web accessibility in 2020

sustainability-open presentation during BEMNext hack fest

Hybrid vs native mobile development – how to choose a tech stack

Why should we care about Digital Accessibility?

Ajaxworld Opensocial Presentation

Más de Josh Justice

So you’ve gotten Detox set up to test your React Native application. Good work! But you aren’t done yet: there are still a lot of questions you need to answer. How many tests do you write? When and where do you run them? How do you ensure there is test data available? What do you do about parts of your app that use mobile APIs that are difficult to automate? You could sink a lot of effort into these things—is the payoff worth it? In this three-hour workshop we’ll address these questions by discussing how to integrate Detox into your development workflow. You’ll walk away with the skills and information you need to make Detox testing a natural and productive part of day-to-day development. - We'll cover: - Deciding what to test with Detox vs React Native Testing Library vs manual testing - Setting up a fake API layer for testing - Getting Detox running on CI on GitHub Actions for free - Deciding how much of your app to test with Detox: a sliding scale - Fitting Detox into you local development workflow

Effective Detox Testing - React Advanced 2023

Josh Justice

React Testing Library is a great framework for React component tests because there are a lot of questions it answers for you, so you don’t need to worry about those questions. But that doesn’t mean testing is easy. There are still a lot of questions you have to figure out for yourself: How many component tests should you write vs end-to-end tests or lower-level unit tests? How can you test a certain line of code that is tricky to test? And what in the world are you supposed to do about that persistent act() warning? In this three-hour workshop we’ll introduce React Testing Library along with a mental model for how to think about designing your component tests. This mental model will help you see how to test each bit of logic, whether or not to mock dependencies, and will help improve the design of your components. You’ll walk away with the tools, techniques, and principles you need to implement low-cost, high-value component tests. Table of contents - The different kinds of React application tests, and where component tests fit in - A mental model for thinking about the inputs and outputs of the components you test - Options for selecting DOM elements to verify and interact with them - The value of mocks and why they shouldn’t be avoided - The challenges with asynchrony in RTL tests and how to handle them

Designing Effective Tests with React Testing Library - React Summit 2023

Josh Justice

Testing React Native Apps - Chain React 2023

Josh Justice

Designing Effective Tests with React Testing Library - React Day Berlin 2022

Josh Justice

We know that React is for the web and React Native is for Android and iOS. But have you heard of react-native-web—for writing an app for Android, iOS, and the web in one codebase? Just like React Native abstracts away the details of iOS and Android, React Native Web extracts away the details of the browser as well. This opens up the possibility of even more code sharing across platforms. In this workshop you’ll walk through setting up the skeleton for a React Native Web app that works great and looks awesome. You can use the resulting codebase as a foundation to build whatever app you like on top of it, using the React paradigms and many JavaScript libraries you’re used to. You might be surprised how many types of app don’t really require a separate mobile and web codebase!

Building for Mobile and Web with Expo - React Day Berlin 2022

Josh Justice

Are you satisfied with your test suites? If you said no, you’re not alone—most developers aren’t. And testing in React Native is harder than on most platforms. How can you write JavaScript tests when the JS and native code are so intertwined? And what in the world are you supposed to do about that persistent act() warning? Faced with these challenges, some teams are never able to make any progress testing their React Native app, and others end up with tests that don’t seem to help and only take extra time to maintain. But it doesn’t have to be this way. React Native Testing Library (RNTL) is a great library for component testing, and with the right mental model you can use it to implement tests that are low-cost and high-value. In this three-hour workshop you’ll learn the tools, techniques, and principles you need to implement tests that will help you ship your React Native app with confidence. You’ll walk away with a clear vision for the goal of your component tests and with techniques that will help you address any obstacle that gets in the way of that goal.

Intro to React Native Testing Library

Josh Justice

Building for Mobile and Web with Expo - React Advanced London 2022

Josh Justice

What do you do when you need to work with some really bad code? It seems like a no-win situation: whether you rewrite it, do a ""refactoring sprint,"" or just live with it, you have to pay a big cost. But these aren't the only options. There's a way to get control of your code so that you can make whatever improvements you need in a low-stress, low-cost way. To explain how, this talk is split into two parts. In the first part we'll look at a messy React Native component and see how effortless it is to make improvements to the code if you have comprehensive tests. In the second part we'll tackle that big ""if:"" how in the world can you get comprehensive tests like that? By the end of this talk you'll have the information to decide if this approach to testing and refactoring will help your project, and if so, you'll have next steps to hone your skills in this approach.

Getting Better All the Time: How to Escape Bad Code

Josh Justice

How do you learn to program? How do you *keep* learning to program, as new languages, libraries, and platforms are released? The amount of information out there can be overwhelming, especially in React. Whether you're just out of a Bootcamp, switching technologies, or just trying to keep up, it can feel impossible to find the time to learn. In this talk, Josh Justice will share an approach to learning that he stumbled upon in the process of making two major technology career shifts within three years. It's a way to avoid mistakes that may be hindering your learning, make the flow of information manageable, solidify your skills, and feel motivated all along the way. Everyone's background and life circumstances are different, but this talk will offer tools and ideas that you can apply in a way that works for you.

Sustainable Learning - ReactATL Jan 2022

Josh Justice

react-native-web is a library that allows you to take the same React Native codebase you deploy to Android and iOS and deploy it to the web as well. The recommended way to get started with react-native-web is with Expo, which includes web support. To learn more about react-native-web, let's look at an open-source app that was recently released on iOS and the web. We'll look at ways to set up URLs, responsive design, and dark theme, cases where you need different code for the web, and testing options that are unlocked by the web. We'll also talk about how to choose between React, React Native, and Expo for your next project.

Building an App for Mobile and Web with Expo

Josh Justice

When software doesn’t fully meet the needs of its user, what are the user’s options? For commercial software, the user can lobby the manufacturer for the feature they need—but the manufacturer may not respond. For open-source software, the user can fork the repo and add the feature themselves—but this requires becoming a developer on the platform the app is written in. But there have been better options in the past history of computing: software platforms that allow users to inspect the code of their software and modify it in the same environment the software runs in. With these software platforms, anyone using the application already has all the tooling they need to see how the application works and modify it. Platforms like this have played a significant role in the advancement of personal computing; can they do so again? This talk presents two such user-modifiable software systems: Smalltalk and HyperCard. Based on research into these systems’ origins, properties, and impact, it offers seven insights from them that can be applied to current and future user-modifiable systems.

User-Modifiable Software: Smalltalk and HyperCard

Josh Justice

JavaScript test tooling has advanced a lot in the last few years, but tooling can’t solve everything—we still have decisions to make about how to optimally set up our tests. It would be great if we could learn from experienced testers who came before us, but it can be difficult to follow writing about testing in a programming language we aren’t familiar with. Luckily, there’s one book in particular that has a lot of language-agnostic testing wisdom to share: xUnit Test Patterns. We’ll walk through some of the “test smells” it describes and see examples of how they commonly arise in JavaScript, then we’ll apply the principles from the book to solve these problems. You’ll walk away from this session with more tools in your tool belt to solve testing problems, and clearer language to talk about the tools you already have.

Old Solutions to New Testing Problems

Josh Justice

Test-Driven Development in Vue with Cypress

Josh Justice

Test-Driven Development in React with Cypress

Josh Justice

Babel is a tool many JavaScript developers use to enable writing modern language features on all platforms. It’s incredibly useful, but for most of us it feels like a mysterious black box. We just drop in preset-env and we’re set! It’s great that it’s so easy to get started with Babel, but there’s also value in understanding how it works. I got to spend a week contributing to the upcoming private class fields feature for Babel. During that week, I went from knowing nothing about how Babel works to being able to fix some failing tests and implement new edge cases. As part of this process, I had to get up to speed quickly on Babel’s plugin and transformation systems. And I’d like to share what I learned with you.

Newbie's Guide to Contributing to Babel

Josh Justice

Outside-in Testing in Vue with Cypress

Josh Justice

Más de Josh Justice (16)

Effective Detox Testing - React Advanced 2023

Designing Effective Tests with React Testing Library - React Summit 2023

Testing React Native Apps - Chain React 2023

Designing Effective Tests with React Testing Library - React Day Berlin 2022

Building for Mobile and Web with Expo - React Day Berlin 2022

Intro to React Native Testing Library

Building for Mobile and Web with Expo - React Advanced London 2022

Getting Better All the Time: How to Escape Bad Code

Sustainable Learning - ReactATL Jan 2022

Building an App for Mobile and Web with Expo

User-Modifiable Software: Smalltalk and HyperCard

Old Solutions to New Testing Problems

Test-Driven Development in Vue with Cypress

Test-Driven Development in React with Cypress

Newbie's Guide to Contributing to Babel

Outside-in Testing in Vue with Cypress

Último

WSO2CON 2024 - WSO2's Digital Transformation Journey with Choreo: A Platforml...

WSO2

%in Bahrain+277-882-255-28 abortion pills for sale in Bahrain

masabamasaba

WSO2CON 2024 - Freedom First—Unleashing Developer Potential with Open Source

WSO2

%in Stilfontein+277-882-255-28 abortion pills for sale in Stilfontein

masabamasaba

%in Benoni+277-882-255-28 abortion pills for sale in Benoni

masabamasaba

%in kaalfontein+277-882-255-28 abortion pills for sale in kaalfontein

masabamasaba

tonesoftg

lanshi9

WSO2Con204 - Hard Rock Presentation - Keynote

WSO2

%in ivory park+277-882-255-28 abortion pills for sale in ivory park

masabamasaba

We specialize in Psychic Readings, Psychic Love Spells, Binding Love Spells, Obsession Spells, Voodoo Spells, Lottery Spells, Marriage Spells, Black Magic Spells, Palm Readings & much more. Are you depressed? We perform this come-to-me love spell that works instantly with the aim of bringing back the victim to the person performing the magic. Have you lost your lover? We perform this come-to-me love spell that works instantly with the aim of bringing back the victim to the person performing the magic. Have you lost your lover? Do u need to solve any relationship problem? Contact the powerful spells caster chief kule with love spells that work overnight and love spells that really work. Have you found yourself infatuated with a special someone you think could be the one? Are you looking for a spell to provide them with a nudge in the right direction? Or maybe the spell you cast didn’t achieve the results you were hoping for? Whether you’re new or versed in the ways of spell casting, we’re here to help. Today we’re going to provide you with a detailed guide on the types of love spells to cast. Not only that but there’s something for those who wish to find outside advice from more advanced spell casters. We’re also going to provide you with the top sites available to help you with your dilemma. Let’s begin our journey by educating ourselves on love magic and what a real love caster looks like. Love Magic and Love Casters Love magic made its first appearance back in Ancient Egypt and has been an active practice since. This type of magic is a branch of traditional magic and can be practiced in various ways. Typically the more common use of love magic is through the work of spells, but other methods look like Charms Rituals-LOVE Potions-Dolls and even Amulets If you are interested in becoming a love caster, be prepared for what’s to come. A genuine love caster knows that the art of love casting is no easy feat and shouldn’t be done casually. You should know that not only does it require you to be gifted spiritually, but you must be ready to serve others. Someone who is considered a real love caster has experience in all manner of spells, no matter the difficulty. Training yourself in attraction, commitment, and marriage spells is an excellent place to start. But this by no means will make you a professional. Practice your craft and expand your knowledge; understand that you will possess the ability to help others in time truly. Types of Love Spells What better way to start broadening your experiences with love spells than by learning more about them? These spells work like just about any other spell. Simply apply your intention, use a medium (sigils, mantras, candles, or charm bags), and top it off with establishing the belief that you will receive what you want. So what kind of spells are available and which ones suit your needs the best? Let’s take a look at the many options you have at your disposal.

%+27788225528 love spells in Colorado Springs Psychic Readings, Attraction sp...

masabamasaba

Announcing Codolex 2.0 from GDK Software

Jim McKeeth

%in tembisa+277-882-255-28 abortion pills for sale in tembisa

masabamasaba

We specialize in Psychic Readings, Psychic Love Spells, Binding Love Spells, Obsession Spells, Voodoo Spells, Lottery Spells, Marriage Spells, Black Magic Spells, Palm Readings & much more. Are you depressed? We perform this come-to-me love spell that works instantly with the aim of Winnipeg back the victim to the person performing the magic. Have you lost your lover? We perform this come-to-me love spell that works instantly with the aim of bringing back the victim to the person performing the magic. Have you lost your lover? Do u need to solve any relationship problem? Contact the powerful spells caster chief kule with love spells that work overnight and love spells that really work. Have you found yourself infatuated with a special someone you think could be the one? Are you looking for a spell to provide them with a nudge in the right direction? Or maybe the spell you cast didn’t achieve the results you were hoping for? Whether you’re new or versed in the ways of spell casting, we’re here to help. Today we’re going to provide you with a detailed guide on the types of love spells to cast. Not only that but there’s something for those who wish to find outside advice from more advanced spell casters. We’re also going to provide you with the top sites available to help you with your dilemma. Let’s begin our journey by educating ourselves on love magic and what a real love caster looks like. Love Magic and Love Casters Love magic made its first appearance back in Ancient Egypt and has been an active practice since. This type of magic is a branch of traditional magic and can be practiced in various ways. Typically the more common use of love magic is through the work of spells, but other methods look like Charms Rituals-LOVE Potions-Dolls and even Amulets If you are interested in becoming a love caster, be prepared for what’s to come. A genuine love caster knows that the art of love casting is no easy feat and shouldn’t be done casually. You should know that not only does it require you to be gifted spiritually, but you must be ready to serve others. Someone who is considered a real love caster has experience in all manner of spells, no matter the difficulty. Training yourself in attraction, commitment, and marriage spells is an excellent place to start. But this by no means will make you a professional. Practice your craft and expand your knowledge; understand that you will possess the ability to help others in time truly. Types of Love Spells What better way to start broadening your experiences with love spells than by learning more about them? These spells work like just about any other spell. Simply apply your intention, use a medium (sigils, mantras, candles, or charm bags), and top it off with establishing the belief that you will receive what you want. So what kind of spells are available and which ones suit your needs the best? Let’s take a look at the many options you have at your disposal. Attraction Spells

%+27788225528 love spells in Huntington Beach Psychic Readings, Attraction sp...

masabamasaba

WSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital Transformation

WSO2

%in Hazyview+277-882-255-28 abortion pills for sale in Hazyview

masabamasaba

WSO2Con2024 - From Code To Cloud: Fast Track Your Cloud Native Journey with C...

WSO2

Abortion Pills In Pretoria ](+27832195400*)[ 🏥 Women's Abortion Clinic In Pretoria ● Abortion Pills For Sale In Pretoria ● Pretoria 🏥🚑!! Abortion Clinic Near Me Cost, Price, Women's Clinic Near Me, Abortion Clinic Near, Abortion Doctors Near me, Abortion Services Near Me, Abortion Pills Over The Counter, Abortion Pill Doctors' Offices, Abortion Clinics, Abortion Places Near Me, Cheap Abortion Places Near Me, Medical Abortion & Surgical Abortion, approved cyctotec pills and womb cleaning pills too plus all the instructions needed This Discrete women’s Termination Clinic offers same day services that are safe and pain free, we use approved pills and we clean the womb so that no side effects are present. Our main goal is that of preventing unintended pregnancies and unwanted births every day to enable more women to have children by choice, not chance. We offer Terminations by Pill and The Morning After Pill.” Our Private VIP Abortion Service offers the ultimate in privacy, efficiency and discretion. we do safe and same day termination and we do also womb cleaning as well its done from 1 week up to 28 weeks. We do delivery of our services world wide SAFE ABORTION CLINICS/PILLS ON SALE WE DO DELIVERY OF PILLS ALSO Abortion clinic at very low costs, 100% Guaranteed and it’s safe, pain free and a same day service. It Is A 45 Minutes Procedure, we use tested abortion pills and we do womb cleaning as well. Alternatively the medical abortion pill and womb cleansing !!!

Abortion Pills In Pretoria ](+27832195400*)[ 🏥 Women's Abortion Clinic In Pre...

Medical / Health Care (+971588192166) Mifepristone and Misoprostol tablets 200mg

%in Rustenburg+277-882-255-28 abortion pills for sale in Rustenburg

masabamasaba

WSO2CON 2024 - Cloud Native Middleware: Domain-Driven Design, Cell-Based Arch...

WSO2

%in tembisa+277-882-255-28 abortion pills for sale in tembisa

masabamasaba

Practical Accessibility (A11y)

1. Accessibility: A Practical Getting-Started Guide Josh Justice ReactATL July 21, 2020 1 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

2. Accessibility (A11y) …the practice of making your websites usable by as many people as possible. We traditionally think of this as being about people with disabilities, but the practice of making sites accessible also benefits other groups such as those using mobile devices, or those with slow network connections. https://developer.mozilla.org/en-US/docs/Learn/Accessibility/ What_is_accessibility 2 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

3. 3 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

4. A11y: A lot to learn. Hard to know how to get started. 4 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

5. Purpose: To give you what you need to get started improving the a11y of your app. 5 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

6. About Me Josh Justice Twitter: @CodingItWrong Email: jjustice@bignerdranch.com 6 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

7. 7 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

8. Outside-In Frontend Development https://outsidein.dev 8 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

9. Caveat: I'm an a11y beginner. 9 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

10. A11y: Three Steps 1. Read background information. 2. Run automated tools. 3. Manually test. 10 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

11. A11y: Three Steps 1. Read background information. 2. Run automated tools. 3. Manually test. 11 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

12. https://reactjs.org/docs/accessibility.html 12 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

13. • Start with docs if you like to read the instructions, or want the big picture. • Start with automated tools if you like to dive right in, and learn just- in-time. 13 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

14. A11y: Three Steps 1. Read background information. 2. Run automated tools. 3. Manually test. 14 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

15. 2. Run automated a11y tools. • eslint-react-jsx-a11y • react-axe • Siteimprove Accessibility Checker 15 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

16. 2. Run automated a11y tools. • eslint-react-jsx-a11y • react-axe • Siteimprove Accessibility Checker 16 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

17. eslint-react-jsx-a11y https://www.npmjs.com/package/eslint-plugin-jsx-a11y • Runs as part of your ESLint setup • Some rules enabled by default in Create React App apps • Warnings in editor • A lot it can't catch 17 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

18. eslint-react-jsx-a11y DEMO 18 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

19. 2. Run automated a11y tools. • eslint-react-jsx-a11y • react-axe • Siteimprove Accessibility Checker 19 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

20. react-axe https://www.npmjs.com/package/react-axe • axe is general accessibility tools • react-axe hooks in to React (dev environment only) • Warnings in browser web console 20 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

21. react-axe DEMO 21 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

22. 2. Run automated a11y tools. • eslint-react-jsx-a11y • react-axe • Siteimprove Accessibility Checker 22 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

23. Siteimprove Accessibility Checker https://bit.ly/siteimprove-ext • Chrome extension • Run it on-request on a page 23 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

24. Siteimprove Accessibility Checker DEMO 24 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

25. 2. Run automated a11y tools. • eslint-react-jsx-a11y • react-axe • Siteimprove Accessibility Checker 25 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

26. A11y: Three Steps 1. Read background information. 2. Run automated tools. 3. Manually test. 26 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

27. 3. Manually test. • Keyboard-only usage • VoiceOver 27 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

28. 3. Manually test. • Keyboard-only usage • VoiceOver 28 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

29. Keyboard-Only Usage • Visible focus indicators • Tab order 29 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

30. Keyboard-Only Usage DEMO 30 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

31. 3. Manually test. • Keyboard-only usage • VoiceOver 31 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

32. VoiceOver • A macOS and iOS screen reader technology. • Shows you how non-sighted users experience your app. 32 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

33. 33 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

34. 34 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

35. 35 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

36. VoiceOver DEMO 36 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

37. VoiceOver https://www.apple.com/voiceover/info/guide/_1121.html 37 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

38. 3. Manually test. • Keyboard-only usage • VoiceOver 38 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

39. A11y: Three Steps 1. Read background information. 2. Run automated tools. 3. Manually test. 39 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

40. 40 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

41. Questions? 41 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

42. Thanks! @codingitwrong me@codingitwrong.com Links: - React Accessibility - eslint-react-jsx-a11y - react-axe - SiteImprove Accessibility Checker - VoiceOver 42 Accessibility: A Practical Getting-Started Guide - Josh Justice - ReactATL July 21, 2020 - @codingitwrong

Practical Accessibility (A11y)

Recomendados

Recomendados

Más contenido relacionado

Similar a Practical Accessibility (A11y)

Similar a Practical Accessibility (A11y) (20)

Más de Josh Justice

Más de Josh Justice (16)

Último

Último (20)

Practical Accessibility (A11y)