Walking Down the A11Y Road - Lessons Learnt From Working on Accessibility of A Django Project
This is a modal window.
The media could not be loaded, either because the server or network failed or because the format is not supported.
Formal Metadata
| Title |
| |
| Title of Series | ||
| Part Number | 43 | |
| Number of Parts | 52 | |
| Author | ||
| License | CC Attribution - ShareAlike 3.0 Unported: You are free to use, adapt and copy, distribute and transmit the work or content in adapted or unchanged form for any legal and non-commercial purpose as long as the work is attributed to the author in the manner specified by the author or licensor and the work or content is shared also in adapted form only under the conditions of this | |
| Identifiers | 10.5446/32727 (DOI) | |
| Publisher | ||
| Release Date | ||
| Language |
Content Metadata
| Subject Area | ||
| Genre | ||
| Abstract |
|
DjangoCon US 201643 / 52
6
10
13
14
17
20
23
31
36
44
46
47
48
49
00:00
Execution unitUniverse (mathematics)Group actionBitExpert systemComputer animation
01:01
Server (computing)Student's t-testContent (media)Moment (mathematics)Multiplication signConnectivity (graph theory)Digital mediaDecision theoryKeyboard shortcutWell-formed formulaVideoconferencingType theoryGoogolEqualiser (mathematics)Projective planeCodePrisoner's dilemmaDistribution (mathematics)InternetworkingSelf-organizationComputer animation
02:18
Search engine (computing)GoogolWorld Wide Web ConsortiumCore dumpExecution unitMultiplication signUniverse (mathematics)Parameter (computer programming)Cartesian coordinate systemWeightCategory of beingCivil engineeringProduct (business)Bell and HowellForm (programming)Mathematical optimizationPhysical lawInformationDecision theoryNumberBit rateSelf-organizationProjective planeCASE <Informatik>Line (geometry)Revision controlCodeFilm editingFacebookStandard deviationMobile WebTerm (mathematics)Data managementInheritance (object-oriented programming)PrototypeFlow separationGraph (mathematics)Sheaf (mathematics)Right angleStatisticsExtreme programmingContent (media)Online helpLevel (video gaming)Shared memoryPresentation of a groupWeb 2.0DigitizingGroup actionReal numberState observerPhase transitionView (database)Computer animation
09:20
Web browserPresentation of a groupComputer fontView (database)Uniform resource locatorSpring (hydrology)Machine visionPattern languageObservational studyProcess (computing)Web pageMedical imagingGame controllerProduct (business)Pointer (computer programming)Video gameCASE <Informatik>Context awarenessControl flowWordMathematical analysisReflection (mathematics)Type theoryHome pageDifferent (Kate Ryan album)InfinityInteractive televisionIntegrated development environmentData structureAreaMoment (mathematics)Formal languageBit rateMultiplication signHypermediaPoint (geometry)Shared memoryMassComputer programmingInsertion lossTouchscreenTheoryForm (programming)Metropolitan area networkSet (mathematics)Latent heatDeclarative programmingInformation technology consultingKeyboard shortcutStructural loadElectronic mailing listBitFocus (optics)Price indexDisk read-and-write headContent (media)Physical lawDefault (computer science)VideoconferencingSeries (mathematics)PermanentExterior algebraPatch (Unix)MereologySession Initiation ProtocolMobile WebSemantics (computer science)Goodness of fitFeedbackWeb 2.0MultilaterationConfluence (abstract rewriting)Computer animation
16:23
Graph coloringError messageLink (knot theory)Latent heatVideoconferencingResultantMedical imagingGoodness of fitSearch engine (computing)Line (geometry)Form (programming)GoogolMoment (mathematics)Database normalizationInformationRevision controlWebsiteMultimediaSoftware developerField (computer science)Arithmetic meanContent (media)Graph coloringWeb pageAttribute grammarFlow separationContrast (vision)Projective planeExterior algebraSoftwareDescriptive statisticsBlock (periodic table)Structural loadCross-correlationCausalityComputer configurationWater vaporStress (mechanics)Pattern languageStatistical hypothesis testingTask (computing)Correspondence (mathematics)Wave packetSystem callMultiplication signMessage passingCAN busDependent and independent variablesTotal S.A.Bookmark (World Wide Web)UsabilityMetropolitan area networkTraffic reportingSound effectForestState of matterMathematical optimizationComputer animation
22:09
VideoconferencingContent (media)Reading (process)Extension (kinesiology)Revision controlFlash memoryElectronic mailing listMereologyInterface (computing)
23:22
TouchscreenoutputWeb pageCondition numberLevel (video gaming)VideoconferencingElectric generatorProduct (business)Type theoryCollaborationismFunction (mathematics)PrototypeBootstrap aggregatingGreen's functionTwitterRevision controlLink (knot theory)Software frameworkInternetworkingBitConnectivity (graph theory)InformationMereologyProcess (computing)Context awarenessElectronic program guideSoftwareUsabilityWordComputer configurationSoftware developerDisk read-and-write headExtension (kinesiology)Latent heatCurveDifferenz <Mathematik>Moment (mathematics)Arithmetic progressionContrast (vision)Statistical hypothesis testingTouch typingElement (mathematics)Division (mathematics)ResultantReading (process)WindowQuicksortGraph (mathematics)Content (media)Pattern languageDemosceneSocial classTelecommunicationMedical imagingPoint cloudIterationLattice (order)State of matterUniverse (mathematics)Multiplication signSelectivity (electronic)File formatPlanningGroup actionPower (physics)AreaRankingVideo gameSummierbarkeitTheory of relativityArithmetic meanThermal expansionStandard deviationGame theoryMultiplicationDesign by contractUtility softwareComputer animation
31:13
Dependent and independent variablesCategory of beingRepresentation (politics)Projective planeStatistical hypothesis testingConnectivity (graph theory)Right angleSoftware developerArithmetic meanMultiplication signMomentumProbability density functionEmailInsertion lossSlide ruleWeb pageRule of inferenceSocial classElement (mathematics)InformationProduct (business)Network topologyProcess (computing)Functional (mathematics)Content (media)WebsiteResultantTable (information)MereologyClient (computing)Inclusion mapAdditionDecision theoryForm (programming)HypermediaStaff (military)CASE <Informatik>View (database)MultilaterationElectronic mailing listPoint (geometry)TwitterExterior algebraImplementationLink (knot theory)Repository (publishing)Context awarenessDescriptive statisticsSelf-organizationFacebookVideoconferencingComputer iconWikiStatistical hypothesis testingWindowCausalityPresentation of a groupFile viewerField (computer science)Computer animation
38:45
Associative propertyTemplate (C++)Error messageInterrupt <Informatik>Theory of relativityDynamical systemLatent heatGroup actionDependent and independent variablesWeb pageCategory of beingMathematicsDivisorUsabilityNumbering schemeMultiplication signUniverse (mathematics)Patch (Unix)Product (business)Context awarenessExtension (kinesiology)Video gameBitFigurate numberLattice (order)System callComputer configurationFlow separationStatistical hypothesis testingTouchscreenProgrammable read-only memorySlide ruleRule of inferenceAreaRevision controlProbability density functionSimilarity (geometry)Content (media)Statistical hypothesis testingShared memoryLecture/Conference
43:15
Task (computing)Computer animationJSONXML
Transcript: English(auto-generated)
00:19
I am very happy that so many people in this community are interested about accessibility.
00:24
We had a talk yesterday, this is a nice show-up. I am going to be talking a bit about my experience about working on accessibility in these two projects, K-Lite and Colibri. I am going to skip the two cents about me.
00:43
I am far from being an expert, but that goes to my favourite place today. I want to show you that you don't need to be an expert to implement the basic universal design. Only it is to care for your users.
01:03
K-Lite is technically K-Academy Lite. It is an offline server solution for distributing educational video content in places in the world where the Internet is not available. So what we have is the server which will distribute videos in schools, orphanages, refugee camps,
01:31
prisons where there is not sufficient internet connection to be able to deliver successful video content.
01:42
That is not the only type of users we get. A couple of weeks ago we had a guy contact with us because he was going on a private cruise and he wanted his kids who would be on a yacht to be able to watch K-Academy videos.
02:01
So not particularly the type of user we had in mind when we started. We are trying to bring this digital delight and just one moment is how did we meet, me and Learning Equality. Last year Learning Equality was chosen to participate in the Google Summer of Code project as one of the organisations.
02:25
I was lucky enough that one of their core values was universal design and that they liked my proposal. I presented because accessibility was one of the things I was trying to get passionate about and trying to work more.
02:43
I was lucky enough that they liked my proposal. I was 44 at the time which goes to say that you can never be old enough or bold enough to get passionate about new things and trying new things. So why do we care? I am conscious that I am lucky enough to work for a non-profit where universal design is a core value.
03:08
I am also aware that a lot of you work for digital agencies, organisations with various stakeholders you have to deal with. Do not share the same stance. So I am going to start this presentation just running through a couple of things that you might use.
03:24
Even though I am convinced that I don't have to convince anybody here about why accessibility is important, I know that you might have to deal with some questions about why investing time and effort into implementing universal design.
03:41
So let's go and see a couple of arguments that might help you with some of those unconvinced stakeholders. So who benefits if we implement universal design, if we work on accessibility? Just the disabled people? According to a health organisation there is 1 billion people in the world with some form of disability.
04:06
That's 15%. In real numbers that's more than all population of Europe for example. Some European stats show that 1 in 4 have some form of disability, both moderate to severe.
04:27
That's like more than the whole population of Germany. So it's not an edge case anymore. Another argument might be, do only people with disabilities benefit when we implement universal design accessibility?
04:47
This is the sketch from Graham Bell's first prototype for a telephone. Even though his relationship with the deaf community was somewhat torturous, his interest in working with deaf people, because his wife and his mother were deaf,
05:07
eventually led to his research into hearing devices that eventually led to him patenting the telephone. And that, with other research done at Bell Labs, connected to transistor and transistor radio,
05:25
to what we today have as this thing that we cannot live without, a mobile phone. Anybody here without a mobile phone? Wow, one person. Okay, so we started with trying to help somebody with disability and end up with a project that benefited everybody.
05:51
That's not the only case. Like a month ago I gave a similar talk to a group of undergraduates, so I didn't get to use this line, but here I can. How many here are parents?
06:03
Okay, so I guess you are thankful for all those curb cuts you encounter when you have to push cramps. Those curb cuts are there because they were necessary for people with wheelchairs. Or you don't have to be a parent.
06:20
Anytime you have to have trouble with you because you are traveling, you are also making use of those curb cuts. So designing for those extreme cases eventually benefits, leads to better design for everybody. If you want to take a more social view of this subject, the parental leaves,
06:42
paid parental leaves that now many women have, eventually ended up to rights of the fathers to claim the same. Maybe not in our country, maybe not right now, but eventually this is going to happen. So designing for extremes benefits everybody.
07:00
It's also good for business. You have several arguments to present why implementing certain universal design may be good for business. With accessibility benefits, search engine optimization, mobile designs usually have better accessibility. I've heard several times from blind people that they, for example, use directly
07:24
Facebook or mobile versions instead of a desktop version because it's more accessible. So these two things are connected. You have increased market share because you now have included all this group of people that was excluded eventually.
07:41
So you don't have to put up fires. You try to think about accessibility from the beginning and don't wait for a QA phase of your project to think about accessibility. If you try to build in accessibility from the beginning, it may increase your budget for a couple of percents.
08:07
One, two, three occurs. But if you try to retrofit a project, a product that was designed without thinking about accessibility, it goes 10% to up. So if all these carrots that are presented, like the sheer numbers, benefits for all, benefits for business were not enough, let's use a stick.
08:29
We have, sorry, standards and laws. In many countries, especially if you work in public sector, accessibility is built into law.
08:41
So not be observed. Or you have legal risks. Here in the U.S., you have Section 508 and the American Disabilities Act. And in Europe right now, a couple of months ago, there has been a really important decision by the European Union about implementing web accessibility on the whole European Union level.
09:05
And of course, the web content accessibility guidelines were established as an ISO standard. There is one thing that I want to mention, just accessibility in all the recent legislation is starting to be considered not as a property of the person.
09:23
Not as something is missing in the person. But what happens when the person interacts with a certain environment which makes it inaccessible for them at that point. So it doesn't mean it has to be something permanent. You can be disabled because for what? Temporarily.
09:43
You broke an arm, a leg, you have an eye patch. You are temporarily disabled. You can be situationally disabled. For example, me in the sunlight, I'm useless. I don't have official disability, but I cannot do anything in the sunlight without really, really big dark shades.
10:03
So this vision of accessibility as the confluence between what you are and the situation that you are in is getting into legislation too. And of course, standards and laws also end up in courtrooms.
10:22
So you have several really important law cases about accessibility, especially here in the US. A bit more litigious society than Europe, for example. This last list is one of the accessibility consultants who started this list back in 2011.
10:44
It hasn't been updated until a couple of months ago. It had maybe 50 in about a year or two. And then recently he updated it now. This list has more than 250 legal cases on account of accessibility, breaking disability laws and legislations.
11:07
Okay. So I'm going to start now about the hour, mine, lessons learned from working with disability on this particular project, KLite. And I want to share the most important lessons that I learned right away.
11:25
It's like you have to think about offering alternatives for the content to your users. Let's get on with this low-hanging fruit that we managed to take care of in KLite. Ah, yeah, of course, sorry.
11:40
One other that I discovered a bit later. This is actually from one really nice video from Don Norman. It's disability and feedback. Another thing that I would ask you to keep in mind all the time when you think about web accessibility specifically. So, first advice.
12:02
When you think about document and structure, the first most important things that you have to do before even diving more deeply into content. Or HTML or whatever. Declare page language. Because otherwise, if you have content in French, but you do not declare actually that language,
12:21
you will be having your screen reader read that language as it was talking as a Del Boy charter from Only Fools and Horses. Somebody know that series? It's a British series from the 80s. Okay, I'm getting this. This is not a good reference for American public. I'm sorry. That's really, really funny.
12:45
I wish I should have found the Del Boy speaking French. Okay, more things about document structure. Declare title of your page. That's the first thing when the browser loads your web page, the screen reader is
13:02
going to read the title of the page and the name of the browser you're using. It has to be distinctive from one page to another. You cannot have the same one, otherwise the users are going to be without context. Ideally, the title should be similar or the same as the first heading on your page.
13:22
This is the homepage of the K-Lite. This is one of the first things I actually did during my GSoC internship last year. The third area, page landmarks, which can be other semantic HTML5 or area.
13:43
Semantic HTML gives you a lot of great accessibility features for very little development. I'm talking about effort. It's something that you can get into habit of doing correctly from the start.
14:02
Headings. This may be a bit confusing, but this resume, next steps, explore, part of the page where the headings have been chosen because of how they looked, not because of the proper nasty.
14:24
This tool is something I'm going to show you later in a bit of detail. One accessibility checker called Totally checks for all nested headings in your page and shows you what you need to correct.
14:46
Keyboard navigation. Annalie mentioned that yesterday. If you don't like the default one that the browser shows on your project or web, just define your own. But don't put outline zero because that's a big, big, big, big fail.
15:09
Just to show you, because we didn't get to see that yesterday in case you never saw the people who use exclusively keyboard navigation. A man over there has what is called head wand.
15:21
It is the only way he's able to navigate through a web page, pushing it with the little movement he has available in his Mac. There are other devices like sip and puff, which also allow people to navigate by keyboard, or with some more mobility to use different types of pointers like this one.
15:45
For example, for video player, we use the video JS in K-Lite, and it had visible focus already defined in CSS, but it was too slight for me. So I just simply edited the CSS and put a bit more stronger indicator which of the controls in the video player control bar is active at the moment.
16:11
So when you are keyboard navigating through the controls, you know you can see exactly where you are at that point in time.
16:24
And I recovered images and this auto attribute yesterday, so I don't want to stay too long. I just want to say, in our project it wasn't important because it was offline solution. But I cannot stress enough how important this is for search engine optimisation,
16:45
the benefit you get from correctly describing the images you have in your project. Because for all intents and purposes, Google is blind. It doesn't see the image itself. So if you do not put some textual information about what is in that image, you
17:02
cannot reap any benefit, neither for search engine, neither for people who use the screen reader. If you don't have to trust me, just Google image out, you will get more results that talk about how to optimise your search engine than about accessibility.
17:23
Then think about your content development network can be down, so you can upload images. Links and ports, come back.
17:41
Okay, big fail, Anali mentioned that yesterday. Links must be descriptive, do not just click more, click for here or here to do whatever. Put the whole description of where that link leads inside the reader. Label all the forms, check when you test, check the form with errors.
18:11
Are all the fields which are required indicated correctly? Where does focus return once the form is submitted?
18:20
Those are all details, but make form page inaccessible for people who cannot see. Having water through various fields makes sense. It is the same that you would expect when you see.
18:44
Okay, causal contrast, we also talked about that yesterday. I just wanted to mention two things. The correlation deficiency affects roughly about 10% of the population and that is mostly men.
19:00
About 8% men, 2% women if I recall well. That translates to 100 million users in web. So, think about that. This is the tool that I wanted to show you. It is really simple, you can either hold it as a bookmark and choose it on whatever you are doing at the time.
19:21
Or, for example, we had it installed in our project and it executed only when we had the development version. It is actually made by Khan Academy, so it was like an in-house solution.
19:40
Okay, another thing. Redundant color contrast, nice example. Anybody from London here? No? Yes? Okay, it doesn't really matter. Because if you look carefully, do you see something specific about the lines and colors of these metro lines?
20:05
London metro lines? Okay, but do you see something that green has and yellow doesn't and yellow has? Yes, exactly.
20:21
Think about this solution. I showed this image to a user experience lady in our team. She said, wow, the whole new world of possibilities. Because what you have is the possibility to offer alternatives. Do not use color alone to convey meaning.
20:42
Combine it with something else. That is exactly what I did here in this map. So that's the takeout. Offer alternatives. Here for color and contrast. There are several accessible multimedia players with options.
21:02
For example, this one. We don't use that one, but it's really good because it has the option for transcript. That means it loads the subtitles and captions you have and makes it available as a transcript. So it can follow in the block of text instead of a usual position for subtitles.
21:23
And it's signaling you which phrase is read at the moment. The tagged.com website has also a really good example of that. So offering these timed captions and transcripts for your video and audio content
21:42
does benefit anybody who is auditory challenged. It improves comprehension, makes the content searchable and referenceable for everybody. And it can also help somebody who doesn't want to play video out loud. It doesn't have headphones at the moment.
22:02
So you can just shut up the audio and continue to view. Another thing important. Please, please, please, please don't know how to play your content. Awful. People who are not challenged or cannot see.
22:23
I personally hate when it starts playing. I have the Firefox extension which blocks all the videos. Flash videos until I specifically tell them to start playing. So there are ways and ways to let your users how to actually choose whether they want or not
22:42
to consume some really nice piece of video content that you created and produced. So that really, really big accessibility thing. So don't know how to play. But let it play. So if you have an audio version of your content either natively or make it available to screen readers.
23:05
That benefits both blind users and all those who prefer maybe to listen instead of reading. If you are, for example, driving, you would probably prefer to listen to something instead of reading.
23:23
Another example, what I did last year with KLA. This is for example the part of the page where the learner is presented with their progress. So you have one specific type of topic.
23:42
Addition, subtraction. There were two videos and two exercises. The learner did not start video but they did start. Both exercises did not finish it. When they finish it, it starts to be dark green. Another topic in this lesson. So this is how it looks like for somebody who can see.
24:01
When I put this page through the screen reader, this is what it read. Having level two clickable link. That's how it reads. Because the screen readers always give the user the context. So at this moment I am reading what is heading in this page.
24:23
And it is also clickable. And it is heading level two. It is not h1, it is h2. And it is also clickable because this is a link apart from being a heading. Then the textual information, what is an issue with the subtraction. Then it read two.
24:40
That's this little two here. And then it goes down, it says two, this is two. And it says hundred percent because here you have hundred percent. So how much is the learner able to understand from that? Same here. Heading level two clickable link, title of the topic, ten.
25:00
Ten videos. Your learner does not know that. Forty percent is this forty. Sixty percent is here sixty. Three, three exercises but the learner does not know that. Hundred percent, hundred percent. So diving into this in bold.
25:23
Using it for the K-Lite we use the Bootstrap. So there was this class, screen reader only. SR only. So that effectively takes away from the page whatever you put inside. So the people who see your page cannot see it.
25:41
But it is read by the screen reader because it is still in the page even though it is not visible. So this is the kind of job that I had to do with diving into all these conditions. Inside handlebar conditions. So that the missing information which is essential for the context of the learner is presented.
26:02
So all these divs and spans are the information which was necessary. And the result was something like this. So now we have heading level two clickable link. Didn't touch anything there. It says in this topic there are two videos that goes even before this item appears.
26:23
You haven't started to watch videos. That's because here there is nothing. There are two exercises in this topic. You are still working on all of them because they are light green. Those are the conditions from before you are still working on.
26:41
Or you are still working on all of them. The same thing for this. Ten videos you have completed 40% but you are still working on 60%. There are three exercises. So that's one type of thing that you will have to do. Check the output of the screen reader and then input the missing information some other way.
27:08
Anani mentioned yesterday screen readers are marvellous pieces of software which existed much before internet. But they have a really steep learning curve. So there is one thing that I mentioned later in resources.
27:24
There is a small Firefox extension which will give you the textual output of what screen reader might read. There are other options that I will show you later. Or what will give you approximate because even the screen reader read differently.
27:41
The most used one traditionally, kind of Microsoft windows of screen readers called JAWS. Reads link in a certain way and NVDA which is a free version getting popular every year. Links slightly differently and there is no standard for that.
28:05
So with this I would like to close a bit the chapter about stuff we did. These low hanging foods we used to do accessibility improvements for KLite.
28:20
I am going to jump to the new product. It is called Kolibri, the second generation. It was the ideal solution to start baking in accessibility from the beginning. Which is how it is supposed to be done. So let's see what it looks like when you put accessibility from the start.
28:41
Mike Gifford is not listening to me today. A person who works a lot on accessibility for Drupal. So he is a great accessibility geek to follow on Twitter.
29:01
He is quoting somebody else saying accessibility is a blueberry muffin. You can put berries inside afterwards. So what are we trying to do with Kolibri? Collaborate so when the design team started to work with the early prototypes and putting down the wording and examples for the usability style guide
29:24
the accessibility is taken into account. Start leveraging semantic HTML5 right from the beginning. It is not easy to choose a JavaScript framework or library
29:42
because a lot of them do not have accessible components. Some do, Polymer comes to mind. We end up using Vue.js. Some things can be accessible, others you have to work on them at home.
30:01
But you consider that whenever you are choosing all the frameworks. And when you start working, when you choose one, then you take into account that you have to keep adding accessibility on your behalf.
30:21
So this is one of the first prototypes the design team proposed. Real nice, clean, but passed through the checkers. Contrast was not ideal. So basically, IP iterating accessibility is the same as anything else you iterate in your development process.
30:41
You discuss it with the team, see what is working, what is not working and you end up with an improved solution. So this is much cleaner, more or less similar to what they had in mind from the beginning, but at least green all over regarding contrast. Then you have to brainstorm about the position of the elements.
31:03
How do you want to put the navigation? Do they go into a header? Do they go into the main piece of content? This is all the stuff that we did lately. Also another thing that you keep in mind is sometimes you CSS the position differently, your piece of your project.
31:24
It can be one way in HTML, but then it turns out another way when you render the page. And then discussion about accessibility properties. This is just, you don't have to read this. Accessibility properties of elements happens the same way it happens
31:42
for all the other things that your product features. You discuss them. For example, this one would be try to use UJS, I use this videoly hidden class, and try to leverage something without working on the component itself.
32:05
So we have these attributes for the icon. It gave the information. This is a Chromie. You have the content here. What is red? Accessibility properties in Chromie. Inspect window will give you what will be red.
32:21
By the screen, this is kind of a mouth. So this was the first idea. Then we ended up correctly computing, adapting the component itself. So this is the content icon component, and we computed the alternative text, so it can leverage those two properties automatically.
32:43
And I just wanted to include this because I was so proud. I was mostly MAA last month or so. So my team worked, I kept an eye on what they were doing. They were doing book bash yesterday. And I was so proud because
33:02
they reported that kubernete navigation doesn't work on audio player, kubernete doesn't work on video player, tabbing through PDF viewer does not. So I was so proud that the last year or so that we were working on including accessibility stuck. They are including that into workflow.
33:21
So I'm just including this slide because I'm proud of my team. How did we do that? For the last six or seven months, I've been practicing something called accessibility pill. I tried last year doing my internship to do like a big one hour presentation about accessibility for the whole team,
33:41
and there are also a lot of interns from San Diego, University of California San Diego, but that kind of did not get the result that I wanted. So they changed the format, and in all hands meeting that we have once a week, I tried to present the bite-sized information
34:01
about accessibility that I could fit into ten minutes. Choose a small topic. It doesn't have to be this is a collection of slides that I had these last six months. We are happy to share if you want. It doesn't have to be a formal slides. One day we did the demonstration
34:21
of how to pull the alternative text for tweets or for Facebook posts. So our social media people can practice what we preach, and whenever they tweet or put the Facebook post, they do that. Or one day I made them sit around the table, turn around and watch the walls, and another person of the team
34:42
put up two short videos from YouTube, which were actually with audio description. It's the only way the blind people can watch movies, if the movie is audio-descripted. So you have the explanation of the context. So it doesn't have to be a big formal thing,
35:04
and it doesn't have to be one person. Everybody will tell you that you get best results if you have somebody spearheading accessibility in the team or in the organisation. If you don't have that person, it doesn't have to be a burden of one person.
35:21
You can divide that. Anybody can prepare research in two hours and prepare the small bite-size information about accessibility once a week. If you have a team, then it will take every two months to get to the same person again. So that information and accessibility
35:42
becomes part of the workflow. What I created also was a tool repository. We have it in our wiki on our GitHub page. So that's like if they have a question and don't know what to use, there is also a list of tools that can be used.
36:06
Accessibility is a shared responsibility. So on this webpage, the Accessibility Initiative, there is a nice table that you can study if you have a more formal and bigger organisation, how to separate responsibilities
36:24
so it doesn't fall on your person. Especially it should not fall on QA, because if you didn't do it before the QA phase, then you are in trouble. So to sum up, put accessibility in your everyday development team life.
36:43
I'm happy to share the accessibility fields. I'm happy to share all the links from the tool repository if somebody is interested. Don't rely on automatic testing. Try to implement it, of course, but the technical compliance, meaning when the checker says yes, everything is green,
37:01
doesn't meet functional compliance. If in any way possible, involve the users, test with actual users. It's a process. It's not like a project. It's not one phase. It has to be done from the beginning. Rome wasn't built in a day and there is no such thing and 100% accessible. But you can fail and then you can fail better.
37:25
And I here have several slides with resources. I'm not going to dive into it, because we are finishing time. I want you to leave five minutes for questions. They're going to be inside the slides for almost everything that we mentioned.
37:41
There are links with tools and resources. I just wanted to say that with all these resources, it's never been easier. Play through our resources. So improving accessibility does involve additional effort,
38:02
the effort of inclusion and thinking about how to present our content to people who may not consume it the same way we do. But that additional layer of effort, to use the quote from one of my favorite sci-fi characters, this cause is just and it's fair and it's necessary.
38:22
So from both human, business and legal point of view. So please go and make your content as you care for all your users. Thank you. I think we have exactly four minutes.
38:46
So thank you so much. That was an awesome talk. The question I had was around finding real users. If you don't know people from certain communities, how do you not find them, but how do you find them and ask them to test your products
39:02
so that you can make sure you hit all your accessibility? This question comes up every talk. It came yesterday with an analyst talk and it's not the first time I hear that. There is no simple answer to that. And it differs from country to country. In some countries you have associations of users
39:21
to whom you can eventually reach and treat the possible testers from that community the same way you treat the subjects for your usability testing. The same way you are paying the people to participate in your usability testing,
39:41
you probably have to do something similar. Of course, since we are talking about the reuse population, it's going to be that much harder to find them and to actually engage them into something, but it is doable. The only thing I can recommend is actually going to, if in your territory, your country, check out the associations and the citizens groups
40:06
who try to influence the policy in that sense, they will probably have a contact. I'm sorry I don't have a better response today.
40:22
So one other quick question. Could you put up your slide with the resources with the screen readers? I mean, I can get the slides later, but I'd love to see it. You blew past it pretty quick. I'd just like to figure out how to do the Firefox extension that gives you the ability to see what the screen reader needs. Oh, thanks. Thanks?
40:40
Yeah, thanks. Gotcha, thank you. No, because I usually want to make my slides in PDF accessible and that's a little bit more effort, so that's why my slides are not immediately available after the talk. But they will be, I will share them in Slack, I will share them on Twitter, on my slide share page,
41:01
so they will be there, just maybe not today, maybe not tomorrow. Because PDF accessibility also requires a bit more effort. Other questions? Hi, thanks for the great talk.
41:20
I'm curious about how screen readers deal with some of the dynamic content that I'm going to guess a lot of us are putting together, so dynamic Ajax requests that are put through a client-side template and then dynamically altering the DOM. Are screen readers able to deal with that at all? I would say that the modern versions,
41:40
the recent versions of screen readers, of course, have that option. But what you have to do in your page, there are several area problems and properties that's rich accessible. I'm not even sure how to pronounce that. Anyway, they have properties that you put into the content which is refreshed.
42:01
So it tells to the user if something changed in the meantime, for the first time the page loaded, it will announce that. So you will have grades, you will have area polite, which means it doesn't interrupt users into anything they're doing, and there is area noun strict or something like that,
42:23
check the specification, which will announce it immediately. So if something like really big error is happening, you have the option to tell the user, listen, this has changed, you have to pay attention to this immediately, of course, use that with consideration.
42:41
So yes, there are certain things that you can do to inform the user about dynamic content. I'm anyway available after the talk, I'm available for the next two days,
43:03
so if anybody wants to chat or learn about anything else, you have specific questions, please do come around. Thank you.