Welcome to the Asos Tech podcast, where we're going to be sharing what it's like to work at an online destination for fashion loving 20 somethings around the world.

You may have bought some clothes from us, but have you ever wondered what happens behind the screens?

Hi, I'm Lewis. He him, and I'm a principal software engineer at Asos.

Hi, I'm Nat. She her associate web engineer. Today we are joined on the Asos Tech podcast with the lovely Sveta and Ellie.

Hello. So my name is Sveta. My pronouns are she, her. I am taking care of digital accessibility at Asos, and I joined about three years ago now, and it has been absolutely brilliant.

I'm Ellie Hadyoon.

My pronouns are she, her. I've been at Asos for eleven years now, and I've been a web engineer all the time I've been at Asos.

I started off knowing a bit about.

Accessibility when I started, but not in depth. I think my knowledge of accessibility has only been accelerated in the last three or four years.

Thanks so much, both of you, on the podcast. We love to start every episode with an icebreaker. So today's icebreaker is superhero related. So it's the age old question of if you had any superpower in the world, what would it be? I'll just give you my example. Mine would be the ability to understand and speak every single language in the world. So it's an open question. Ellie, do you want to start? Yeah, I'll go.

I'm a bit of a nervous flyer. I don't like flying, so I would like to fly without any jetpack or anything. Just like to fly, go to Hawaii one weekend, then fly to Japan the next. And I think my Kryptonite would be lightning because I'm scared of lightning as well, so I'd have to not fly when there's lightning.

I love this.

This is a superpower to get over your fears. I love that one. Sveta, what about you? What would your superpower be?

I think mine would be to be able to read people's minds. I was thinking about that earlier and I was like, is that going to drive me completely crazy? But not all people are very good at communicating, so I'm often like, if I could just read your mind, that would be so much easier.

Like the film What Women Want with Mel Gibson.

Do you remember that exactly where he.

Was like, oh, my God, I can't.

Deal with this anymore? Yeah, pretty much.

What a great film. Wicked. Thank you both so much for that icebreaker question. So we have got you here today to talk about accessibility. So accessibility, as we all know, is really important. I think we should start off with what do we mean when we say accessibility?

I think that's a really good question, because I feel like a lot of people are scared of the word. It's also, ironically, not a very accessible word because it's so long and so complicated to spell. And it's like, what does that even mean? But accessibility in its core means to make products available to users with disabilities. That's the idea behind it. When we're talking about digital accessibility, we're obviously talking about accessibility just in the context of digital products. So whether those are websites, mobile apps, any digital software that you might be using. However, I do think that there are different sort of ways of reading accessibility. And I think for us at Asos, it's more about not necessarily differentiating and being like, right, so this is the product, and then we're going to make it accessible to users with visual impairments or users who are hard of hearing. It's more about moving from accessibility to general inclusivity and just making sure that from the outset, your products are considering all users. It makes total sense for a brand like Asus because we are so focused on being inclusive, making sure that our customers feel comfortable to be whoever they want to be. And it makes sense to make our platforms available to everyone and not just focus on specific user groups cool.

And to make Asos as a whole inclusive for people that have a disability. Could you just give us some examples of how we might do that?

Yeah, so it goes back to in its core, accessibility is thinking about users with disabilities, splitting those into four main groups. Those are users with visual disabilities, users with hearing disabilities, users with cognitive and motor disabilities. So that is generalizing to a certain extent, but it allows us to focus on making sure that specific personas from these user groups would be able to access. For example, when it comes to users with visual impairments, we can broadly assume that some of these users would be using a screen reader to access our website. So then we can use a screen reader to test and make sure that our whole journey is accessible. Some things that we've been doing are adding labels to things, making sure that all interactive components are available to screen readers, so that a user who is visually impaired, who might not be able to see the screen, they would understand the content. A lot of our content is very visual, and so we have to be very selective about what we describe and what we don't describe. For users with a visual impairment in general, it's things like enhancing contrast and making sure that we are doing little things like that in order to be more inclusive for everyone.

And I guess my understanding is doing these things to make the application, website, whatever it is, more accessible to people. It doesn't just benefit those people with different disabilities, it can benefit a wider group of people as well.

Right, yeah, that's absolutely true. With things like contrast, for example, it is considered we are doing that for the benefit of users with visual disabilities. However, when we're talking about temporary or situational disabilities. You might find yourself with 2020 Vision standing outside in the sun, trying to look at the screen of your mobile phone. And this is where contrast is going to make it easier for you to read content than to interact with that content. So at its core, accessibility is about disabled users, but actually it's just trying to include everyone and make the experience better for everyone. You never know at what point you might find yourself in a situation where you're using one hand to use your mobile phone in order to navigate around the website or standing outside in the sun, as I mentioned.

Yeah, that's great. Awesome.

Asos'accessibility journey has been very long over the past few years. Where were we and how has that journey been?

Yeah, so it's been a long process for us, which is completely normal because accessibility is more of a journey than an endpoint. It is very unlikely that, in my opinion, any company is going to find itself at a point where it's like, right, we're done, this is it, we're accessible. Moving on doesn't really work like that. We started off doing a very big assessment of our website and our mobile apps and understanding where all the issues were. That was quite a big task because it came back with a huge number of issues that we then had to go and look into and understand how we can fix them without necessarily doing a major redesign of the website, just retrofitting accessibility into our platforms. And of course, changes were made where they had to be made, but mostly it was about understanding how we can adjust things in order to make everything more accessible. That took a couple of years and it was a very intense journey because along the way we learned a lot of things. I think everyone has come out of this whole process with a lot more knowledge and experience around accessibility. Now we find ourselves at the point where we've done all of these changes and we do know that our core journey is in a much better place accessibility wise. But it's all about how do we then make sure that anything new also has accessibility considered? We have done a lot of training for all of the teams. We have shifted accessibility to the left, making sure that it starts with design rather than at the point of engineering, where you need to think, what kind of adjustments do I need to make to the code? No, it needs to be considered from day one. From the moment that we start doing discovery around any specific project, we need to be talking about accessibility. This is where we're at at the moment. It is a learning curve for everyone, but it's really interesting that there are not that many ecommerce companies that do this kind of work and have this embedded into their process.

Fantastic. And obviously in the public sector there are lots of legislations and regulations that have to be put into place legally to make your website accessible. Could you just go through the compliance criteria that Asos have to abide by?

Yeah, when it comes to compliance, everything always comes down to wik. It generally comes down to Wikag 2.0, which is the set of accessibility guidelines that all legislation uses as the baseline to assess websites and mobile apps and any digital content.

And what does Wicag stand for? Setter for people that don't know?

Yeah. So it's the Web content Accessibility Guidelines. These specifically apply to content that is put on the web and is there for users to take advantage of in any shape or form. It doesn't necessarily apply to things like social media, but it does apply to websites like Asos that give you information or a service or anything like that. WICC is the baseline when it comes to accessibility. It's not the ultimate truth, necessarily, but it is a good way to start. Also, because it is usually considered within all European and American and worldwide legislations, we have in the past audited all of our content against 2.0. We're now moving to 2.1, just making sure that everything is aligned and where it needs to be. The good thing about Wecag is that it's a set of guidelines. Anyone can go and read and understand where they stand in terms of the content that they already have online. It's like a checklist that you can assess yourself against. So that is quite useful.

And does Wiccag is it just guidance in terms of what you should be doing to be accessible? Does it actually go into any technical guidance or advice on how to make things accessible?

Yeah, it is quite technical and ironically, it's not very accessible. The language that has been used there is not particularly accessible, but there's a reason for that and it's because things need to be very clear. So things like what you need to do with images, all images have to have an alternative description, whether that is an empty description to know that the image is purely decorative or whether the image actually means something and you need to describe it. So that is like a black and white thing. But for other things, such as how good do you need to make that description, things like that are not necessarily covered. So when it comes to more creative content, such as the content that we have on the Asos website and on our apps, it doesn't necessarily cover all scenarios. You need to think outside of the box of wiccag, and I think this is where it's good to speak to actual users, get their input, make things usable, and you can never really do that by just looking at a set of guidelines.

So is that something that Asos does? We actually interact with users to get that feedback?

We do. It's part of the second step that we are taking towards accessibility, because you can have users as part of the whole process of creating any component and any page. At the moment, we're mostly testing when it comes to, are our journeys accessible, can we find specific pain points that we can fix? Whereas if you include those users at the very beginning, which is what we're currently aiming to do, when you have ideas, when you have prototypes of things, you can get that feedback earlier on, and you don't need to go and rethink things later on. You can just do it from the beginning.

When I first started Asos, I can't remember her name, but lovely woman that came in, and she had a disease that made her eyesight deteriorate, and she knew that the end result would be she would be fully blind. She was talking to us in person about how she was navigating around the site. When you have someone coming in in front of you and actually saying about their experience, it really did open up so many people's eyes. And I thought it was fantastic. And I feel like the relationship with maintaining those compliances and training engineers, they go side by side. So how have we gone about that? Sveta with actually making sure that all of our developers, when we do new releases, when we do big new features, how have we trained our engineers to make sure that new code is accessible?

So throughout that process of going about fixing all of the issues that we already knew were there, I was running training for everyone from design, product managers, engineers, both web and apps. I've also done training for all of our content designers, content managers, more recently, social media as well. I think it's very important for people to understand in the first place why we're doing this and why accessibility is so important. I think what you said makes total sense. Empathy is a great thing, and putting an actual person with a disability in front of teams and just showing them how that person is using or not being able to use that content is absolutely crucial. Making sure that testing is also there in terms of people know how to use a screen reader, people know what they're supposed to do with automated tools or even basic tests. Everyone should be aware of those. If you're a product manager and you're looking at the bigger picture, you should still be aware of what needs to be there, and everyone should know their little checklist in the whole process. When it comes to accessibility, I think what that does is it ensures that when teams come together and they're working on something, there will always be someone advocating for accessibility. Nothing should go out on production without having accessibility ticked off.

What else would you like to hear.

About from asus Tech? We want to hear about the topics that interest you.

Send your ideas and feedback to [email protected], and we'll try and cover them in future. Episodes. So we've gone from assessing where we're at with accessibility and trying to retrofit things to make it more accessible to now ingraining it in our ways of working.

Exactly.

I guess it's become part of our definition of done, making sure performance testing is in place, or it might be SEO, things like that, that you have to check off. Accessibility is just one of those things now that we always make sure we're thinking about from day one.

Exactly. That is the ultimate goal, just having accessibility sustainably embedded into the process. Having done an audit before and having fixed all of those issues and knowing how painful that is motivates a lot of people to never have to go back there. I think it's a great push forward for people to be like, right, I need to know what I'm supposed to do. We need to be doing this all the time, every day, so that we never find ourselves back in that position.

It's really interesting to hear because it's like keeping your tech stack up to date. If you have teams that don't invest in maintaining their tech stack on different systems or services, they get to a point where they have to replatform or rebuild everything, and people don't want to go through that all the time, and it takes a long time. So if you're just keeping on top of things in terms of accessibility as well, it's a lot easier to manage.

Exactly.

I think part of that management and part of that investment for every single company is to hire people with expertise in accessibility. Like you, Sveta, because since you came in three years ago, you definitely have changed the way that developers have looked at how we develop and what we should be producing. We absolutely want the site to be inclusive for everyone. My team especially. We have our own accessibility pipeline that has to pass for Asos. What's the strategy going ahead now?

From my perspective, the job of an accessibility specialist is to eventually make yourself redundant. I'm so glad that that's how you feel about things, because it means we're on the right track. It means that eventually there won't be any need for me to be around and to answer questions, because everyone will just feel comfortable knowing what they need to do. I think that comes with time and it comes with experience. Unfortunately, accessibility is still not something that is widely thought when you're in university, for example, if you're a graduate joining a company, or if you just haven't been exposed to a team that cares about accessibility. So we still need to make sure that people are being trained up more user testing. We want to make sure that those are users with diverse needs and to be able to screen for that and make sure that we have that feedback from them. Strengthening our Accessibility Champions Network is another very important thing. Making sure that throughout the business there are people who represent for our accessibility work. They get together, they learn from each other. The aim is to do a lot of knowledge exchanges with other companies that are also doing accessibility. I think that the thing I love about that, is that accessibility shouldn't be considered a company secret. It's something that you can openly talk about. So how does your team do it? How do we do it? Can we learn from each other?

You need that buy in from all the different levels in the organization right. To make it successful. So it was really good to hear, Svetta, that you've been training not just engineers, but all the different people involved in what we create, because I think that is really important to be successful.

Yeah, I think so. Especially in a business like Asos, where we are a lot of people, we do a lot of different things. It's not just within tech. It's about the whole company believing that we should be accessible. And ultimately, I think what that also means is that when you build that culture around accessibility, you are going to attract more talent that is interested in.

Yeah, yeah, that's great to hear. And Ellie, you're an engineer working on our different web applications. So could you tell us a little bit about your experience, how you got involved with accessibility?

Yeah, sure.

Accessibility has always been part of our jobs, but maybe not as intense as it has been the last four or five years. We always knew the basics. The color contrast, have good information that gets displayed on the page, but we didn't know the extent of importance of it. There was a big developer knowledge gap, so we were lucky. We had a company that wanted to be more accessible. It gave us the time and the resource to get there.

We had a couple of developers that.

Went away, did a lot of homework, and then they were very keen to share the knowledge. They set up meetings across all departments and shared their knowledge. That set the foundation for us developers to know the basics and then build upon that. And it's not just developers as well. It's content editors. A lot of the content that gets displayed on Asos is the responsibility of content editors. They need to know what to display and how to display it to be compliant to accessibility.

I think in my experience, I've seen the past, it's simple little things that maybe, naturally, a content editor or designer won't really think about. Maybe they just think, well, I'll just put this text into this image and it just looks really cool, but it's not really very accessible, potentially to people.

That's right. A lot of our issues on the site are common issues that you get across many different websites. So it is okay to have text embedded in an image, but you need to put that information, if it's valuable, in an alt text so that your screen reader and user who can't see that text. We used to have images that say 20% discount, and then in the bottom, very small terms and conditions apply. And you can have that, but have it in the Alt text as well, so that it's available to more users. Functional images like search icon on our website where you click it and it does something. And informational images like payment methods, we need to have the Alt text for those. It makes it clear what payment methods we take. And videos as well. I mean, when you've got a video, you need to be able to use the keyboard to pause it, rewind it, go forward and just stop it altogether. Colors, obviously, color contrast, they were a.

Big topic of ours.

We had a bit of contrast, but maybe not as much as we should have to comply with Wakag 2.0. And again, recognizing what steps we need to take to be compliant, that was a challenge for us. We've learned that as the journey has gone on, having been audited as well, that helped to highlight, this isn't good enough. And another one, having a page with one H one that's got meaningful content, and then you have your H two, h three S in a logical order that helps. You can't just jump from H one to h three. If you don't have an H two and you jump to H three, you're just not compliant. Also area labels, so you can overuse them as well as underuse them. So it was recognizing where to use the area labels, which one and how to use it as well. We should probably explain what area labels are. So when we interact with the website, as someone that can see, we might have something that happens on the website that might not get translated to a screen reader. For example, if you're on a website and a modal appears, we would see it, but a screen reader user perhaps wouldn't know that something's just popped up and they'd be in the middle of tabbing and all of a sudden the context of the page would completely change. So you make area labels available to announce that something's happened on the page and it's that communication bridge between something happening and the screen reader recognising that something's happened.

Yeah.

And as an engineer, we always like different tools and things that can help us. So are there any useful tools, things out there, or software that you've used to help with accessibility?

There's many so online courses. The free one from Udacity, it's a web accessibility. It's quite old, but a lot of the information is still relevant. And if you google it, udacity Google web accessibility course it will come up. It trains your brain to think about not having certain content on the page, as a screen reader user, for example, and different disabilities as well. BBC Gel, they do a section on their website where they've got design patterns and snippets of code or components that they've already done with maximized accessibility integrated within it. In terms of automation tools, we've used Lighthouse Palli, Arc Toolkit, Wave and what do they do?

Do they just help validate that you're accessible?

Yeah, they don't pick up on everything. So typically we say that the automation tools pick up about 30% of the issues. So there is some manual checking and again, there's so many extensions. There's web developer that I use a lot which you can disable the images on the web page and refresh and then you can see the website without images and see if it makes sense. These are Chrome extensions mainly and then you get Bookmarklets as well. Andy visual area. You've actually got Funkify as well, which give you different personas. And you can select someone with disability and change your page into a page with say, a colorblindness and it will just invert the colors of the page or someone with Dyslexia, it will start moving the letters as you read the page. So these are extensions that you could use to help you sort of understand how the user interacts with the website.

Fantastic.

Cool.

Okay. Thanks, Eddie. It's really good to hear from an engineer's point of view how we can build things to make them accessible and the tools that we can use. I guess Fetter coming back to you. So for organizations that are not very accessible, they're not really thought about that much in the past, but they want to try and start to become more accessible. Where's the best place for them to start, how to get going?

I think there are different paths that you can take depending on how big your organization is, how big your team is. Do you think people are already sold on accessibility or are they just kind of like clueless and don't really know anything about it? I think the first step is make sure that everyone is on board because otherwise you're going to think that you're doing something and then you're going to come to a blocker because someone might not be down for including accessibility in their process. So training is usually a good place to start. You can obviously get external accessibility training. That's always a good idea if you don't have a budget. There are online courses, things like if you have access to LinkedIn learning. There are YouTube series as well that are completely free. There is one by Google called, I think, Alicasts. I'm sure there are other ones as well that are going to be equally as good. But I think it's also a good idea to get people in a room and talk about accessibility. One way you can do that is first training yourself. If you don't know enough, maybe getting some accessibility stats out, stuff that is relevant to you. I mean, I refreshed my stats this morning, just kind of had a look at what the latest figures are and it seems like now officially in the UK about 20% of the working population has a disability. And with these things you always have to assume that these are people who self identify. So think about all the people who don't self identify, who've never been diagnosed with anything. It's probably way more than 20%. Look at things like Global Accessibility Awareness Day is in May every year and around that you get so many events, so many webinars. So companies like DQ for example, these are big auditing companies, part of their job is to provide a lot of free webinars and educate people. So DQ is one that's over in the US AbilityNet is a UK based company. So that's a really good place to start as well. Another great way to start is if you have access to your user base. If you are already sort of doing focus groups or user research, see if you can screen those user groups for disabilities and for assistive technology use. Obviously do it appropriately, pay people for their time. But it's a really good way if you know that someone is already your user and you can screen them and see whether they have a specific disability. Get people from a couple of different groups. It's probably best to speak to them separately. You can bring them in to speak to your team, they can give you a different perspective, you can observe them, use your product and see where some of the issues are. And all of these things will give you a lot more to think about and a lot of other ideas of things that you can do. Another way is to do an audit that tends to be more expensive route sometimes. I mean you can obviously self audit but it takes a lot of time. You can get a company to audit you. But I feel like it is best to always start by selling the idea of accessibility and making sure that people understand it and are on board before spending money on it.

That's great. I think it's really good that you've covered different types of organizations with different budgets or where they're at different ways that they can get involved and be more accessible. That's fantastic. And Elliot, as an engineer, what would be your top tips to improve accessibility? If you did one thing it would make a huge difference that engineers could do to different web applications or apps. What would that be?

I would say rating automation tools within our pipeline like Pally. So when we commit code it automatically checks for errors. It's not going to pick up everything, but perhaps building a manual checklist as well that suits your website. So this would be having tab order in the correct logical way, the correct elements like use a button when it needs to be a button, don't use a div and make it clickable, just layout of the site. As well, like a form layout. They need to be logical. Don't have the labels so far away that you can't tell it's for that field heading order. Like we mentioned, focus styling. Make sure that's in place as you tab through the page. Image alts. Know your images and when you need alts and when you need to leave them empty and always have them there. And the last one I'd say is make your CMS flexible for content editors so they can show the content how they want to represent it.

Fantastic. That's great.

Ellie and Sveta, thank you so much for joining us. We've really dived into what accessibility is and the tools and the implementations of how Asos are going about making our site super accessible.

Thank you so much for having us and just so excited to be able to share more about our journey and all of this amazing work that we've been doing and hopefully inspire more companies to go down that route.

Fantastic.

Love that.

Thank you, everyone. Join us next time for more stories and insights from behind the screens at asos Tech.