Making Digital Accessible - Interview With Amanda Mace From AbleDocs - Osom Studio - WordPress & WooCommerce Development Agency Of Choice

Making digital accessible – Interview with Amanda Mace from AbleDocs

How do we make digital tools more accessible to users with disabilities? Maciej Nowak, Partner at Osom Studio seeks answers to this question and many more in a conversation with Amanda Mace, Vice-President of Australasia at AbleDocs. It’s a great opportunity to learn different perspectives on usability and hear some spicy details of the surprising way poor accessibility was affecting people with perfectly good vision.

Maciej: Hello everyone. My name is Maciej Nowak and welcome to The Osom to Know podcast where we discuss all things WordPress. My today guest is Amanda Ma, who is a vice president of Australia Asia at a campaign called Alux. I was really looking forward to our conversation with Amanda because she’s an expert on accessibility and thanks this conversation, something in me just clicked and I started to understand the real benefits of thinking in terms of, um, accessibility problems I learned and on today, and I bet you will too. Without further ado peace, enjoy my conversation with Amanda Mace

Intro: Hey everyone. It’s good to have you here. We’re glad you decided to tune in for this episode of the Awesome to Know podcast. 

Maciej: Hello, Amanda. Great to have you on the podcast. 

Amanda:: No, thank you for having me. 

Maciej: My pleasure, my, my pleasure. We had some travels with hardware on my side, so, uh, thank you very much for your patience. Our today topic will be accessibility, and I would like, you know, to discuss this with you because you are an expert on accessibility. You, you, you have a ton of experience and I guess our listeners would benefit from this conversation in terms of, you know, what does it mean to have accessible website, but also what the accessibility is all about. So, because I, think this is a little bit vague term, not so popular. So I would like to understand, you know, from the expert, what is the accessibility in broad terms. 

Amanda:: So in broad terms, what I do is I do like training and consulting and things like that around ensuring that digital products, so I’m, I’m even gonna go beyond websites when I talk about this. So digital products, so mobile apps, websites, PDF documents, um, even PowerPoints that all of those digital products are accessible for people with disabilities. So it’s essentially the digital equivalent of a wheelchair ramp. 

Maciej: All right? And so it’s not only websites, because, you know, me coming from website world, I, I tend to think about accessibility in terms of the website. So it’s also PDFs. So I, I, I wonder how are you implementing, you know, accessibility, you know, rules or exactly what should we talk about when making p for example, PDFs accessible. . So how, how does it, uh, manifest itself? 

Amanda:: Yes. So there, there are lots of different things to take into account. Um, one is that we have, we actually have a standard. Um, so we actually have two standards. They’re really important. So for PDFs, we’re looking specifically for that format. We’re looking at PDF/UA which is PDF universal Accessibility, um, very clever title. Um, PDF/UA and PDF/UA is, is a technical specification. It’s a standard for what the, I, I suppose, for lack of a better term, the backend of the format looks like to make it accessible for particularly assistive technologies that are accessing the content. And so in order to have an accessible pdf it needs to be done to the PDF/UA standard. Interestingly enough, design isn’t part of PDF/UA and when we talk about design, so color contrast and images and those sorts of things, the thing that we’re looking to is actually WIC HAG or the web content accessibility guidelines, which are much more well known to be frank. Um, lots of people have heard of WCAG or they’ve heard of the web Content accessibility guidelines, which I will call WCAG cuz no one wants to hear me say web content accessibility guidelines a hundred times in a row. All right. But at lots of people have heard of VO Keg at least. Sort of, kind of, um, but lots of people don’t understand WCAG or the scope of it. And when we talk about, um, digital documents, there’s actually a part of WCAG there that sits, um, in terms of advice from a design point of view, and certainly for webs, um, web applications, websites, um, and mobile apps, comes into account, 

Maciej: all right? And, uh, so for example, when, let’s switch to back to the, to the websites. So because from my experience when, you know, we, we have contact with accessibility with our clients, for example, it, it means that we are talking with a big, big account, big, big client, big website. A lot of people will use it. And there is. Not many other occasions when the accessibility topic is brought, um, you know, to the discussion. So why is it like accessibility most of the time, uh, discussed in big banks, insurers, or very big websites or se sectors that are regulated and, and has to, um, implement accessibility roles. 

Amanda:: So there are a couple of, I guess, points to make here. One is that, Where there are rules and laws, of course that’s going to be easier to quote unquote sell accessibility to. They’re gonna require it in order to sign off on some association or for the government to sign off on what they’re doing. So there’s that aspect of it, and that’s sort of the legal aspect, which is really particularly strong in places like North America. So United States has, um, enormous amount of litigation around this sort of area. And you’re at risk if you don’t do accessibility well, but countries like where I’m from in Australia where there’s less litigation around it, so it exists, it sort of exists in the law, but it’s not, um, it’s just not quite as litigious as, say America is. The, the push for accessibility is, is a little bit different. Um, it has to come from a different place. You’re having a different type of conversation. Um, interestingly enough, I think the other reason we don’t have this conversation, um, as often as we should in a broader sense and only with those big regulatory bodies or, or big organizations, is cause I don’t think that us as a accessibility industry have done a good enough job. Educating, accessibility has a massive scope. So when we talk about making products accessible, digital products accessible for people with disabilities, oftentimes people immediately go, we have to make it accessible for someone who is blind and they don’t really think beyond that. So the first thing that happens is someone goes, well, we don’t have a blind customers. Now, of course, that’s probably not true. Um, but also, um, that assumption, well, dangerous is also only accounting for a very small part of accessibility and disability. And so one of the things that we need to do better as an industry is education around the, the on flow effects of doing accessibility really well. And that can be things like, um, a few years ago, Microsoft actually did a great job of illustrating this. So you have something called the, uh, Microsoft Inclusive Design Toolkit. This is a great toolkit. It’s absolutely free. I really highly recommend it. And one of the catchphrases out of that toolkit was solve for one, extend to many. Meaning if you found a solution for a person with one arm, you also found a solution for a person with a broken arm or a parent holding a child, or, you know, my case, my eight year old who is heavy by the way, I’m gonna have the same barriers in my way as a person with one arm. And if there’s a solution for. Well then all of those people benefit. It’s not just about the one in five statistic of people with a disability and the other thing that I think we need to do a better job, um, and this is an industry problem, we need to educate and people need to be able to take it on, is that, um, it’s such a broad scope that it can be overwhelming, right? So it covers so many things. So we could tackle accessible videos in this podcast. This would be a whole podcast on its own, right? It, it’s, there’s so much, and that’s just one tiny little area. So the other thing is that we have to make it bite sized. And I think as an industry we get so passionate. All of the other accessibility professionals I know are really passionate about what we do. We’re very lucky to work in a space that we, that we love and, um, Unfortunately also means that we get a little too, um, excited and that scares people. And it has to be baby steps. It has to be an acknowledgement that this is a journey we can do a little bit better. We can take a baby step and be that little bit better, draw a line in a sand somewhere and go, we’re gonna be better tomorrow than we were today and not worry about being perfect. Um, w which I think is from our point of view as, as a accessibility professional where we need to, to do a little bit better so that there’s, um, a better feel about accessibility as a whole. 

Maciej: And, um, this is, I I’m curious why people would get, uh, stressed by your enthusiasm. So it’s like, uh, I think this is a good thing, and it’s like, you know, your enthusiasm or the experts enthusiasm would mean for the client or for the person that is the owner of the website, that it’s so much to do because he or she’s seeing such enthusiastic person in the on on the other end.

Amanda:: Yeah, I think, oh, look, I’m one of those people who is super excited about what I do and, and I come across probably as pretty highly energetic . Um, but when you start breaking down the details of what’s in WCAG for example, it’s a technical specification. And, you know, if you wanna fall asleep, you can read it, but it’s, it’s not particularly exciting and you don’t necessarily need to know all of the details, but you need to know someone who does. And then once we break down those details, it’s quite intricate. So it’s not just about finding, you know, Alt text for images, it’s which images need alt text, what are the solutions for ones that are just decorative, um, what those solutions look like in different technologies. What is a decorative image over an informative image? Um, and then when we break down, so currently in WCAG, um, we’re at version 2.1. 2.2 is coming, but 2.1 is the current recommendation. In that version, there are 78 criteria, 78 oh. That’s a lot of criteria, a lot of breaking down of potential things that could pass or fail in a standard. And that’s not even taking into account PDF/UA which has its own sort of syntax to it. So, um, it can be a little bit overwhelming. I think people get really excited about accessibility initially, and then they look at the standard and they go, that’s complicated and they get a little bit scared. 

Maciej: Yeah. And all of those, um, 70 something rules are, um, as important. So everyone is, as, every rule is as important as the other rule, or are there rules that are, you know, the lowest hanging fruits when, so for example, I have a website and I want to start implementing accessibility for my website. Let, let’s stick to the website because this is, this is where I, I where I’m comfortable. Uh, so, so, so what would be the first step? Like that wouldn’t require a ton of work, but would make my website more accessible, you know, to disable person or, you know, not disabled, but with some sort of, you know, disabilities.

Amanda:: Yeah. So there, there are some good low hanging fruit. Um, images are one of them. Providing alt text for images is, is really important and really simple to do. Literally in the code, it’s alt equals quote. Description, quote. Um, it’s a super simple thing. And if you have something that’s just decorative, we give it what we call a null alt. So that’s where you have the alt tag, but nothing inside the quotes. Right. And what happens then is the assistive technology will just ignore it because it’s not informative, it’s not providing any information, and it’s just decorative, which means a user doesn’t have to listen to the description. So if you’re a big bank, for example, and you have a image, like a hero banner on your home loans page, and it’s a couple with their arm around each other, and a for sale sign on the, on the sale sign of the house and a little puppy at their feet, that’s not really any information. It’s, it’s sort of drawing the eye. You can make that decorative so a screen reader user doesn’t have to listen to it, cuz it already takes so much longer to listen to a page than it would be to just zero in. Oh yes, that’s the content I need in this. So I need to read. That’s certainly low-hanging fruit. The other low-hanging fruit is using HTML in the way that it’s meant to be used. So things like providing heading structure, very important. Um, using heading structure correctly is one of those really simple things. Understanding the purpose of heading structure. Um, Is it, it, it’s so simple. And yet it’s one of the really quick things that we kind of forget about because everyone’s using, um, you’re like, oh, well I like that font size, so I’m going to use a heading level three here. But it’s not really heading up any content. It’s just the look that you want. Whereas if we’re really smart about that sort of thing, we can go, this isn’t heading up content. I like that size and that color. Maybe I’ll use css and then you use css to, to make it look the way you want to, um, best practice HTML, which, um, shouldn’t be hard. Seems to be harder these days, , um, to find it but best practice HTML is always gonna give you a more accessible product, always. 

Maciej: Okay. Okay. And, and you are also, um, highly active in, um, W3C. Uh, so you are evangelist there, and I wonder what do you do there? So how does, uh, work or, or, or function of a, of an evangelist, uh, look like?

Amanda:: Yeah, so I kind of have, I, I wear two hats at w well, three hats at W3C. Um, so the Worldwide Web Consortium, which is what W3C scans for, um, they’re the people who, it’s the org, it’s a member body organization who make the standards for lots of different things on web technologies, including accessibility guidelines. So I sit, um, in three working groups. They’re related to accessibility, uh, one of them being the one that. makes the guidelines. So I sit in that working group and I get to contribute to making the next version of the next standard. Um, I, I sit in the education and outreach working group, which means I get to contribute to how we, um, we break down those accessibility guidelines and provide information to the general public. So, um, and that’s a real, I really enjoy working in that group as well. And, and there’s another one that I’ve actually just joined, um, the APA working Group. And that’s also, I’m, I’m actually particularly, um, excited about some of the work there doing around digital accessibility maturity models, um, which will be 

Maciej: okay. And, and what is this? Because this, this sounds very exotic to me right now. . 

Amanda:: So a maturity model is basically a, um, it, it’s like a scale. So the idea is to go as an organization, how are we doing? For digital accessibility, where are we? Where do we wanna be and how do we get there? So it’s, it’s taking the temperature of an organization. So on a scale of one to five, one being no, nothing, do nothing, five being embedded, processes of accessibility across the organization. Are we a one, are we a three? And if we’re a three, how do we become a four? Right? So it, um, it’s a way of assessing where an organization stands from an accessibility point of view. And the work that we’re doing, um, in that working group is just really exciting. Um, I’ve only just, um, started dipping my feet into that work, but I, I’m really excited about what’s going to come from it. Um, the wonderful thing I guess about working at W three C and, and being part of the working groups, and like I said, I have a few hats on. So I am chapter manager, uh, for australia, the Western region, which means basically I try to keep the other members in the W3C who are Australian based, um, connected and feeling part of W3C put on events that are relevant to Australia. Uh, for W3C I have my AC hat, my advisory council hat, which means, um, I vote on behalf of my company, uh, on behalf of ABLE Docs for standards. As they, um, are nominated, I review them, I get feedback from the company and employees, and then I vote, um, as a representative of ABLE Docs. And then I have my evangelist hat, which is really just spreading the word about what W3C does, which is create, um, and, and collaborate to create new standards for the web.

Maciej: All right. So it, it’s, you are, you’re really like literally immersed inside all of the accessibility like initiatives because it’s not like, it’s not only like doing work, right? So doing work for the clients, you are also inside the body that regulates the industry for, for accessibility. So this is, this is amazing and because I think this is not all, not often a case where, where I can, for example, talk with a person that is experts in the field, but also takes part in, you know, creating the, the field itself. So this, this is amazing, amazing to hear. And I wonder how, how did it all started for you? So maybe, uh, I would like to, um, uh, go a little bit, a couple of steps, uh, earlier. So how the whole accessibility, movement started for you, you know, movement. You, you started moving towards ACC accessibility, . 

Amanda:: Uh, it’s a funny story. I really, I honestly fell into it, um, which is a weird thing to admit, but I did. I fell into it. Um, so I’ve been in the industry now 10 years and initially I honestly, I had no tech background. Um, I had worked, um, in a little bit in marketing, um, mostly in hospitality, like working front desk in managerial roles in hotels. Um, I didn’t have any te knowledge at all. And, and when I, I was just incredibly lucky that a very good friend of mine, her, her mom, her, her mother was doing a PhD, um, about accessibility. So, um, it basically, her thesis was based on, um, what was happening here in Australia with the National Transition Strategy, where government was moving from paper-based to e-government, um, and hopefully making things accessible. Um, and I was really lucky. Um, basically I, I got an introduction, uh, to Dr. Vivian Conway, who is, uh, one of my closest friend’s mom. And she sat down and said, look, this is what I do. Here’s what you would do if you came and worked for me. And I said, I don’t know anything about technology. I’m probably not the right person for you. And she said, no, no, no. I’ll teach you everything you need to know. And as a woman in the tech industry, can I tell you this does not happen enough. I was so lucky to have another woman in the tech industry take me under her wing. She took me places. She had me, um, help co-author, white papers, academic papers, um, a book chapter. I did a book chapter for a textbook. Travel the world. She took me to conferences, um, academic conferences, professional conferences, introduced me to everyone she knew. She got me involved in W three C initially. I was just incredibly lucky. I, I actually can’t speak highly enough of Dr. Conway. She, she was an incredible influence on my career. Um, and as, as happens, um, I became very passionate. Her passion definitely rubbed off on me. I became very passionate. And, uh, my general rule of thumb, um, has always been never say no. So even if I have to figure it out, Never say no. Um, so I’ve always just said yes. If she said, try, do you think you can write this? And I, oh, yes, of course I can. And I may have lost , huge amounts of sleep over this, but I would absolutely try and, you know, do my best. And she just guided me the entire way. And, um, as, as things progressed and, um, and she headed towards retirement, I sort of started taking over some of the business side of things, um, a little bit more. And then last year, um, in July, uh, she retired officially. She sold, um, the company that I had been working for for the last decade to ADOCs. And ADOCs, very luckily for me, saw that, you know, I had been doing an okay job and said, look, how about you take on the entire region and, and not just this office? So, uh, lucky for me, I’ve been able to do that for the last year and a.

Maciej: great. Amazing. And when, when I’m hearing this, when I’m listening to you, it reminds me of, of this model when there is a master and the apprentice, right. Teaching everything he or she knows, um, uh, to to, to the younger person. And, you know, it’s like, um, it it, it’s amazing to hear because this is also not very popular or not very often happening because you, you can like, look for a mentor and, and luckily you can find it, but it’s also for, for the personal growth to tell a different story when you can work with someone who will be teaching you and correcting your mistakes, you know, on, on the fly or pushing you, uh, to, to regions that are not yet comfortable for you as, as a person. So you, you can grow very, very quickly. 

Amanda:: Uh, it, it, honestly, it’s been amazing. I can’t say enough good things about Dr. Conway. She, um, She definitely challenged me. I, I often said she used to throw me in the deep end and I never sank. So , it’s my own fault that we kept going the way we did . Um, but you need people like that in your life and, and I really do. I aim to be that for my team here. I’ve got a great team under me. Um, almost all of them haven’t come from tech backgrounds and I’ve been able to train them up. There’s one in particular I’m thinking of on my team and she’ll know who she is, um, who I’ve just brought along on the journey, even if I feel like sometimes I’m dragging her by the hair Um, I’m, I’ve brought her along on the journey and thrown her in the deep end and every time, look, she doesn’t think so, I just assumed she can take it. . 

Maciej: Great. Yeah. So, so you can now, uh, reverse the roles, right? And, and, uh, you, you know how to do this already. Yeah. Because you was, you, you, you was, you, you was in her, you were, you were in her shoes ly great. Um, yeah. So, so since we, we tackled, um, the company you worked, uh, you, you worked or still, still working. So, um, what your company do, like, you know, there, there are two companies we know already, right? So, uh, how is, how is it working like, business wise. So what, what are your clients, what kind of problems are you solving for them? Because one thing is how to implement something, but the other, how to like approach the whole strategy for a big organization. 

Amanda:: Yeah, and that’s, um, that’s where I think we do our best work is when we’re, we’re sitting with a, a client who’s like, I have a massive organization, where do we start? Um, and it, it depends on the client where you start. I always say that we have to draw a line in the sand somewhere and it’s always about let’s do a little bit better tomorrow. Um, so we work with lots of different types of clients, um, able docs as a whole, um, does. We, we’re really lucky. We’ve got expertise in sort of every area of digital accessibility. But the team here in Australia really focuses on web in particular and mobile. . So we never just test something and then hand you a report and run. That’s, we just don’t do that. Um, it’s very much a handholding exercise. Um, we have banks as clients, we have government, um, agencies as clients. We have small little local councils as clients as well. Um, not for profits who are trying to do the right thing. Uh, it, it is really diverse, our clients. Um, and interestingly enough, um, the approach to all of them is kind of the same. I really believe in relationship building. Um, I, I don’t wanna be the person you come to to just be audit my stuff and, you know, we hand you the report and you go, go tick. We had an audit. We, we’ve done what we needed to do. I actually wanna hand you the report and walk through what those issues are. Um, w we’ve got some amazing clients who’ve done amazing work and. It’s taken a long time. And that’s the thing, it’s accessibility really is a journey. It doesn’t matter how long you spend with a professional, it’s always going to be a journey. It’s always gonna be need to be something that you invest in, that you continually upskill in. But I truly believe that if everyone does a little bit within an organization, it’s always gonna be better. It’s not up to the QA testers, it’s not up to the developers, it’s not up to the content writers, it’s actually everybody, the designers, everyone takes a little bit of that. And then when you need the verification that it’s all working the way it should, then you bring in an auditing team, like, like mine, and we audit and confirm that we can give, you know, certification or a statement of conformance saying that you conform to the, to the WCAG guidelines. But at the end of the day, it’s, um, it’s about everyone doing a little bit.

Maciej: Mm. Okay. And I wonder how does, how does the report look like? Is it going through all of those 70 something, um, you know, rules and you comply here and here and you have to do this and this in order to comply with this rule. 

Amanda:: Um, a little bit. So we, we actually ha we have two reports, um, that we, we do. Um, one is an in an Excel workbook and this is cuz it’s the one that devs really like to work with. Developers love a good Excel workbook, , I’m sure you’ll agree. And that really does have the checkpoints of pass fail for all 78 criteria. 

Maciej: Yeah. So, so it’s easy. Yes or no, yes or no, right? Yeah, 

Amanda:: exactly. Here’s the problem. No, here’s the problem, here’s the solution. Um, we always provide general remediation advice in our reports. Um, so we have that, you know, the detailed one and then we have sort of a high level what you put on your boss’s desk cuz they’re not gonna read an Excel spreadsheet. Um, so we do have a high level sort of PDF type report as well but the, the detail of how you solve something can be different for different people. Um, for different clients, it can be, as, you know, there are certain things where maybe you don’t have access to that particular code. Um, maybe that widget is completely locked down or that framework you’re using. It’s not your fault. You can’t change it. Um, there’s all sorts of different things. Um, maybe you can’t use semantic HTML, but you can apply Aria and you can make it work with an Aria label. So there are different, um, potential solutions for different things. Um, so what we like to do is we’ll always give in our reports some generalized advice. You know, here’s how to fix this. And it may be, you know, this image needs an alternative. There are a hundred ways to give an image an alternative. It’s not just alt text. I mean, the alt tag is probably the easiest way, but that’s not the only way to do it. So what we’ll do is we’ll give you generalized advice in the report, and then we’ll say for the next six months, We’re on hand, you solve it and we’ll check it for you and make sure it works. Um, we’ll be there when you have a question for you. So we kind of give basically six months of consultation after we do testing to say, we’re here to help you fix this cuz that’s what we really want. You know, I, I think the wonderful thing about the industry I work in is we’re all just trying to make the world a more accessible place. You know, I,  did not, and I am not in this industry to get rich. bHeaven knows so , I only have some options here and that’s to make the world a little bit better and a little bit more accessible in my, in my tiny little way. And my tiny way of doing that is hopping on a call sometimes at, you know, four o’clock in the morning my time cuz they’re an American based client.

And I’m here in Australia and going, look, actually the best way to provide an alternative for that map here are three ways, which way works for you. Let’s talk about this. Let’s talk about, um, how we can best make that happen. We’ve had some really interesting challenges too. I know that before we, we record the podcast, I I told you a story about a particular challenge that we had with color.

Maciej: Yes, yes. I, I I’m waiting to ask this question. 

Amanda:: Go ahead, Maciek. Ask the question and I’ll tell you all of that. 

Maciej: What I’m trying to ask, um, is do you, uh, do you meet like a little bit of a pushback sometimes or client that is not, um, really wanting to do something because this is a big challenge for, for the client or a bigger investment, or there is no will, you know, on the other end, you know, it’s, it’s a broad question, but it’s not always like, everyone wants to do this because this is, this is a hassle to implement accessibility, and it’s not, everyone is like buying the investment, let’s say. Sometimes it can be, okay, we have to do this. We don’t want to, but we have to, right? 

Amanda:: Yeah. Oh, absolutely. And we, we do get pushback. It’s one of the first things you learn in the industry is you need to have thick skin, um, cuz we do get pushback. Um, a great example of that is around branding. So branding colors. Obviously you pick your branding colors and big organizations, right? Banks, um, insurance companies, government, they have they’re color scheme that they love and they’re absolutely wedded to this color scheme. You can’t change this color scheme and heaven forbid they pick colors which are not accessible. And so we have some guidelines within we keg about accessible colors, what can be used for text, whatnot. Um, Even UI components have a color contrast ratio that need to be met. There’s all sorts of great calculations in math around color contrast, but um, they’re pretty set. It’s a pass or fail standard. And one of my favorite examples of how we deal with pushback is to be really creative. So we had, um, a particular client, um, whose color contrast scheme was just not accessible and for a really long time, one of the ways to get around that was they actually had two different branding colors. So they had, um, a regular color and a digital version of that color that way. Even so, their printed documents had a certain color scheme and we’ll say it was light orange and, or like almost a yellow. And then all of their digital stuff was darker, almost like a burnt color because the light didn’t work. The light coloring on a white background didn’t work. And it was really challenging because every time we brought this up, this was a huge problem on the website.So that color was being used everywhere on the white background. It was being used for headings and it doesn’t matter how big you made those headings, it was never gonna pass color contrast. It was being used for buttons. It was being used for, um, even like little arrows, um, everywhere. It was everywhere.Um, and the challenge was, of course, I didn’t meet color contrasts. So they had this, um, printed branding color and the digital branding color and it wasn’t consistent. The branding wasn’t consistent. Marketing was very unhappy. The branding people were very unhappy. So, um, you, we kind of kept pushing along. In fact, it took years for us to have any sort of impact. And there was a particular day, this drove me nuts, I have to admit. Um, because I’m like, oh, you know, this color is just really terrible. You can’t see it. Um, it was really, really light. And, um, I’m, I’m a massive sport fan. I love sports. I have seven brothers, so I blame them for me being Oh wow. A sports fan. Yes. I swear my parents had television. Um, I’m a massive sports fan and this particular, um, organization is a massive sponsor of the stadium here, um, in Australia and I had gone to the stadium and, and I actually chair for a side that isn’t from my hometown is from the other side of the country. So when they come to play here, they sit all of the fans in the same spot from the other team. So we’re always in the same spot, which of course means that we have the same view of the scoreboard every time. And, um, the sport I’m watching is Australian, uh, football. So, um, Aussie rules, Australian rules, football, and um, the scoreboard, um, at, as it was at the time when the sun would go down, the sun would be directly on the scoreboard. And this is a major sponsor. And guess what happens with low contrast when the sun is directly on it, given keeping in mind, I live in Australia where the sun shines. You know.

Maciej: The time.

Amanda:: You know, most of the time like it, it’s, I lived in Western Australia, it’s pretty sunny . So as the sun’s going down, uh, the scoreboard is, um, unreadable if there’s low contrast. So this particular company, their logo was up on the screen and they had like a big advertisement across the scoreboard and the sun was going down and he couldn’t rate it. And I’m, they’re spending millions of dollars to have this advertisement on there. And it wasn’t a website thing, it was an advertisement on a scoreboard. And I immediately grabbed my phone, took a picture, and then brought that to my next meeting with branding and marketing. Amazing. And said, this is the problem. And 

Maciej: now you see it, and now you see it. 

Amanda:: They were like, oh no, that’s not good at all. So suddenly what was a website problem? Became a, this is a branding problem. Why are we using a really low contrast? And they actually rebranded entirely that, so they did. like it a as companies do, you know, every sort of five to 10 years, depending on the big company, they’ll rebrand a bit and give it a fresh look. And when they gave it the fresh look, one of their top priorities was to make sure that they were meeting, um, accessibility, color contrast rules. And so what they did was they actually just reversed it, is they went, instead of having these things on a white background, we like this color, so why don’t we put it on a soft black background? And of course, that contrast is now the opposite, and it was incredibly seeable. Um, and now they’ve rebranded entirely and now their branding is consistent between the website and all of their printed digital products, their products on the side of buses, the stadium and the scoreboard. Everywhere you see, you have consistent branding and it’s all accessible even if the sun is shining on it. 

Maciej: Yeah. And, and also two teams doesn’t have, don’t have to, you know, work on different, uh, sets of guidelines for, for the branding. So though this unifying, um, help not only the accessibility, but also simplify the, the work for a couple of teams inside the company. So I, I mean, I think this moment when you grabbed your phone, it’s like one, one in a million, right? So it, it was so obvious and the impact was so huge that you. . Um, I wonder how long did it take be, you know, how, how long did it take for them to, to start the, uh, rebranding processing once they saw the image? Because I guess it’s not, it’s not like corporation. 

Amanda:: So Yeah, it’s not a small thing. It took about 18 months to roll it all out. Um, so, you know, they had to, once the decision was made that they were going to refresh, then it was, you know, they had to engage lots of different stakeholders. So it did take a while to make it happen. Um, and I guess that’s one of the reasons I talk about things being a journey when it comes to accessibility. Things tend to, the bigger the organization, the slower they move, they tend not to happen overnight. You can’t just change a color in branding. You need to have a good reason to change that color. And then you have to decide about all the ways it can be used. Um, you know, and, and. , I guess what you’re looking for is the opportunity to make that change a really positive one instead of a No, we can’t do that cuz that’s against our branding. Um, and and the truth is, is that, you know, part of the solution for five years was to have a different digital color. Um, was that perfect solution? No. Did it work? Yes. Um, another solution which they didn’t take up, but we’ve had other clients do where they didn’t wanna change their branding. So what they did is they stopped using that color in a way that was informative. So, for example, They didn’t use it for text any longer. They only used it where it could be a decorative add-on. So they were using it for little icons, but the text for that icon was underneath. Um, they weren’t use, you know, it, they weren’t using it for informative ways. Um, so you can still have your pretty pink if you like, but it’s about how you use them. And, and that’s what I always say to people, especially designers. It’s hard, you know, when I’m saying I’m being restrictive around color. Uh, cuz it is, it’s, it’s um, we’re putting restrictions around what color combinations can be used. There’s some awesome tools out there though that help you find the right color that can work with that white background. Or sometimes it’s as simple as, instead of white text on that background, you can use black text on that background. Sometimes it’s a really simple fix, sometimes it’s not. Um, but I really, I actually enjoy the challenge of working with a client through those issues. Cause those are, you know, Someone coming to me about alt text. Uh, you know, once I teach you about alt text, you can do it yourself. Come to me with the big stuff. Come to me with your brand. All right? Or, you know, how to get Aria to work for drag and drop. Like, let, let’s talk about the fun stuff, 

Maciej: maybe about maps, because you brought this example, uh, previously during our conversation. And I, I had that moment when, wow, this is a challenge. How do you make, uh, for example, like Google Maps or, you know, any other map accessible to the user. So because this is so complicated, so much functionality, like dragging, laser, zooming, moving around elements, I wonder it must be a challenge for, for the user. It’s so complicated. 

Amanda:: It is. And look, it depends. So I can give you three examples of three clients that we’ve had that have had three different solutions to maps. So one client, what they did was they were literally using the map to pinpoint their location, right? Which is a really common use for Google map. Hey, here’s where we are, right? Um, so their solution to provide an alternative to that map was they actually provided a little link just before the map that said, get directions and when you selected that link, it went to a page that just had header, footer and the content. And the content was how to get to them by train, how to get to them via the freeway, how to get to them via, uh, the bus. It just provided directions, which is exactly what the map was there for, and it did it in a text version. And so that was one way of solving their problem with Google Maps is they just provided an alternative. WCAG very rarely says you can’t do something, but it will tell you that you need to provide an alternative for something. So that’s what they did, is they provided an equal alternative to what the map was there for. 

Maciej: So that’s  I’m thinking just, just to interrupt. So I’m thinking about this in a way that the goal of the user is to get to the company or, or at least understand where it’s located. So it doesn’t have to be necessarily a map, a visual representation, but rather a way for the user to imagine a way to get them so that they have a feeling of the distance or the, the problem or a challenge to get there. So if it’s a direct bus, that’s easy, but if it is, you know, uh, seven, um, hops, it’s, it’s, it’s getting complicated. So maybe, maybe not this time, right? So, but, but the, the idea is that you are providing, A different way of solving the problem for, for the user of, you know, understanding how to get there. 

Amanda:: Exactly. And, you know, it’s important that we have those visuals. Some people will prefer the visual. It’s acknowledging that not everybody can perceive the visual. Um, so we have another client who had, um, a map. It was a really complex map. Um, so they were basically, they had pins all over the map. It was very interactive and it was, um, providing emergency warnings for, uh, so it was a state department providing emergency warnings around fire emergencies, um, and hazards, cyclones, that sort of thing. And what they decided to do was, so in this map, you, you get to the map, you select one of those icons, it tells you that it has like a little icon. It tells you what the emergency is, you know, so say it’s a bushfire warning, it would give you all of the information. You could zoom in. You can zoom out. , lots of functionality. You could filter through a list of different types of, um, emergencies. And um, you know, as state departments, they didn’t have a lot of money. So we’re like, how do we replicate this and give it a text alternative? And what we did in this case was we actually had them provide a table. So they have a text version only version of this map.Um, and in the table it has all of the locations listed that have an emergency, the emergency itself, and then where, um, you know, the information for each of those emergencies. And you could then filter through that map and find the emergency that you were looking for. So it provided all of the information that was available within the map in a non-visual way. And what we actually did was to make sure that that could be found without having to go and tab your way. So a non-visual user won’t use the mouse cause they can’t see. . And so they’ll tab their way using the keyboard to get to the text only version. And we didn’t want it to be after they had gone through a really inaccessible map. So we actually forced the tab focus as the first item on the page. So they knew right away that there was a text only version that they could go to and they could get that same information in a text only version. And that was a great solution for them. It was a really low cost solution. Um, but it worked. The last example I have was not a low cost solution, but it was one that had us nominated for an award. So this is my favorite one, although it, it wasn’t, um, it was a lot more expensive. It was much more imaginative. Um, so we had a, a client who wanted to make their Google maps. So they had, they were local council with, um, dog parks and that sort of thing that they used their maps for. So lots of different locations and again, quite complex. and you could open up these different pins and get more information about each of the, um, areas that you had searched for. And they used a combination of Google’s APIs, which are there, um, but not well advertised. So Google’s APIs, um, way Aria. So Aria’s a code that speaks it, it’s within your html, it speaks directly to assistive technology and JavaScript. And they basically created a, I guess a layover for the Google map. Um, so it had buttons that said accessibility on accessibility off. And you could literally have high contrast or a regular Google map. So when you logged into the page, it would show just like a regular Google map, but had these extra buttons if you were, um, someone who, um, couldn’t use the mouse. So say you had a mobility impairment and you wanted to be able to tab Google Maps by, um, default doesn’t have great keyboard access. We used JavaScript and Aria to force keyboard access to all of the interactive components, and also forced a really strong indicator for the tab so you can see where your focus was, which also is problematic with, um, Google Maps natively. And um, and basically this layover made what was a really inaccessible, very interactive Google map, very accessible, um, using just JavaScript, some clever Aria and Google’s APIs, which were already available. Uh, and that was a great project. We were actually nominated for an award based on the back of that project, um, along with the local council. And they flew, um, they flew us, uh, two of us over to Sydney. I think it was Sydney, no, sorry, Melbourne, um, over to Melbourne to sit a panel of judges and talk about our project and, and how we did it. Um, but that was a really exciting one. It took more investment. Um, but it’s an example I still use today.

Maciej: Wow. And I, I hear this as three totally different approaches to solve similar problems. Of course, you cannot compare, you know, my, my pin on, on Google and how to get there versus the interactive map with additional information. But the, the last solution sounds really not complicated, but like a, like a layer of technology on top of something that is not really accessible and has, and, and there is no other now other way around it.Because this is the information that is, you know, crucial and provided in this, um, in this, um, in this map for, for the visitors. , this is amazing. And I wonder what are the tools that may, maybe there are any tools that users or web, web builders, developers, or companies can use to judge if they are, if they have problems with accessibility or if they are so, so, or maybe some things that they can easily identify to, to fix. So is there any tool that you, you can use and have a quick grade on your website? 

Amanda:: Yeah, absolutely. There are look, there are lots of there are lots of great free tools, even extensions on Chrome that will give you sort of a high level. I, I will give you the caveat. Anytime you’re using an automated tool at all. It’s not the same as actually testing with a human mind behind it. It can tell you if an image has no alt text, it can’t tell you if that image has the right alt text, for example. Sure. So that’s a really important caveat, um, to mention, um, automated tools only get you so far. Uh, look, there are some really good ones. One of my favorites, uh, that’s really highly visual is, uh, wave by web A, which is you can get an extension, um, just in Chrome or in Firefox. You can also, um, you can enter your URL via other website. It’s a really simple one. It’s a one button press and it’ll give you a load of errors if you have it. Again, not the same as, um, as as manual testing, but, um, definitely great for high level. Um, ooh, we forgot a label for that form. Input field. Really great for that sort of thing. Um, I also really like the tool art, um, the toolkits by the ARC toolkit. Try that again. The ARC toolkit by TPGI, um, which is another accessibility firm based outta the us. Um, that’s a really good one for developers cuz it delves into the code for you. Um, but some of the basic things that you can do, um, check color contrast, great tools available for color contrast, whocanuse.com fantastic. The Color Contrast Analyzer by PA group. Um, also fantastic. Um, check keyboard access. So keyboard access is one of those really imperative elements to accessibility because if someone doesn’t have keyboard access, it’s a major blocker. This isn’t a small thing, this isn’t a little bug, it’s a full stop. I can’t do anything because I can’t get to the interactive elements for people who, and not just people who are blind or low vision and, and can’t see to use the most. But, um, when we think about. how someone with a different assistive technology, because they have a mobility impairment, um, they use that keyboard as well, or the elements of the keyboard to, to make it work, to get to the interactive elements. So keyboard testing is really simple. So all you need to do is know that you tab to go to all of the interactive elements and it should go to each interactive element. You should know where you are all the time. So have a really strong focus indicator. Um, we have a bad habit of thinking about hover focus, but not keyboard focus. We should be thinking about keyboard focus and we should make sure it can get to everywhere and go in a logical order. So we want it to go where we predicted to go, which in general, at least for most, um, languages like English for example, or French or Spanish, it would be left to. Hebrew Arabic right to left, but for the most part left to right down, left to right down. So it should be logical. You should be able to predict where the keyboard is gonna go Next, we tab and enter to submit something or to activate a button or a link. So color contrast, keyboard access, and something like wave, which will pull up those really high level, um, issues for you, like missing a, a label for an input field.

Maciej: That, that’s great. I am, and actually, even though, you know, I have no disabilities, I also, for, for example, with the keyboard access and the predictability of where my tab will take me, I, I, I. . Mm. Like I’m, uh, sometimes I’m, I have problems with this on my phone when I’m filling a form on a web shop of some sort, and I’m just, you know, I’m crazy angry.

This frustrates me so much because I’m, I don’t want to, you know, type, you know, move to another field with my, with my finger because I have those, you know, small keys. Next, next, next, right? Yeah. And I press next and, and, and my cursor is somewhere. I, I don’t even see my cursor and , you know, I get angry. So I can only imagine the way, uh, disabled person has to be frustrated because this is the, like a daily experience no matter where such a person goes.

That’s the challenge. And not only this, when I am thinking about a huge bank or or telecom operator website, I wonder what a huge telecom operator website. What’s the experience for a regular, disabled, disabled customer where I have a problem to find, you know, renew the contract or what’s the current, you know, offering for a, uh, for a, for a plan?

So, I, I, I’m bringing this up because when you mentioned like the tab access, so the keyboard access, I, I imagine this huge tele com operators, you know, websites with tons of buttons and I, I really cannot imagine what it takes to go through this because you don’t know what’s next option because you have to listen to all of the options before you identify what you want to do. And then, okay, maybe I have to reverse to three options before. So it’s a nightmare. 

Amanda:: it, it really is and, and this is where good semantic structure also helps. So when we use headings correctly, um, a screen reader user for example, so someone who is blind and relies on a screen reader or a braille refresh display, which does braille for you, um, one of the things that you can do is pull out like a list of headings and navigate via those headings.So what we do visually when we look at a website is we don’t read every line of the website, right? You, you never read everything. You go, this is the use your visually. You go, oh, this is the heading that has the content I under, this is the subheading. That’s the information I want. You don’t read every line. You just graze until you get what you need for someone with, um, using assistive technology, uh, particularly like a screen reader, if you call out a list of headings and those headings are actually descriptive and they’re heading up content, you can listen to each of the headings. And then go directly to the heading that is the content that you wanna listen to.

Um, so you can actually navigate in a different way, which is why heading structure is so important and probably is underutilized in lots of ways. You can do the same thing with buttons and links, which is why I always recommend don’t use click here or read more. Um, the, the difference between, so if I pulled out those links out of context, so I just pulled them out of, out of the context that they’re sitting in, instead of saying, you know, link, click here to view our pol our privacy statement, and instead said, um, you can view our privacy statement link and have the link, the hyperlink be the privacy statement when they pull up a list of and they navigate through that list of links. Instead of hearing five read mores or five click hears, they hear privacy statement, you know, , this is, this is the difference. It, it’s just thinking a little bit differently about how we do our content. 

Maciej: Um, this is amazing because I, I was just to retract about a couple of steps. So the what the disabled person will consume is like a tree of, um, not, not a site map, but like a tree of different, um, titles. I’m thinking about the mega menu. Let’s keep this example of, of, uh, big telecom, uh, website. There is a ton of menu entries in, you know, many level of, um, um, many levels of mega menus.And do I get this right, that the menu would be pulled and read to the user so that the user doesn’t have to go to listen to the every option, but whether the root of the tree or, or, or one of the branches, and then can get deeper and deeper, right? This, this, this is the idea. So 

Amanda:: if we use heading structure for that, or we use links for that, is you can navigate via links or heading structure and go directly where you need to go.And this is a way of doing exactly what we do, which is glance at the page, find the bit we’re after, and just consume the bit we need. . 

Maciej: Okay. And I love also the, the example of, uh, click here because for visual designers, this is natural. You, you see the prompt and you, you know, there’s the context as you said.

There’s the context of what you are seeing, and you have to just click here, which is also not always the case. This is easy to to know what’s the cta, for example, why, okay, what’s the cta click here? Alright. Right. . But why nevermind. But, uh, for, for, for impaired people, when they, they have pulled, like you said, five click here, it doesn’t make sense at all. And this is, this has to change for the designer. to formulate the c t a a bit different. And this is not a huge problem. You know, once you know it,

Amanda:: it’s an easy fix. And that’s the really interesting thing is that something like that where you’re just being more thoughtful about your link text and what the hyperlink text says is a really easy fix.And it’s one that’s really impactful cuz the other option, so if you have five click here links, what that means is you have to go and read that web page line by line to understand the context of the click here. 

Maciej: And you never know how long the text will be. So it’s like a bet. Is it, is it two lines or one paragraph or one page.

Amanda:: Yeah, and, and you can see how it would be more frustrating, um, how there could be major blockers in that, um, why you might shut down a webpage and just call instead and hope that someone could help you. And, and this is where we say, you know, we can talk about return on investment for accessibility.Um, Whether it matters or not, you know, this isn’t really a money question, it’s a human rights question. Um, but at the end of the day, you’re gonna benefit if people can do things independently. Everyone can do things independently and with less frustration. So the example you gave of, of tapping and getting frustrated because it’s not going where you think it should go, we’ve seen that throughout.I’ve got, um, my mother-in-law has quite a shaky hand and it’s just old age. She doesn’t have a particular disability just as she’s gotten older. Her hand shakes a lot and she really, she, she’s quite tech savvy for, you know, someone in her sixties that, and we’re all going, listen, I’m not gonna give up technology when I’m in my sixties or seventies.  So we’re all gonna be quite tech savvy as we get older, this generation as well. Um, and one of her challenges was she has a laptop and the track pad, because of her shaky hand, she can’t use it. It really is quite a struggle. The mouse is a little bit better, but not perfect. So, you know what I taught her to do to tab.Tab and that’s all you need to do. That’s what I taught her to do and it made a huge impact for her. But I’m equally, oh, I do it out of laziness. When I’m filling out a form online, I tab to the next input field. I don’t reach over and click the I. I can’t be bothered. I can’t be bothered. I tabbed the next input field. And most people do. Most people do. So it’s that idea again, sulfur one extend to many, right? So Microsoft put this so well when they did that tagline, cuz it makes sense if you find a solution for a person with one arm, or in this case a person who is blind or low vision. , you’ve also found a solution for my mother-in-law with a shaky hand. You’ve also found a solution for me out of convenience. So, you know, we can actually extend this and it, it’s a way of looking at accessibility rather than being restrictive as the source of being creative and being innovative, being thoughtful about our designs and about our content, and, and that’s ultimately what I, I really try to get across with accessibility.It’s, it’s not that you can’t do things, it’s that we’re more thoughtful about how we do them. 

Maciej: Amazing. I love it. Really, it, it, it, it’s, it changes for me how I look at the building websites because like, I can feel the, after the discussion with you, I can feel this, this challenge because, you know, previously it was like the concept I understood, you know, is problematic, but, During this conversation, I really felt what it means to, to build this and what kind of problems this can, can solve for the users of different, you know, um, with different impairments.o I, really enjoyed this conversation. Uh, it’s great. Um, I’m testing, uh, a couple of questions. So there is, uh, a couple of quick questions. Yes or no, this or that. If you can answer or you cannot answer, you can. I mean, like, explain, uh, if you cannot decide what I would like to test this, um, okay. Test this series of questions.

They will be web related, so, uh, but I think it’ll be great. So, um, hosting our cloud, oh, 

Amanda:: um, oh goodness. Hosting 

Maciej: meet up online or offline? 

Amanda:: Offline. But that’s a personal preference because 

Maciej: That’s great. That’s great. 

Amanda:: I, I like to be, I like to be with people. . 

Maciej: Yeah. With Zoom Too much. You know, , this is this, this is all I just got, like, understandable 

Amanda:: I just got back from a conference, um, a a W3C, um, conference in Vancouver and it was so good to like hug people again. It was so wonderful. 

Maciej: Exactly. Exactly. I, I’m going f to every word camp conference that I can go to right now. I’m making up for every like, uh, for those two years where, when we were locked down. All right, next question. LinkedIn or Twitter. Twitter podcast or books? Oh, 

Amanda:: I like books. 

Maciej: Higher freelancers or higher agency 

Amanda:: freelancers. 

Maciej: Using plugins or avoiding plugins. 

Amanda:: Avoiding plugins. 

Maciej: Multi-site or multiple sites.

Amanda:: Mm, multi-site 

Maciej: headless, or not headless . Headless . Yeah. It’s, it’s a development concept, so if you’re not familiar, uh, then that’s fine.

Amanda:: No, I’m not, but now I’m curious. 

Maciej: All right. ? Yeah, I  can send a couple of things. It’s a way of building website that it is not totally rendered on server, but uses, um, data from the server and render the whole UI on the client computer. So on the, on the worries on the browser. Right. Okay. Thank you very much for, for, for this, uh, short round of questions.Um, is there ma, because we, we will be wrapping because, um, the time is, you know, the time is up slowly. So is there anything you’d like to add, you know, as a, like a closing cream mark or something like this? 

Amanda:: Uh, I think it’s, it’s always worthwhile saying that if you do accessibility well, you’re going to stand out.Uh, there’s more, now more awareness around accessibility, particularly in the eu, but this is true across the globe. There’s more awareness and if you invest in accessibility within your agency, within your company as a person, whether you’re a developer or content author or a designer, that’s going to be noticed and it’s going to put you in good stead.Not just for government contracts, but contracts across all industries. People are looking at accessibility. They’re looking at as a corporate social responsibility. They’re looking at it as doing the right thing as a human right. So the more you learn, um, and there are lots of great resources out there, but the more you learn, the better off you’ll be.

Maciej: Right. Thank you. Thank you very much for the conversation. I really enjoyed it and this was really illuminating because even though I’m in, in, in, in the web, Business. This is not so often brought up. And, you know, and this is the whole movement. I, I have the feeling and, um, I, let’s say I just really, really enjoyed this conversation and it was very, um, illuminating for me.

Amanda:: No, it was fantastic. Thank you so much for, for asking me to be on and for having me. And, and yeah, no, it’s been wonderful. I’m always happy to chat about accessibility. 

Maciej: Look, pl pleasure is all mine really. I, really enjoyed this conversation. It again, uh, I hope our, our listeners will enjoy this conversation too.And, and once again, thank you very much Amanda, and, uh, you know, take care. 

Amanda:: Thank you.

Intro: If you like what you’ve just heard, don’t forget to subscribe for more episodes. On the other hand, if you’ve got a question we haven’t answered yet, feel free to reach out to us directly. Just go to awesome studio.com/contact.Thanks for listening and see you in the next episode of the.

Next article

Looking for an ideal WordPress web hosting. Interview with Jeff Mills from WordPress VIP

Avatar photo

By Maciej Nowak

small logo of osom studio wordpress and woocommerce agency

Join Osom to know newsletter!

Get your monthly dose of WordPress information.