JOLY: Okay. So 2 minutes past 1:00. And I have restarted the recording. And I do see we have Muhammad on the line. >> Yeah, hi. JOLY: Hi, Muhammad. Were you on last week? >> Not last week. I was there the week before. JOLY: And where are you calling in from? >> I'm calling from Pakistan. I am with ISOC Islamabad chapter as well. JOLY: Very good. Let me just see if I can share screen here. It's interesting. When I go share computer sound on share screen... >> Actually, I am on mobile. JOLY: You're on mobile? So you can see me, right? >> Sorry. I am visually impaired as well. JOLY: You're visually impaired. Okay. So... >> It would be no use for me to see or share the... Yeah. If it's a presentation on your screen, that would be good. JOLY: Yeah. So... Because what we're actually working on is using the Zoom software -- I'll move it over here... And make this... Active speaker... But it's to use the Zoom software to actually overlay captions on the screen. So that people who are hard of hearing can read what's going on. So it doesn't help you, if you're visually impaired. But it would mean that someone who can't hear... So that's why you see me kind of messing around with screen sharing. And what was interesting is that when I go to screen share, I have an option which says: Do you want to share your computer sound. So I say yes, in case I'm gonna play a video. But in fact, what's coming through my computer sound right now is you. You know, so I'm wondering if you're hearing yourself back over... If there's an echo. >> There is a little bit of feedback in the background. Yes. JOLY: When you speak, you hear an echo, right? >> Yeah. But not right now. It was in the start of the call. It was there. But now I think you adjusted your settings somewhat. JOLY: I think that the software adjusted its settings to cancel you. And that's why it's a good software. >> It's good. That echo is not there anymore. JOLY: So, Muhammad, you know Navid? >> Yeah, he's a good friend, actually. JOLY: He's a great asset to the Internet Society. For the whole region. So what I haven't done yet is to edit his presentation that he gave us a couple -- three weeks ago. And post it up as a separate video. For everybody to see. Which I think I will do. It's on my list of things to do. >> Okay. Actually, during last year or two, we have been working quite closely. And I think most of the things that he might have mentioned with disability, I more or less have been the part of those things. One was the accessibility project. We had a seminar here in Pakistan. And then we have had the mobile app competition awards, 2016. And there is another thing that we give some inputs onto the national IT policy, being called Digital Pakistan 2017 Policy. So these three were the highlights of our year and a half work that we did together, I think. JOLY: You know, apart from the project that just won the award, which I think is Armenia, you and them are the two things that we can look up to, as, like, the shining examples of people doing good work. And one thing that Navid talked about is how you managed to involve the regulator by pointing out that without accessibility, people couldn't pay tax. Because they couldn't access the tax ports. MUHAMMAD: Yeah, exactly. And in fact, I also consider this the hallmark of our achievements, that our regulator, as well as our ministry, Ministry of IT, Information Technology, was also involved with us, during all of this process. So this is something that we can perhaps replicate in other parts of the world as well. JOLY: Well, I saw that there was someone who was on the call from Kenya -- took that to heart, and he's gone to the ISOC Kenya chapter and said -- look, this is a good approach. And they're talking about it now, in Kenya. MUHAMMAD: Oh, that's wonderful. JOLY: Yeah. So today... It seems we're still having difficulty pulling a crowd. We hope that we just keep going at it, and eventually they'll start showing up. And I have to pull some... What I have to do is arrange some good guests that people will say... Okay, I'm gonna tune in. Because that person is gonna come and talk for us. MIRABAI: I wonder if the term "special needs" is a turnoff. I've known some disability people who really dislike it. JOLY: And the Disabled and Special Needs Chapter -- I've become an admin of it. So I've emailed everybody who's a chapter. And we don't see anybody. Anybody showing up. I mean, I only did it like an hour ago. But... >> Yeah. I just saw your email. I think it was half an hour ago that you sent that email, right? JOLY: My method is... I'm very much a last minute person. So I don't give a lot of notice. It's either I just sit down at my computer and say... Okay, what's happening now? And then I go for it. You know. This morning, I actually watched a great session of the US House of Representatives talking about how they're gonna bring broadband to the whole country. And the issue is that the data -- they don't know who has broadband or not, because the Federal Communications Commission goes to, like, the incumbents, and they say: Oh, yes, we have this whole area covered. This is our area. We cover everybody in this area. Whereas in fact they don't. And then... MUHAMMAD: Well, that is government for you. JOLY: And then the telephone companies are getting -- using their money to get the states to pass laws that say that no city can start their own broadband system. You know. They outlaw municipal broadband. And they've got all these people that are kind of shills, that say -- yeah, if the city sets up broadband as a utility, it's basically gonna ruin innovation, because nobody is gonna invest in the neighborhood. And you're gonna be stuck -- the people are gonna be stuck with crappy broadband. And the same thing with net neutrality. Unless we repeal net neutrality, then nobody is going to invest. And we'll all be stuck with crap. Whereas we know in fact that's not true. Fortunately, some of these -- some of our Congresspeople are not so stupid. And there's a Representative in California who's really taking these people to task and saying -- yes or no: Has anybody from a telephone company said that they've actually not invested because of net neutrality? And the guy is saying... Well, I've got a whole paper on this. And I believe... And has anybody actually said this to their shareholders? Because companies have to tell their shareholders the truth about their investments. And their money. MUHAMMAD: That's really interesting. JOLY: So, you know, it was a good piece of smackdown TV that I watched this morning on this. But going down to things that I actually looked at, to say... Let me see if I can just pull the first one out. Which is someone called Adrian Roselli, who I'm pretty sure Mirabai knows. MIRABAI: Do I? I don't recall. JOLY: Well, Mirabai, we did him at the NYC Accessibility Camp a couple years back. MIRABAI: Oh, cool. Totally forgot. JOLY: And he does a talk on selfish accessibility. What I have to do to find this... If you'll just give me a moment... I have to go to Slack. And go to WordPress. Are you familiar with Slack, Muhammad? MUHAMMAD: Sorry, you'll have to elaborate a little bit for me. JOLY: It's kind of a thing for when you're working with a team, that it's a way of talking to a team. It's a sort of... You know, a piece of software. A lot of people... MUHAMMAD: No. No. I'm sorry. I'm not familiar with that. JOLY: So I'm on this one, which is for WordPress. Here we go. So now I have this video. And even though this was captioned, Mirabai, in English and French, as you'll see on the event, you can certainly caption it again. I can make it play here. MIRABAI: You want me to caption it again? Are the captions not good? >> Hello. Hello, everybody. I appreciate all of you who've come here, when the alternative is you could be queuing up for an early lunch. I had thought about doing the same and then remembered I had to be here. So I am doing this talk, selfish accessibility. I would like you to know that the slides are already online. The URL is rosel.li/wceu. So this is potentially useful for people all the way in the back, who aren't going to see all of the text or the images in my slides. You can follow along. Which means you can conceivably leave, go to lunch now, watch the live stream, and follow my slides. I would do the same thing, except I'm giving the talk. So that's just a bit awkward. The good news is: After a ton of editing, I managed to get my slides down from 108 slides to 121. That's the wrong reaction. But that's also really, really nice to hear. So I'm gonna be flying through a bunch of slides in the middle. There's technical stuff and not-technical stuff. If you were in Riann's talk earlier, then I'll just throw away about 60 slides, because she covered it. So thank you, Riann. You jerk. Okay. Look... Introductions. So I have a slide dedicated to my ego, just so you know that I'm not just somebody who makes crap up. I do, but other people seem to think there's value in it. I've written some books and some articles. I have a website, at Adrian Roselli.com. You can also avoid me on the Twitters, at @aardrian. Just hit the "mute" block. Unfollow. This is a group around accessibility remediation and compliance. They're the ones who allowed me to be here today. Yay! They're going to be surprised when I submit my expenses. You guys are laughing at that, but it's not funny. Also, this microphone tastes like croissants. Okay. So... Some of you might have seen this a11y, and I want to give you a little bit of context for this, because it's common in the industry. It is a numeronym. What we do is we take the A and the Y and we take all the letters in between, and there are 11 of them, and we replace them with 11. So a11y means accessibility. There are analogs already. l10n for localization, i18n for internationalization. This is handy, though, if you go out to the Twitters and you do #a11y, you're gonna find a lot of people talking about accessibility. For good and/or for bad. So for a little bit of context about accessibility, I maintain that accessibility in general gets no respect, no matter where you go. This is a photo of when we were first remodeling my office at the company I used to have. Which I don't now. It's hilarious. So some of the paint colors -- the green post is Lime Rickey. The ceiling, that grey is called Cyberspace. The blue pillar is called Online Blue. I don't know why. So they have -- Sherwin Williams went to all this effort to come up with these really compelling names. Oh yeah, we did move out of that office. They came up with these really compelling names and then they came up with "accessible beige". For those of you in the way back who can't see this, you're not missing anything. It's the same color as 1980s era PCs. Old machines. So my partners thought it would be hilarious to paint my office accessible beige. This might explain why I no longer have that company. So these are the things I'm gonna cover. I'm gonna run through some statistics. I'm gonna go through my thesis of how to be selfish, talk about some experience models, technical stuff, WordPress, and we'll wrap it all up. So first off, statistics. Again, I'm gonna go through these relatively quickly. But I want you to at least be aware of them. In the US, if we talk about anybody who has a disability, in that age range of 21 to 64, we're looking at 10% of the population. In that 65 to 74-year-old age bracket, that number jumps to a quarter of that population, and continues to climb. And this includes visual, hearing, mobility, cognitive, et cetera. Any type of disability. Worldwide, 285 million people have a vision impairment. And as these numbers show, that number tends to climb with age. Hearing impairments -- 360 million people worldwide have disabling hearing loss. And that's disabling. There's a far greater number of people who just can't hear what I'm telling them at a party, or they're lying to me. Probably the latter. So again, that number tends to increase with age. Mobility impairments -- 5.5% in the US, in that 21 to 64 age bracket. That percentage increases with age as well. Cognitive impairments are a lot trickier to try to identify. I've listed some examples. Dyslexia, discalculalia, which is the numbers equivalent, essentially, of dyslexia. Memory issues, ADD, ADHD, et cetera. Lots of different things. We're talking about 4.3% of the population. And that's just the ones that are necessarily diagnosed. There's a lot of people out there who struggle with different kinds of impairments, and it's not diagnosed. And some of them are not as easy to define, either. I probably shouldn't have put the clicker down. Priorities, right now. So here's the thing: I have been to lots and lots of accessibility talks over the years, where people talk about numbers. And they try to motivate you to think about how many people you're going to benefit. And in my experience, that is useless. It doesn't work. People aren't necessarily motivated by that. So my thesis is about how to be selfish. WebAIM is an organization called Web Accessibility in Mind. And they put together this great hierarchy for motivating accessibility change within an organization, on a project, et cetera. And it starts off by guilting people, which is kind of a mean way to do it. You punish them when they don't do it right. You make it a requirement, so they have to do it, in order to, I don't know, get paid. Then you start to turn the corner. You reward them for making things accessible. You hopefully will enlighten them. And ultimately you want to inspire them. You want people to feel motivated to take on accessibility themselves, and just make it happen. It doesn't always work. So I put a star on top of this tree. And I call it "Make It About Me". Very simple thesis. These other things don't work. So maybe I can make it about me. So here are some ways we can look at that. One of them -- when we think about getting older -- I showed you some stats earlier. As numbers of impairments tend to increase as a percentage of the population -- getting older is something that affects nearly everybody. With some exceptions. You might be fortunate, if it doesn't affect you. It's probably a pretty dark thing to say. Nobody is laughing. So clearly I have a darker sense of humor than everybody in this room. It does carry risks and side effects. Definitely not for the young. As evidenced by the very few number of young people I see that are old. See, that wasn't even funny. So looking at these two couples sitting here, think about it for a moment. What's different between these two couples? What separates them? Besides about 5, 6 feet on the curb? The only thing that's separating them is 30 to 40 years. Otherwise, they're probably doing the same thing. They're probably trying to figure out where they're gonna go to get some food. All the restaurants are closed! They don't open until 7:00! We have to drink three bottles of wine and just kill some time. Really the same goals here. There's not a lot of difference. It's just age. That's it. These two women -- separated, again, by a foot, two feet, and 30 to 40 years. Trying to do the same thing. They're both hanging out in the sun. They're both reading. One of them is smart enough to use a solar-powered device that doesn't require battery backup. I'm just gonna cross off the rest of my jokes. JOLY: He's talking about a book. >> I blame it on the translation. Because I'm speaking English very quickly. I understand. So another thing to consider. Accidents. Sort of a situational disability. Where you might be temporarily disabled. And that comes around from things like broken limbs. Eye injuries. Hearing injuries. Head trauma. I am sort of the perfect case of all of these. All of these scenarios have happened to me. I've broken bones. Jacked up my eye. Been deaf for a while, from running concerts. And I have a row of scars on my head. So I've collected everything here. I don't recommend doing that. If you've had a broken wrist, a fractured wrist, a repetitive stress injury, then you might be familiar with having your hand disabled for a while. And in a cast. Very difficult to use a mouse or a keyboard, when one of your hands is out of commission, or the entire arm. Maybe you poked yourself in the eye. Just keep clicking "close window, close window", and now you've lost some depth perception. Makes it a little trickier to make sure you're typing correctly, grabbing the mouse, opening the door, pulling something out of the cabinet. Arguably some people do it as a fashion choice. I can't explain that. There's also this notion of cognitive impairments. That you know are coming. Or maybe you already have. So there's a British guy in the front row who's laughing at this. That's a Wheel of Cheese. These guys are running down a hill, at top speed, chasing a wheel of cheese. You could argue that none of them is impaired, when this race starts. But they put ambulances at the bottom of this hill, because every year, when they do this cheese wheel chase, people get injured. They always load a bunch of people into ambulances. This is very much a scenario where they don't start off disabled, but they absolutely finish this run disabled. Permanent or not is a different conversation. You might think that, like me, you are invincible and allergic to nothing. But there are situational modifiers that come into play. You might pretend that you can multitask. You might work in the sun, eat at your desk, not have headphones handy, or the content is not in your native language. Like, mine would be English. Usually. So this is sort of an analog to how I do my work. I sit at the computer with one hand working, and the other hand holding a taco. Or since I'm here for another few days, a croissant, with butter dripping all over my laptop. Which means I'm limited. I'm down to one hand, essentially. And I've always maintained that everybody is a keyboard user when they're eating lunch with their mouse hand. It's really that simple. We're all keyboard users every day around lunch. I like to work on my patio. This is not my patio. In the sun. And when I'm working in the sun, I have to turn the brightness up all the way on my computer. And think about just when you're outside. And you're using your phone and you're trying to tweet or text or look up the schedule or whatever. It's very bright. You have to turn your screen brightness up. The contrast becomes an issue. It's a real thing to consider. These guys are professionals. These guys are multitasking pros. They are so on the ball, they brought a tarp. I mean, how awesome is that? But look at them. They are multitasking. One of them has one hand on his phone and the other on his cigarette. The other is not even using his phone. He's just that awesome. But arguably, they're distracted. They're probably not super focused on the task that they're doing, and there are things that we can do to benefit those users. I know that I fall into that scenario. This guy, however, is my favorite. I would like to point out: That's a typewriter. I mean, really. He's got the whole sun thing sorted. And contrast, and other solar powered devices. Some people I see regularly working in cafes. This is the guy who's probably doing some video editing. Might even be teaching himself, based on the number of manuals sitting next to that camera. And this is a case where the headphones are really important, because he can't necessarily hear the audio, if the cafe is full of people behind him, and they just pull one espresso. Then he can't hear anything anymore. Some of us have to consider what we're doing when we have a partner in bed with us. Playing audio and video -- not so compelling when you're afraid of waking up the person next to you, or in this case maybe you don't watch videos of squirrels when the dog is laying next to you. That's a big dog. Big, big dog. This is sort of analogous to my living situation. I live in a tiny, tiny house. But I live between people with motorcycles. And they like to have these motorcycle duals on the weekends. One likes to roll his out and rev it, rev, rev, rev. And as a result, I can't have a conversation, because all I hear is a motorcycle. This is why my television has closed captions on permanently. Because I never know when they're gonna start. And they wait until that scene in Mighty Morphin Power Rangers when they reveal the bad guy. Oh, some fans. I sat down at a keyboard in Spain with letters that were unfamiliar with me, and I'm using an operating system in Spanish and surfing websites that load by default in Spanish. And I think I can speak some Spanish. You really can't when you're in a panic situation trying to use a full system in a foreign language on a keyboard you don't know. So the language barrier becomes a problem too. And some of the affordances that we think about for accessibility can benefit those situations. I'm from America, where we have Thanksgiving every year. We murder a turkey and eat it. And the last thing that I want to do is spend that visit eating this poor murdered turkey sitting with my parents, changing printer toner and putting paper in and cleaning all the viruses off their system, and all the custom cursors and icons. So realistically, you don't want to be tech support for your family if you don't need to be. You don't want to lose all that potential time you could spend hanging out with your family, by sitting, crowding around the computer and trying to uninstall, uninstall, uninstall. So I'm gonna talk a little bit about some User Experience models. Normally I do a show of hands, but thank God, I can't see past the front row. Aria! Hi! Otherwise I would be panicking. Which is awesome. So what I'm gonna do is talk a little bit about user stories, in the context of these things that I've put on the screen. The word will come to me later. I'll shout it in the middle of the night. So here's an example of an... Here's an example. Of some of what I've been talking about. As a user on a sunlit patio, I want to be able to read the content and see the controls. This is a tangible user story. As a user in bed with a sleeping spouse, I want to watch a training video in silence so I can get caught up at work. In order to click links as a user with no elbow room in coach class with a tiny track pad, I want click areas to be large enough and adequately spaced. I know I'm not the only one who flew here on goat class. So I didn't even bother pulling out the laptop, because it's just impossible to use. As a user distracted by the television, I want clear headings and labels, so that I don't use my place. Pretty straightforward. These all feed into some personas. These user stories help inform these personas. You might have a different model and a different approach. I'm not trying to tell you a right or wrong way to do it. Just give you some ideas. What's great is that Sara Horton and Whitney Cresenberry have written a book called A Web For Everyone, and they have personas for people with disabilities that are available for free online. And if you look at the slides, there's a link there, and you can follow it. And they've done some of this hard work for you. They've identified some of the disability types and created some personas to support them. In my experience, though, personas like these tend to get kicked out pretty early in the process. So you're trying to get that number down to three to five personas, and many cases -- so your blind persona, gone. Your person in a wheelchair, gone. So instead what I try to do is I take the personas that correspond to stakeholders and I fold in some of those user stories. Some of those things that they will have some experience with. I'm appealing to their inherent selfishness. So I have a stakeholder who I know is always traveling. What are some of the things they experience, coach class? Always having a hand tied up, carrying equipment, or holding champagne, if it's first class. Maybe the sun coming through the window. Et cetera. And I fold those into that person's persona. A business manager, a purchasing agent, whatever -- I look at the things that that person does in his or her job and I fold those into the persona. And now what you're doing is you're creating personas that stakeholders identify with, that have temporary disabilities or situational disabilities built into them. And now they're not getting discarded. Now you're not having a conversation about... Well, we have a colorblind user, or a low vision user, so we need to make the contrast higher. No, no. Hey, Bob, VP of Guy Who Spends the Money on this Project. I know that you're working in the golf course a lot, and it must suck in the sun. So let's kick the contrast up so you can actually see the screen. So I'm appealing to the inherent selfishness of my clients, in many cases. I'm gonna pivot a bit here, and fly through some technical bits, because I feel like I'm behind schedule. Am I behind schedule? Whatever. Nobody is going to lunch, right? Okay. I don't need to see the room to know that that's not gonna go over well. Just gonna run through a series of tips. Use alternative text on images. Please. In a case where the images disappear, the alternative text is displayed. You'll note that there's no text for the kid happily chasing a soccer ball, which is a photo we took right before he face planted into the grass, by the way. So funny. But that logo in the upper corner does have the name of that organization, Buffalo Soccer Club. An organization that my company helped found. It now has year-round programs. I know nothing about soccer, so it was hilarious. I also fell on my face. But all the other images that were in there are decorations. And they can go away and it's no big deal. But that logo is important. So it has alternative text. I'm gonna blow through some of these slides. Because you can read them at your leisure. Oh, look. There's a flowchart on how to choose alternative text. You can look at that when you want. It's just a handy reference. Hyperlinks. It's not uncommon to have sites where you cannot identify what on the page is a hyperlink, until you hover over it with your mouse. Just be smart about that. Avoid those "click here" links. Avoid all caps and emoticons and emojis. Warn users before opening new windows and downloading giant files. Good pagination links. Try to make the links obvious. Make the link text consistent. If you're using an image, as a link, make sure the alt text also makes sense. Please use link underlines, wherever possible. In this image, the color for link text is the same as their highlight color, so if it's orange, I have it in multiple colorblindness simulators... But if the color is orange, that doesn't necessarily mean it's a link. So whenever possible, consider -- you know, you're not Google. You're not some special snowflake, where everybody understands what your site is about. Just use underlines. It's the quickest and easiest way to make sure that links are understandable. And I have some references to WCAG guidelines as well. Use focus styles. You probably can't tell just by looking at this screen, but this is an animation of me tabbing through the Virgin America homepage. I can't tell where the cursor is at any point, as I'm tabbing through the page. Oh, wait. Look. The page controlled. I still don't know where I am. It's an infuriating site that's won a lot of awards for great design, but is incredibly useless to anybody who has any kind of impairment. So this is really easy to fix. Everywhere you have a hover style, add the focus selector onto it as well. If you have any libraries that use focus-outline:none, kill it. Remove it. Just use the tab key. First thing you do when you go to a site, start tabbing. If you can't tell where you are, you've got a problem. I talked about color contrast? No, I didn't? I did? Somebody? Whatever. These are screenshots of that soccer club, showing it in three different views. This is if you have tritonopia, protonopia, or deutoronopia. Those are three forms of colorblindness. It's important to make sure there's sufficient contrast between content and navigation and links and menus, et cetera. And there's some really great things online to walk you through that, and colorblindness simulators for your browser, which you can also add into Adobe Photoshop. If I click the label text next to the field, the focus should go to the field. It's a matter of matching the for attribute of the label with the id attribute of the field. Really easy to test. Use html 5. It's a layout. It's one we're familiar with. You can probably without thinking too hard guess what the HTML5 elements would be, and oh, you're right. Use those elements. They already have nicely built-in support for screen readers. If your site is responsive for all contexts where we're just talking about a narrower screen, same thing. Just HTML5. Still applies. Still very valuable for a ton of users. Try to use only one main element per page. You could use more than one main element, but don't, because the exception for that is too long for me to get in here, with the little time I have left, and I know you all want lunch. I think you want lunch. Use headings wisely. So I have an article with a view of -- an outline view, just based on the heading structure. And even if you can't read the text, you can see it indents a little bit. And that's because my headings structure corresponds to the structure of the content. h1 for the main title and then the subsection is an h2 and the sub to that section is an h3, and I step back out of it, to an h2. Just use good headings structure. If you've ever heard about the document outline algorithm, it's a fiction. It doesn't exist. No browser has ever supported it. So don't think that you can just do h1s all over the place. That can be problematic for some users. Know whether you need to use a button, an input-type:submit, or an anchor. You can style them all to look the same, but that doesn't necessarily mean they are the same. Don't use a div or a span. If the control takes you to another URL, if you can right click and open another window, use an a href. If it opens something on the current page, hides or toggles something, use a button. If it's going to submit form fields, I recommend input type submit. Because button type submit usually overlaps with other styles. Don'ted use tabindex greater than 0. It jumps me down to the CAPTCHA, because they have tabindex 1, 2, 3, and 4 on the CAPTCHA. Whether you use CAPTCHA or not is another discussion. Don't use CAPTCHA. It is okay in some cases to use a tab index of zero. This is an example of a grid I had to build for a client, where they wanted things to only show on hover or make people scroll to see the content. If you have scrolling content areas on your page, the keyboard user can't get in there to make it scroll. A tabindex of zero on that content area now puts focus on it, and the keyboard user can use the arrow keys to scroll up and down and get to content that was otherwise hidden. Please set the lang attribute on html. Make it appropriate for the language on the page. There's a whole demo here where I show off how Firefox automatically chooses between commas and decimals based on your language settings, but it's 20 minutes to explain. Not at all interesting. But do know it has wonderful benefits for screen readers. You can force screen readers to say things in the wrong accent, which is hilarious, if you want to make a dance techo German version of Nick Cave songs, but that's just me. It's also a separate talk. If you saw Morten's talk this morning about grid, where he talked about flex et cetera, something I want you to keep in mind: Source order matters. As people tab through the page, they tab through it in the order of the code in the DOM. That doesn't mean don't screw around with it, but we've learned some lessons from floats and absolute positioning. Flexbox has that order property that can throw things off, so please don't use that, and grid has the same risk. So please be careful. Understand what it will do. Tab through the page. See the impact. Definitely don't disable zoom. You'll never see Bill Murray telling you that you're awesome. Because you're awesome. That's my Bill Murray moment. Whatever. If you go into a page, set the minimum scale and the maximum, and it's fixed. Mobile browsers tend to override it anyway. It's still good practice to get rid of it. Please avoid infinite scroll. If you have a footer or content in the right column, and you want people to get to it hitting the tab key, they'll never get there. I can never get to the grid on the right side when I'm on this page. It's infuriating. It destroys the back button as well. You can't share those URLs to a specific place. Please use captions and subtitles whenever possible. If you're doing video and audio. Transcripts are ace. Captions and subtitles are ace as well. If you've ever used YouTube's automatic captioning feature, it creates some terrible things. This one says: While so long to his Viagra. This is in Sweden, when a guy was introducing me for a talk. I don't know how he knew. But the nice thing is -- there's this site, No More Craptions.com, where you can take the autogenerated captions from YouTube, and fix them up. Make them good. And put them into all these file formats. Grab the video, let YouTube autocaption it, clean it up, upload it. Everybody uses them, by the way. I have slides with links to resources that will walk you through how to use some of these things. Really quick, I'm gonna touch on ARIA here. Riann had mentioned it earlier. For the most part, you don't need to worry about ARIA unless you're building custom unique elements that aren't already defined in html. So don't get too excited about ARIA, because it can be very, very risky. There are five rules to keep in mind if you're gonna play with ARIA. If you can use a native HTML5 element that already does what you want, then do it. Use a button instead of a div with a non-click, for example. Don't change native semantics. If you've got a heading and you want that to be a button, don't. It's gonna throw everybody off. All of your interactive controls that you build with ARIA must be usable with the keyboard. They have to be able to perform those same actions. Definitely don't use a role presentation or ARIA hidden true if it's a focusable element, because that means that some users can never actually get focus onto that element. And all interactive elements must have an accessible name. So a button has to have a name. A link has to have a name. A tab has to have a name. And usually it's visible text. And if possible, you want to convey the current state and what it's doing at the time, and again, Riann had shown a little bit of that, with the ARIA expanded example in her talk. And if you're in the future, watching this on YouTube, you can just go to Riann's talk on YouTube and catch up on that as well. And if you're in the future, I'm sorry. Definitely one thing -- I have this one example I want to show you on how not to do things. This div on click event is a problem, because it won't work for a keyboard user. So I add a tabindex, so now a keyboard user can get to it. The problem is: Now I need to trap the keyboard action as well. So I have to listen for an on-keypress event. And at the same time, I then have to make it not scroll the page, because I hit the spacebar, because I think it's maybe a button. And then I have to throw a role of button on it, so it announces itself as a button to the screen reader, when all along, all I had to do was this. It really is that simple. You don't need to overengineer this stuff. Most of these things are already built for you. Wow. I'm gonna go over a little bit. Whatever. So I had a whole thing I was gonna say about this, but mostly you can go watch the video. And see the transcript. But Riann said something back in March of 2016 that I think is very important. All new or updated code released into WordPress core and bundled themes must conform with the WCAG guidelines 2.0 at AA. Because that's the standard being recognized by governments, in lawsuits, by third parties who are getting on board with accessibility. If you want stuff to be in core, you need to follow this anyway. So get on board with this and accept this. I think it's a great statement, and I think it's awesome that WordPress is doing that. There's some notes related to that. There's the accessibility-ready tag, which you can get for your theme. Including some information on how to make that happen. Note that plugins is -- all plugins -- the accessibility on plugins is the responsibility of the plugin author. So as far as I know, there's still no guarantees on that. I would also like to note that Riann Rietfeld, a year and a half ago, won the Heroes of Accessibility Award in the individual achievement category. She doesn't like it when I say this, but I think we all need to acknowledge... Yeah. Rian's contribution, because of the status of WordPress, has an outsized impact on the web as a whole, and I think it's awesome. And I'm glad that she did that. And as a result, I'm glad I know you, as opposed to me saying... Who? Who did that? There are currently 134 accessibility-ready themes that you can just download and work with. You can just go. So grab them. Ready to go. There are some plugins that are out there now, that have been out there for a while, rather, that help make things accessible. I think Access Monitor uses TENON to do checking. I was signaled I have five minutes and I'm at the wrapup portion of this thing. Here's the general message I want everybody to understand, coming out of this. This whole selfish aspect of it. Supporting accessibility now is really working to help future you. That's what we're talking about. You're all probably capable of using your equipment today. But 10 years, 20 years, that might not be the case. You might be dependent on someone else. So getting it in now is gonna help future you. It also helps the injured version of you, or the encumbered version of you, which could be today or next week, or tomorrow morning, depending on how much you drink at the party tonight. Also, get younger developers to help you. Get them to buy into it now. Force them. Train them. Get them interested. Because once you've moved out of what you're doing today into a different role, you need other people to support this and to support future you. So you have to teach them well. You have to prepare them for this. They have to be able to do it well. I have a couple examples where I wrap up here. This one is what I call the stair ramp. This is often shown as an example of how things can be accessible and beautiful, and what a lot of people who use this in their talks don't understand is that this is a death trap. This is basically a wheelchair murder device. The slope on the ramp -- way too steep. Way too steep. Each one of them ends in a concrete wall. With the exception of this one, which I believe -- I've been told -- ends in a pit of crocodiles. If you are like me, and you take stairs two at a time, it's hilarious. It's step, step, stumble. Step, step, stumble. This is a death trap. It really is. What's important to note, though, is this was built based on a checklist. Somebody said: We need to get a ramp into those stairs. And they followed that checklist. There's a ramp. That's not what accessibility is. It's not just a checklist. There's so much more that needs to happen. There's an aspect of maintenance that's involved here. So a friend of mine who uses a wheelchair was going to his pharmacy, and when he got to the ramp to wheel himself into the pharmacy, he noticed that they had put a potted tree on the ramp. So they shoveled all the other parts, but they put a potted tree on the ramp. He could no longer get into the pharmacy. I mean, good for them. They built a ramp. Checklist. But they didn't think about how to maintain it. And sometimes maintenance is really nothing more than just not breaking the crap you've already built. It really can be that simple. It's an ongoing process. And when you build it right the first time, you don't need to stress about it going forward. I have a ton of links in here at the end. A pile of resources that you can read at your leisure. Again, maybe over drinks. I don't know. And if I recall correctly, that's my entire talk! (applause) Done! 121 slides! >> We have time for half a question. Are you gonna be around? >> Yeah, I'm gonna be around. >> You gonna have lunch? >> I'm gonna have lunch. >> Are you gonna be that expert -- you coming to the party? >> Yeah. >> Should we do questions at the party and have lunch now? We could do, you know. Sound good? Or if there are quick questions from the floor... One last call for questions from the floor. Raise hands or go to a microphone. Lunchtime it is! Thank you very much, Adrian! Thank you! JOLY: I'm just unmuting everybody here. So... I remembered him as being an amusing presenter. Which he was, I think. I'm going to post. Post a link in the chat of his slides. And... To me, the most interesting thing in there was him saying -- forget about... I'm gonna mute Fred for the moment. The most interesting thing in there was that he said to not have unlimited scroll, because you can't get to anything else on the page. Which is something I had never thought about before. I'm actually a big fan of unlimited scroll. I hate having to click "see more" each time. But... So... It's something we have to think about. I think it's excellent work that WordPress does on accessibility. And I'm on the same Slack. I'm gonna copy it over here into -- drag it over here onto the screen here. Oops. That's not it. That's Skype. Here we are. So here we see the accessibility channel on this Skype. And we see every day 50 or 100 messages of people talking about details and just, like, how to do -- engineer accessibility in WordPress. And they've been doing this for years. The amount of work that's gone into this is extraordinary. So... So that was the one thing that I wanted to talk about. And then the next thing was the thing I mentioned, which is that last week, there was the UN meeting. MIRABAI: I captioned some of that. It was cool. JOLY: I can't see my clock now, to see how I'm going. Five minutes left. Okay. There was a session at the United Nations, and on this page here, which is the one I linked to in the notice that I sent out, there is a nicely -- they pulled everything together from this event. And there was a lot went on here. There is, I think, three days of meetings, 9:30 to 1:00 and 3:00 to 6:00. So that's eight hours a day, or something, of meetings, of webcasts, all with transcripts. And so there was a lot of stuff there, of people talking about the CRPD, which is the... I have to remember what's... Google CRPD, to remind myself what it stands for. Convention on the rights of persons with disabilities. And the last thing that I did notice was that they had... I'm just gonna find the link here. Okay. Is that they appointed a new special enjoy on disability and accessibility at the United Nations, who is Ms. Maria Soledad Cisternas Reyes of Chile. Muhammad, are you saying something? MUHAMMAD: Sorry. It was something in my background. Keep going. JOLY: Okay. So... Ms. Cisternas was the President of the Committee on the Rights of Persons with Disabilities, recipient of the prize on human rights, 2014 to 2015. So she's obviously well known there. But this is someone we should try to be in touch with and maybe invite and be on our calls and talk to us about what the United Nations is doing on behalf of accessibility around the world. So that is basically what I have today. I'm just gonna see if I can get Fred on. Unmute Fred. Fred, are you with us? FRED: Yeah, I am. JOLY: So how are you doing, Fred? And how has your week been? FRED: I'm doing good, and my week has been okay. JOLY: So you have any news on accessibility for us? FRED: Not really. JOLY: But you are our most reliable and constant attendee. So I appreciate that. FRED: You're most welcome. JOLY: You were here for the video that we just watched? FRED: Yeah. I think I was about 15 minutes late. JOLY: Yeah. FRED: When I logged in, I realized it was showing the video. But I loved the way that guy presented. I wish I could (inaudible). JOLY: His major point that he spent the first half of his presentation making was that rather than saying that you have to do accessibility to benefit other people, he was saying -- his pitch is you have to do accessibility to benefit yourself. Because you're gonna be messed up later in life, or who knows. Maybe tomorrow. So that was his main thing. Then he was, like, getting into technical stuff, with HTML5. MUHAMMAD: Exactly. JOLY: Yeah. So... I'm just going to... Drop this down a bit. And we're at 1 minute to 2:00. So I guess we might just be done for today. So I'd like to thank you, Muhammad, for coming. And I hope to see you next week. And same to you, Fred. I'm trying to find some other people. And to bring them along. FRED: Okay. MUHAMMAD: Okay. Thank you. JOLY: I'd like to thank Mirabai for doing a good job of typing in captions. MIRABAI: My pleasure! JOLY: Okay. 2:00 it is. Thank you. MUHAMMAD: Bye-bye! FRED: Bye!