A Disabled Devs Journey with Ashlee Boyer

All right everyone please welcome Ashlee Boyer! Hello. I will start by explaining my question, because it segues into a bunch of stuff. I’m actually having foot surgery this Friday and I didn’t do anything, but that’s why I’m sitting. If that’s weird I don’t know what you guys do here. I’m a front end person; I don’t know how to do Ruby stuff, but, So, I’ve never been here.

00:31 - So, that’s why I asked that question, because I will be in a boot, and I probably won’t want to stand that long, so that’s why I asked about the chairs. And that’s good, because that means your stuff is more accessible, or Launch Fishers is more accessible. You chose an accessible space. That’s very good. Oh, I also have a handicap parking tag since it’ll be winter time this one take forever to heal, so if you’re wondering about a cool way to improve accessibility wherever you work. I work downtown. There’s lots opportunities it’s just that that’s called Parking Mobility, I think and what I did today on my walk from the office to my car, it’s like 10 minutes, is you can add handicap spots on there and so that lets people know where those handicapped spots are and I actually added four so there are way more than I thought that were and that was only like a 10-minute walk. So the other thing you can do with that app, is that they can report illegal parking, so if someone parks on the lines, that you’re not supposed to do.

You can 01:45 - report that stuff there, so it’s a really cool app, that I thought I should mention, since it was on my mind. AUDIENCE: Do they make thier money with towing fees, or how do they? ASHLEE: I don’t know. I don’t think so. So, to get to the real part, my name is Ashlee Boyer Thank you for coming this is really nice and comfy I like this space even though it’s dark. I am a disabled developer. I was born with ears that don’t work very well. It’s genetic: my mom has it, my grandma has it, so I can see this really nice progression of what my life will look like and I will be way worse later on that’s great; I’m excited. So I’m here to tell you a little bit about my journey as a disabled developer, and a little bit about accessibility in general.

I just finished college about two months ago 02:35 - after six years. I’m almost six months into my second full-time job. I’m at Sigster. I do front-end web development with React. The system that I worked on previously used vanilla everything, so I learned quite a bit about JavaScript, and my then mentor, now friend, he taught me a lot about they’re really tiny many great things he had learned over the years because he had been developing for about five years at that place. I sort of like to think of him as a human encyclopedia of CSS and JavaScript hacks. We always had a bunch of fun. Well, “fun” in quotes, because it’s not always that fun.

03:17 - But thanks to him, I have a really helpful arsenal of development tactics that people don’t really think about. I use them all the time, Also thanks to him, I had my first exposure web accessibility because he uses a screen reader from time to time, and he just brought that up sometimes when we were making new feature to see what it would say if something would or wouldn’t work with the screen reader for whatever reason, so he got to share a lot of his experiences with me about good and mostly not good experiences with screen readers so he planted that seed for me way back then and I didn’t care about it as much I was probably like a year ago but that was just because I didn’t know about it and a lot of people just don’t know about accessibility so that’s why I’m here. Before we continue though, I would make sure everyone knows this isn’t to, like, guilt anyone for not knowing about accessibility or making excuses for not having accessibility in the past. This is purely just insight from me as a disabled person, and to show you how easy it is to make web apps accessible. So, let’s start with thinking about who needs accessibility.

There are four main 04:29 - categories of disabilities and each come with their own share of strategies for accessiblity. The four categories are visual, auditory, motor, and cognitive. We’ll take a shallow dive into each of these, and not only will we talk about the code side of things, but also content and product design. When it comes to visual disability from the design perspective, it’s important to keep color contrast in mind, and avoid placing text in images. Contrast colors to ensure people with low vision or color blindness can still consume content and text and images can be hard for people to read if you don’t have good contrasts, or like your background is super busy and you put maybe like thin text over the top of that.

Screen leaders are not 05:17 - magic, by the way, they can’t just they don’t have AI they can’t like look at the image and do some magic over that and read what the text is. You have to actually assign stuff like alt text to images and then the screen reader will read that and present the image however you type it to the user. We should also be mindful about text sizes; so 16 pixels is a pretty good base size for body text, but we also want to make sure that all text on all of our pages scales for people that use larger font sizes, maybe with their phones, so we knew there is use dynamic units, like REM or EM units. That’s R-E-M, and E-M, instead of pixel units, and then you know that your text is like this yeah. I personally use REM all the time I don’t really understand EM units, they’re pretty scary. REM does just fine.

06:15 - The last thing I want to mention for this category is… I forgot about that… I’m reading these from a script so I didn’t forget anything… I guess I jumped ahead. But in it just how it works with HTML is you have your HTML document, and it reads just like you might read a book. You want to put things in the correct order that you want it to be presented as. So, for example: you have semantic HTML elements that are more descriptive.

They’re like landmarks, so you have a nav 06:48 - element and a main element and section; and that makes it so that people can jump between sections, so that maybe you know you have blog posts listed on a page, and maybe they just want to see the name of it. It makes it easy to jump to each one, so they don’t have to listen to everything to get halfway down the page. The flow, which is what I was talking about breifly before, is really important because if you add a nav element to the end of your HTML it would be read last, even if you position it at the top of the page using CSS. And then, coming back to the alt text: you want to make sure that that is descriptive. What I’ve learned after being…not immersed in marketing, but Sigster does email signature marketing is…

I guess some marketers like to put 07:37 - like SEO keywords in their alt-texts, and that that’s just annoying; like don’t do that. People put like 10 or more, because alt-text is used for SEO, but a better experience would be describing an image with a sentence or two. Maybe just how you would describe it to someone else, so to help with that you could read it to whoever sits next to you at your work or something. Okay the next category is auditory, and like mine, closed captions are absolutely amazing for me, especially when it comes to sites like YouTube where none of the content is created the same. Creators can have all the expensive equipment that they want, but that doesn’t get them anywhere if they mumble, or don’t look at the camera when they’re speaking, or don’t properly edit and test their content for good sound quality.

08:33 - So, speaking of YouTube - if you’re a content creator, I’m begging you not to use auto-generated captions because they are absolutely terrible…usually. They don’t really have like grammar context, so no commas and capitalization, and since we’re so used to reading English, you know, like in a book with capitalization. Those things work as landmarks to help you, like it reduces the cognitive load on reading it. And if you use auto-generated sometimes it uses the wrong words, like if someone has an accent, they’re usually geared towards English speakers, like really playing no accent. So you’re going to end up with incorrect words most of the time.

So some of these same things relate to podcasts 09:21 - which are typically audio only. I know of some podcasts that record a video too, so you can see people’s faces. Usually they’re really awkward, I think. I would love to listen to all the podcasts people recommend, because there are so many of them. I would look through that while driving or walking, but I found that a lot of podcasts don’t really have great sound. Like the volume will go in and out, or like it sounds like someone moved a microphone for like 30 seconds, so I don’t know why they would do that. All kinds of stuff like that. Or, the volume is just really quiet.

I’ve had one podcast I listen to, I turned it all the way up in my car, and 10:01 - still could not hear it. It was so terrible. So that’s where good testing comes in. and this is also where transcripts can be helpful. Like, obviously, don’t read transcripts while driving please. That’s ridiculous. But transcripts are really nice if you’re sitting at home and you can just pull up the transcript while you listen on your phone or something. But I’ve also found this is helpful aside from that, like with cognitive things.

10:32 - can talk about auditory so let’s move on to the next category which is motor accessibility in this category is about providing multiple means to navigate your site while also keeping each one as simple as possible so thank a few seconds about how you not be it sure that most people use a mouse might use like the tab and the arrow keys to get through forms and stuff like that not really sure I used to have a lot personally but some people don’t really have options to choose what they want to do so it’s important to make sure that everyone you reach all of your content and this also means being mindful about what kind of information is hidden behind collapsible content or tooltips these strategies are also about simplifying things and a lot of accessibility is about keeping things simple but let’s start with some examples so think about Amazon and Craigslist and the first thing that comes to mind when I think about those is like wow that is a ton of stuff everywhere it looks like somebody just vomited all over the place and they can be really hard to digest their first glance they have text or links and buttons and complex layouts and maybe buttons look like lakes it’s a whole bunch of us so consider reducing the amount of text on a page the number of actions a user can perform and the complexity of the text itself reducing these things hopefully makes to reducing these helps make things straightforward for users some other things to think about our animations and autoplay videos in the small animations like fading the underlined week in and out on hover can be distracting overwhelming or across motion sickness he says they’re pretty cool though too so at a minimum provided a way to reduce or eliminate these things it’s really helpful people who don’t want them maybe you know some people with disabilities that fall under one of our these categories I hope taking the time to imagine what it’s like not only know never be in the internet with these disabilities but also what it’s like to navigate the world every single day for me it’s scary walking around downtown every day because I never know someone’s running up on me from behind or missing a red light as I’m walking through a crosswalk which is very scary be careful please it’s terrifying I also see a lot of terrible sidewalks around town massive chunks of concrete missing barriers blocking paths or people pulling their carts at crosswalks and intersections I think a lot of people don’t notice that though so that’s just something to be mindful of the future I’m willing to bet that most of us spent a solid bit of time in the comfort of our own and browsing the internet or watching the streaming service it’s the skate from the outside world and in finishing I watched so much private practice I benched all the time it was fantastic can you imagine what it’s like to try to save the everyday struggles of being disabled at an accessible world only to come home and probably most forms of entertainment also inaccessible it makes it really difficult to escape and I don’t have that’s an example the tribe practice is a little bigger though so that’s why I flew them and I have a little Smart TV - there’s that one there and it’s terrible alone I don’t know why but it well it’s really choppy so it flashes in and out of the different views and then the closed captions I don’t know how to change the color but they’re yellow and that’s good kiss it doesn’t actually look like mountains you see on TV it’s something that you said and the captions are also there that disappeared for like five seconds or more at a time or they’re just really kind so what I did was I switched to my phone now and someone actually works better for chromecast so that’s awesome but that might be something that you might not think about what accessibility is TV apps so the Internet is necessary not everything is just about skating right people do a lot of stuff on the paper stuff they’re like those groceries we interact there with friends and family on social media for example we work there but a bunch of us have the opportunity to work remote we learn there everything I’ve learned about accessibility some of my friends and a lot of coders are self-taught or going through online boot camps everyone deserves access to the Internet the next thing might be tough to hear if any of the rest of it means you’re uncomfortable I’m glad that’s a pee-pee but this comfort is good helps you grow you’re probably not hearing enough from disabled people about what they need most of the stakeholders would gather requirements from you are fully informed we can’t just get the science requirements or our CEOs or high-level executives to call it a day for example so let’s told me in defense of not having accessibility I can’t make an application for someone with no hands that’s not true at all it’s highly offensive because you shouldn’t know that and it’s a really irresponsible statement to make especially since they were not actively engaged in the tech community or today or on technical knowledge it’s very possible to make web applications that were the four people who were missing woods successful products required quality material research there are plenty of books on this topic but I think it comes down to a repeatable two-step process ask questions and then listen really listen so how do you really listen that’s opposed to regular listening by using the knowledge of a given it takes a lot of energy to talk about your disability when you ask people about their experience and needs please don’t let their spent energy be wasted so I don’t have a good segue that’s my web accessibility and ignore the purple things obviously I am disabilities so first thing you might do is go to Google and do a really simple search like web accessibility and constructor here this is a background I never click on the ads I don’t like add more ads I don’t really go to Wikipedia either because I typically just where the sources in there we share our the way the bottom islands run without me Wikipedia is also a really overwhelming sight it was really gross text that’s not really readable right hand but look at this introduction of web accessibility the first my site so web accessibility initiative WBC I think with developers know who WBC are so what I might go look at nut is designing develop since I’m with the paper and write design and I’ll scrotum here looking for different stuff we’ve got tips and resources all kinds of things and look all three practices you might not go to this one first but this is a really nice if I wanted appointment to so over here we have the sign plugins and widgets and are these we just said components I think that’s just a word that they came up with but this is where I go when I want to make a new component and make sure that it’s accessible so that if you want to go to might be a button button component to realize when you make a new component library you probably make a button first it’s just the most use component I think and what they have here is they talk about what the widget does when you might use it and they talk about the different kinds of religion so talk about you know menu button here and have examples and I’ll click on this in a second cuz I’m not gonna hand and then they talk about keyboard interaction and the different are they of those make some properties these are really cool because there’s in shape so example some of these also have several examples and so in here they have ones that you can interact with and they display things in a little bit nicer format detailing so you can easily refer to them later and then they have the good part so these are really helpful for me when I am looking to make new things or they that it we’re about to click on another link or T stands for step to get organized so that was a ton of information so we need to do is simplify it down to exactly what you were doing they need to organize that information I like to do this I also like to travel a lot and it’s amazing Trello is so great because it’s like vaccean or whoever and they also make JIRA which is less much that’s great but I really like this one so making a component library I guess I have this repository where I’m working practicing these things and learning more about accessibility and all the different are any of things so this is how I important hands-on myself right now I’ll pretty much make a card for something new like I have a listbox component which isn’t clear what it is it’s actually like a drop down I wouldn’t know who came up with these names because they’re pretty nice and I’m not very good at naming things so this is how I like to organize things and it’s pretty much like a typical board I think that people like Jared for example the really nice thing that I discovered this week it’s that Trello how’s it get hub power up and you can attach branches and commits and issues or requests I love making things and organizing things so it makes it really easy to see exactly how I’d solve some problem organs and research or something and I have to remember what it’s like for this ok so more on the organization parts I have an issue so I think issues are really nice like what to do check boxes in there I’m the only person on this repository talking to myself you make the text bigger yeah command+ okay so pretty sure that’s just links to the prosper so we’re gonna be better but the next step is to start cutting apple you know exactly what you want to code and coding it it’s just about practice that’s really accessibility it’s just like learning any new concept or adding anything any kind of tool to your day you work but you just have to get used to it that’s really all it is so we’ll go back over here this is my repository if you didn’t know this is usually pronounced of a eleven right and it is a shortened version kind of like internationalization is my HT min and it’s because there are eleven letters between the a and the Y and accessibility you can say a line if you want I say that in my head when I read it but I think it’s a living right technically so online here is keeping things documented so I don’t forget them and people want to read it which I guess people do is I have some scars in here Twitter’s levels really cool for it being a very tiny and bringing thing all right and just organizing things kind of like Shopify I think he looked at their Polaris reiax repository but it is absolutely beautiful and I recommend you check it out if you ever wonder how to structure things they do a really good job of it so I have my components in here and I worked on a button like all the stuff is super brain man that’s why like this is this is not a finished button and on that you should share things before you’re ready to share them that’s the thing rather than weird thing but this is what if they are doing making various components and a list box has dropped out I try to link my documentation where I need to so it’s easy to get to and that is what that workflow looks like I make pull requests to which feels really weird since nobody’s reviewing them and I’m not reviewing them I’m just like hey here’s an idea they’re like but trying to remember which request has me talking to myself before but when you leave something in Trello it makes a comment which is not like a super useful comments just the name of the card I think I haven’t seen anything different than that but then I quote I was like ouch I was cool I don’t have speed skater next except for like I was saying they’re not loud share stuff before you write English in it because you can help other people learning to I think it cuz this is not very humble thing to say but I think it makes you look a little bit more normal to other people because I don’t want to come across as someone who’s like nagging at you to do accessibility like you should definitely do it Sensibility but I’m not an expert that’s what I want to be eventually but I haven’t learned everything and you have to start somewhere so when you share those things you’re helping other people that haven’t started yet either and that’s a good thing to do Internet is good for this thing this actually makes you forget them it does so too long didn’t read quickly Yuri listening but if you weren’t here are the main points that we covered accessibility is indeed it isn’t something that you just push the slide it’s really hard to argue for accessibility so before anyone asks me I do not know the answer because even as a disabled person people still want listened only to that you just have to try different tactics and hopefully it doesn’t thing down to it like you can come from an empathy perspective of right hey it really sucks that we can’t use the Internet you know you should avoid that at all cost if you can and you can talk about money like you’ll have a bigger audience order pizza from there and that for three years now so it’s like something else is really fighting against this which probably could have made their application accessible and they even like in January I think it was they because it’s my best skill actually he’s laughing so maybe my only skill I’m not sure oh hi fives there you go laughing in that box that’s what miles does so the next point is research ask listen and repeat it’s just that’s pretty much what we do with everything else you can do it with another topic like accessibility spread the knowledge that it’s a really good one you learn a lot by teaching other people so you have friends that are wondering about accessibility or people who are wondering about it oh we’re just having discussion about it it’s fun to talk about and on that website where all the documentation is I found the other day with a list box which is the job guy you can turn things into challenging other problems which I mean you like it when were beginners I’m still sort of a beginner I’ve only been issue for a couple years so maybe I’m so interested in fun challenges I talk to a lot of good movies so I make a lot of challenges but one of them is when you’re focused on this drop-down and you hit a key like the letter T what you’re supposed to do is focus the first thing in that list that starts on the team and I don’t know how to implement that but it sounds really fun to implement would you search it would you loop over all the things probably not gonna and this is a lot of cochon just like that that you’ll come across that can make your phone so thank you I have the resources to attach to the speaker notes in this slide a lot of good places to start reading and you can also come talk to me I want to talk about accessibility all the time how about it be in a microphone I’ll get it back so this just makes it easier thank you smaller in size is there like a single facet of this thing this is a good like first push on implementing accessibility site lion it’s sort of like low impact the high reward that you can do the same like let’s start here should have benefit like take it to the higher-ups who may have been resistant past that’s like where would you start something like this or is there something yeah don’t you think about that because I wanted to do more accessibility stuff with my first job about my second one and part of what attracted me to the second is that there were already some considerations for accessibility and I think the easiest place to start obviously depends on how your organization is set up like at my at my first place we didn’t have any designers specific CEO and about it was a great time but I think probably the first place to start would be with colors because you’re not really adding any new code there you might be replacing some existing code like in your CSS and if you do have a design team they’re really the people that make the UX the experience designed to with how many buttons you can have on a page or something like that so that probably is the place to start if you don’t have something like that I guess if you are like me and you use reactive and third-party libraries a lot making sure that it may use new libraries so that they are accessible so searching for accessible components first you may not necessarily have the time to build them which but I understand that that’s true and on that it’s okay I don’t think people are gonna be mad at you showing that effort is what really matter so yeah so I would turian confinement in the spring and one of the talks is actually on accessibility and the recommendation of that speaker was to start with linting rules so for example in react there’s JSX I think than a love and why and extending off the Airbnb one’s a start and then turning those on one by one in your app until they’re all fixed and then another thing that they recommended was using ax the browser extension the one thing that I did find at one of the jobs I worked at is but I’m not sure if this was intended to be their long-term effort but that’s kind of how I viewed it was they were using acts as a replacement for an actual accessibility effort so I don’t know if you the governor run into someone in a leadership role or have another company who’s kind of viewed like well we’ve covered the basics we’re an axe and now all of our elements have IDs or we are using headers that are in the correct order and now we don’t have to do anything else so I don’t know that’s the impression I guys know a few friends of that as well people thinking like doing the smallest amount is enough the same person that told me you can’t make apps for people who don’t need that it’s magic to make text grow with devices or things so I guess he had never heard of dynamic units but yeah I’ve run it without people saying that I’m trying to make the minimum and I would reach enough to spend too much energy on convincing people that accessibility is Amin because that gets annoyed empathy and compassion and if you’re dealing with high-level executives but you’re usually a little older like not perhaps eight thirty or forty is old I’m sorry thirty and forty year old that’s not what I was trying to say about right I teach people how to be compassionate like that’s what parents should do so I don’t really know what to do it by its don’t parent people it’s really hard and it’s probably not worth your effort obviously which is one of the reasons where I left my price shop is because I was so frustrated that I couldn’t convince them that accessibility was important so yeah in town to those that nice lists that she listed in chrome built in it there is a thing called lighthouse and you can do tests on there and it will give you an accessibility score and it’ll tell you things right you have an image on this page is listing an alt text so is she am I supposed to be list but it’s really it’s not a deep dive I saw something write a blog post about they got a 100% accessibility score from my house and it was actually super inaccessible I don’t know how they did it I didn’t end up reading it it’s in my bookmark somewhere but those tools can be really helpful me a little testing is the best stuff if you have time for questions thank you so much expending your energy so is anything about I haven’t made a site accessible I just will straight fess up but it’s in there to think about how I would do it and so people talked about the techniques of like taking their current markup and adding things to it to make it more accessible what about what about just having an entirely separate site that is you get your gee whiz all the eye candy site and then you’ve got another very stripped-down site this particularly for accessibility is that frowned upon in the community do they want just one site with all the same URLs perhaps or would it be acceptable to have something that’s very pared down and very access specific so there are a couple of things there one one person that comes to mind is haulage you don’t love it back are you going to have separate web links for people to know it probably have a top-level subdomain or I’d have a top-level directory that you hit that and that would be your system and then after that all the URLs would be the same parallel what’s of the for lack of a better word main site so that is going to be extra things to remember for whoever has the sub that means crap and the other thing that comes to that is it’s kind of segregating in a way not to separate people so that they don’t interact with each other or anything like that so I’m not using the harsher terms of that word but making extra things it’s going to be hard where as you make two versions of things probably so you could silo that work and one thing it would probably it would be less than work than making two but it’s more work than making one so yes separating those things I really would recommend making a separate site that is different than commercial and I we recommend simplifying like maybe paring down some of the things because you can still do cool stuff with accessibility it just takes a little bit of extra work like making custom components based on the ones that I have Charlie there are people that have made accessible components and test although Rick and I just hope for the best other people are gonna go down with customary things yeah I would recommend making separate things that probably would we will received by people in their disabled community because it would be just another think of being separate and having something different it’s kind of maybe other it is a better word for it and there’s already so much uttering with so many different things.