It’s been a while, but in this episode, we have a guest! And what a guest: Rian Rietveld, accessibility specialist at Level Level is joining us to talk about accessibility. We talk about the problem with accessibility overlays, educating people, and how we can help more people develop, design, and create content in a way it’s accessible for everyone. Big take away: make it about themselves.
Related interesting reads or resources
- Selfish accessibility – talk by Adrian Rosselli
- 6 tips for accessible web design – (UXATT blog)
- Accessibility isn’t magic that comes from tools (UXATT blog)
- WP Engine partners with AudioEye
- Overlay Fact Sheet
- A11y-collective (accessibility courses by Rian Rietveld)
- Gravity Forms accessibility guide for developers
- Axe Dev tools Chrome extension
Full Transcript of this Podcast Episode
Jackie So you were gonna say Rietveld is right? Is that what we're talking about?
Cathi Rian Rietveld. Got it.
Jackie Hey everybody, it's Jackie D'Elia with rethink.fm the forward thinking podcast about experience design. Join me with co host, Cathi Bosco and Monique Dubbelman. As we discussed what makes a good design good. From user research to design thinking, we've got you covered. We've all got questions. So let's get started. In this episode, we're joined by accessibility expert Rian Redfield. Take it away, Cathi.
Cathi Welcome to the podcast. Rian, we are so thrilled to have you here to talk with us about accessibility and the state of the web and the challenges we face so far. And some of the challenges coming up. We thought we'd start with a little round robin, I'll go first. I guess what I'd like to share is when I first became aware of accessibility as a requirement for design, and I, I learned it from you many years ago, and I did some mocks for a project. And they were not meeting accessibility requirements. And you had me, you taught me about colour contrast and some other things. And I remember feeling very constrained. Or, like, I wasn't going to be able to use all the colours I wanted. And as a creative that felt really like, horrible! And you're like, No, no, that's not that not what's happening. I'm making you a better designer. And I moved into tints and shades, and some other really rich design opportunities. And you made me a better designer. And I think other designers probably feel the same way they feel restricted. Like it's like some sort of penalty or something if they're really into having lots of creative options. But that's really not what it was like. So that's what that was my first experience working with you. And it changed my career, the trajectory of my career for the positive. So thank you so much for that.
Rian Thank you.
Cathi Yeah. Jackie, do you have a memory of accessibility? And does it relate to Rian?
Rian Yes, I do. Back, oh, I don't know, maybe 2015. Somewhere in there. I was an avid listener to Carrie Dills podcast, officehours.fm. And she was working on a theme, I think it was called Utility Pro. And so there was a lot of attention about accessibility. And I was developing and designing websites at that point in time. And that was all new to me. I was like, I didn't even realise that all of this ecosystem existed, and that there were requirements and rules. And I think for the most part, I kind of inherently wanted things to be readable and accessible. But I didn't have any training in it. I didn't, I wasn't aware of anything. And so then I started following Rian. And of course, as time went by, I had my podcast and she came on and ever since then, I have been very focused when I look at everything from an accessibility perspective. So it's really influenced my work.Thank you. You're welcome. Thank you for doing that. Yeah, this is really amazes me how people pick up on accessibility and you get really, enthousiastic about it. That amazes me every time and I really enjoyed the process seeing that happen.
Jackie You helped a lot of people.
Cathi Monique do you have something you'd like to share?
Monique Yeah, focus on the people who do it well, and there's still a lot of people out there who don't right it's not always that they don't want to do it. And I remember you know, we're all ... we usually talk about ourselves as coming closer to perfection, right, other people would refer to as as that we're sort of ageing, you know, ageing women. But we see it as coming closer to perfection and back in the days when we were less perfect, right. There was no such thing as online like learning how to design websites. I learned some sort of code when I was in graphical design school but that was about graphical design and that was pre internet computers and all that so I learned HTML myself, but just you know, the usual stuff like p is for paragraph a is for whatever and I shifted away from that when I started working with WordPress because you know, you would just download the software, install a theme. And make it look the way you want it. And that's it. And a lot of the things happen under the hood. And I started, I started with WordPress in around 2010, 2009. I don't remember but I started going to WordCamps in the Netherlands in 2015. I think I've never heard of the community before. And at my first workshop, I was, I was still like, a lot of people say like, oh, that's just for developers. I'm not a developer. And I know, Rian was like, because you know, you're such a knowledgeable person, you're always talking about accessibility at WordCamsp, also in the Netherlands. And I would look at the descriptions as got like, that's not for me. It's way too technical. And even when I would attend your talks back then, which is like aria and role, I was like, how am I supposed to understand all this? But over the years, I tried to force myself because at some point, I sort of figured out: this is important! So not just learning the technique, learning why it's important to take that into account. I learned that as someone who might know a bit of development, but also just thinking about it from content perspective and design perspective, you can still do a lot without being the technical person, or even educating people you're working with. So I was a late adopter of accessibility. And the thing that, I think, puzzles me most is that it didn't come to me naturally. It's not something you come across, by default, when you start working in the web, on the web in on websites. I don't know how you see that.
Rian But yeah, most of the time you build for yourself. Like, I like this, I like the way this works. And if you don't have a disability, well, you don't have restriction in what you're designing. It's only when you come across people who have a disability for example who are older and cannot see a contrast very well that someone says, I cannot read this. And then you will realise, okay, not everybody sees the way I do. So it's only when when you're young, everything works. And you can, you know, sky's the limit. But that doesn't work for everyone.
Monique So we should only have older people designing.
Rian Yeah, I think really good idea. Yeah.
Cathi I would say the the movement towards mobile over the years, as mobile has taken off where and dominated people's experience of the web that's helped with accessibility arguments, because when I meet with..Sometimes I work with huge publishing companies, right. And the biggest way I can win accessibility discussions with them is to say, look, people are reading this content on their phone in high glare scenarios. And they're, they're not going to continue to engage with your content. So it's as simple as that it's not. Those are winning arguments. You know, mobile has helped me to lift people's awareness to
Rian One winning argument is make it about you. So say, Okay, can you read it on the mobile in the sun, or y'all did really needs subtitles that video because when you're on the train, and you forgot your Earpods, you still want to see that read or hear that content. So if you made this, Adrian Rosselli has like a pyramid and on the top is make it about me. So if you really tell okay, you benefits from yourself? That that's the best argument. I think empathy is not really a good way to convince people into accessibility.
Monique Make it about themselves.
Rian Possibly about yourself over it must be yeah, well, beneficial for revenue. Otherwise people just don't care.
Cathi That's right. Whoa, that's gold tips right there. All the design teams, I can think of who care and love that love accessibility and want to make the web more usable. That's the key. Make it about you, make it about the business gains, and it will just fall into place for your teams. That's yeah,
Rian Well you make it for your user and your users, not one perfect person. Your user is all kinds of people. So you include much more people if you include also accessibility in your work? Well, if you are, invest a lot in SEO to let people come to your website, and 20% of those people who come to your website have to leave because they can use your website or don't understand how your website works. Well that's lots of money.
Monique And that's closely related to usability and UX like that the broader umbrella under which we work, right? I'm still - we didn't really finish that round robin there. So I'm curious because you got aware of accessibility at some point as well. Can you tell a bit about when you started to care? Or when you thought like, Oh, this is something I need to work on? How did that go?
Rian Well, I was self employed. And I was making websites for about 10 years them. And I was always interested in web standards, like, how to how to decent HTML, how to programme right? Valid HTML, just really, that everything validates and was according to standard that I haven't heard about accessibility. Then the Dutch law changed that all government websites needed to be accessible to us in 2010. And I thought, Well, that's good. Well, it's a niche I can really make money from. So I learned with the Dutch accessibility foundation, I followed courses. And then I started to get work in that. And it's really good. Well, especially to, to have because not many people have it. So work came in, and I learned and learned, and then I made a website for the Dutch Eye Association. And then I met the people who really need a website that is accessible, and then the empathy came and anger and why doesn't anybody care and I got into the WordPress accessibility team to make stuff or fix stuff that was broken. So it was for me like a business choice. And well, it came it turned into a career. So no, empathy in there.
Monique You went for the money! Yes. Yeah, we found your true nature. You're just like anyone else. But that was the past, like, a long time ago, right?
Cathi Yeah, it's still it's still missing in web standards. In a lot of interface like W3 organisations, their teams still working to bring accessibility to interface design and things like that. I guess, I want to ask about, like, kinda know the answer. But I want your perspective if you would share on overlays.
Cathi Because we get that question a lot from people. And it's nice to hear an authority like yourself speak about it.
Monique Maybe we can quickly explain what what they are. What we mean by overlays.
Cathi Jackie, what are overlays?
Jackie So the overlays are because I have a client who wanted that and had to convince them not to do it. But overlay is, you know, that little icon you see somewhere on the website on that border somewhere where you could click on it, and it opens up a menu that has a bunch of options to increase contrast and make changes to the font size and things like that. And basically, it's a way to fix a bad website. Right, that isn't accessible and to provide that there. So that's what that is. As far as I understand it. If I'm wrong, correct me.
Monique But um, yeah. You know, when I hear this, and in the meantime, I know a little bit more but when I would read something like this, this totally overwhelms me already. Right? I hear IAAP, WCAG. A lot of people who need a website for their business have no idea what you're talking about. I think a lot of people in the design space or developers have no idea what you're talking about. Am I correct?
Rian Yes. That's true because...
Monique When I look it up, I don't know what WCAG is I don't know what IAAP is. And I'm going to look those terms up and I briefly scan because I'm busy. You know, I need to deliver a website for clients. I scan hand go like, oh, I pay those are people who know a lot about accessibility. Oh, or it's something that I have to conform to that. And oh, my hosting probably knows what they're doing. So, good. Happy that they solved this problem for me. Don't have to think about this anymore. Because it's complicated.
Rian Yeah, of course, it's complicated. This is an easy fix. So everything sorted out,
Monique Can you blame people?
Jackie And this is the challenge for clients and business owners that have websites, right. So they're in the US. For private companies, it's there's no laws that say you have to be accessible, but people have been sued here for public companies that are not government. Entities have been sued for their websites not being accessible. So the awareness level is up for everybody here, that there's this accessibility requirement, my website should be accessible. But most business owners, they don't know how to measure that. They don't know if your site is accessible. And then the other question that I continually keep asking is, is why is all of this still so hard for everyone? Like why?
Monique And why in 2022? is WP Engine doing this when they have the knowledge? Yeah, why?
Jackie And why is WordPress, I mean, I have, you know, content editors and people working on the websites that for some reason still cannot grasp how to use an alternative text with images, they just leave it out there in a hurry. And I know WordPress has made efforts to try to alert them that you know, this image is missing it and or when you are working with the colour picker to let you know that the foreground and background colours that you've picked are maybe not be accessible, maybe difficult for people to read and how they phrase it. So that brings up some level of focus for them so that they know when they're working in it, but it just seems like and there's so many layers to the accessibility requirements, right, you have some very easy things that you can just do right off the bat. And then as you get further and further down, it becomes like, like Monique mentioned about ARIA roles, and you start to your head hurts and you say, oh my god, I do I need this here. Do I not need this here by doing a checkbox or a button or? And then...
Rian You know the first rule of ARIA?
Jackie Not to use it!
Rian Don't use ARIA. Try for a simple solution if you will make a very complex interface with then maybe it's also very complex to understand for people. But I agree that accessibility is hard because you need to place yourself in someone else like who cannot see. And if you have less time you hurry and then you just leave it out because there's not really a penalty straightaway. And the other hand I think the WCAG itself is hard to understand and are far from the reality of the web. There is a WCAG 2.1 this is the recent one. There is a 2.2 coming with extra success criteria for people with a cognitive disability. But I think we need to come back to basics like what's actually the most important things and emphasise on that and explain it well on the website of the W3C and not like making unreadable long documents. And if you Google, you get all kinds of old stuff, drafts, whatever. It's hard to find information for developers. And the guidelines are hard to read. And they're evolving very fast. So you have to Oh, I have to learn that and I have to learn that. And then suddenly, autocompletes are added to your forms, and you have to completely redo all your forms, like add all the attributes to your forms. First, it was okay. And now it's not valid anymore. And I think that's not doable for developers. Most developers don't even know you have to have a label with an input field on a form. That's basic.
Jackie Yeah, about this internally about menus, navigation in most themes, you hover over it with your mouse and you just get a colour change. That's it, that's the only visual indication that you are hovering over a link on a menu. And that seems like such an easy fix, we usually have to go in. And I'm not going to call out names on big theme shops that are all doing this, and look at all of their themes that they're offering, their templates that they're offering, and almost every single one, the menu is either no change whatsoever, when you hover over it with your mouse. I'm not including tabbing. When you do tab, you do see the focus ring on there. So that's fine. But I'm talking about when you hover with your mouse, you have no visual indication. And if you have any visual impairment, you're older, you don't see as well. You may not know where you are, right, no indication that you're there. And so many themes, even today in 2022 are being put out that don't address that. And it's a simple, simple fix to do that.
Rian I think it's the lack of education. Now in the Netherlands slowly, the schools for web developers and designers are including accessibility, but only in minor studies not really like embedded in the whole programme. But there's progress being made, I think, it needs a lot of focus on education. And that's what I'm trying to do just give talks and write articles and talk to people.
Cathi I love the work that you did with Gravity View.
Cathi Gravity Forms. Gravity Forms, right? Gravity View is a plugin that works on Gravity Forms, but in Gravity Forms, I love the work that you did for them. And I love, we all love and have appreciated what they put on their website, documenting it. I've sent many developers to those pages. To learn from that stuff. Because it's over my head, I can't teach it. But it was been a great resource to share with development teams. So that was, that was a real win, I think. And if people don't know about that resource, we'll put it in the notes.
Jackie And that goes to that saying, if you if you have a plugin for forms, and your forms are not accessible, then you should just stop and go home. And just, I'm sorry, you should just give up and go home if you cannot master that. If your forms are not accessible, and you still have a form plugin out there, just delete it.
Rian Well, you limit your audience because the plugin cannot be used for government websites in Europe. The law is changing and it 2025 all major websites that sell services or products need to be accessible. So all you limit all those website where you can use the plugin on it if it's not accessible. I think Gravity Forms is really smart to be the first actually to take that jump.
Monique Yes, yeah, I wonder at that level, right. And you talk about major shops. Isn't that all like custom code? So am I assuming that people at that level have enough resources, enough knowledge, enough funding to do this, right? You just did a research on that. So I happen to know.
Rian Yes, that's, that's, that's custom code. But there are major major websites running on WordPress, like publishing websites. And I think those grab Gravity Forms.
Monique Right. So imagine in the perfect world, all developers know how to code in an accessible way. Because I always hear you saying, like, if you embed this from the beginning, it's no extra work, right? You just build an accessible website. And that accessible website was maybe first or in collaboration designed with a designer, who knows their stuff, right? They know about colour contrast, they know about visual things with Gestalt theory about proximity, they know about contextual links. So the perfect website is out there. Content team is trained, they know how to structure that content. And then there's sort of at some point a shift, and the knowledge is gone. And there's a new content manager, and they start putting the content on their website, and they go like, Oh, these sub headings are the wrong colour, and they are the wrong size. Oh, if I use this one, they're smaller and a better colour. Let's use this one instead.And then...
Monique Yeah, all the time.
Rian All the time, yeah. The content editors come and go. So it's hard to keep the knowledge out there.
Monique Yeah, so but what we see is that we usually educate people about the 10 design, or usability heuristics, right. And one of the things is, and we all come from working in the WordPress space. So for instance, a lot of things have been done, and you can do code checks. And you can also do content checks. But one of the main things is like error prevention, so you can draft your text. And that's it. And then you can somewhere open a toggle, where it sort of shows you that you don't have the right heading structure and heading structures are important. Like we know that from books, right. You know, when there's a big title page, that's the start a new chapter. And if it's a page full of text, that you're somewhere in a paragraph, so online, it sort of works the same way. I always use that analogy. But there's no real thing there with error prevention, right? People always, like Jackie said, with the old tags, you sort of get a nudge like, oh, maybe you don't even get a notch, I don't know, put it in old texts here. But you can dismiss it, ignore it and don't really understand why it's important. And also you get the check afterwards. Right? You don't really... while you're typing or doing your stuff, you don't really get feedback on what you're doing content wise. Do you see any solutions? Or... because you say it's hard. It happens all the time. Obviously, education, there is a thing, but what can we do to help people do it right the first time?
Rian Well, if you're publishing on the web, you could do something like before you save that you have an accessibility check that that's I think some CMS has have something like that, like checks for headings, check for not empty links, the check for Alt texts in images. In Gravity Forms, we added like, extra checks if you have, for example, a construction that isn't accessible, you get a warning. So these are I think that's something that's in development.
Cathi I've been seeing it around too. Google web stories has a pre launch checklist that flags all these things for you inside their editor which is educational and helpful and all those things. So it's definitely doable as a pre launch checklist with unlike what you did with Gravity Forms.
Rian And also in the block editor, there is an 'i' from info whatever what 'i' means. And there you see also the outline of the outline of the headings.
Monique What if you don't click that?
Jackie We have clients that we have gone over all of this with them in detail about alternative text, about heading structure.
Monique We documented it!
Jackie I will I will be helping them we'll be reviewing something and I will see there are three H1's and on the page and I'll remind them okay, why? Why did you do that? Why? Why? What's the thinking? Well, it was just visual, right? So they're thinking visual I needed, I wanted them all to look the same. Okay. So I think in some ways, the tools fail in helping people achieve what they want to achieve, but do it in an inaccessible way that's usable for everyone. So it's, and there's no perfect solution to this. But I do think that the fact that they can just revert to their behaviour from before so easily, and upload 20 images for their website today and forget to put alternative text on all of them, and then just start to put them into articles where they would actually add value for search engines and for, for people that hover over an image and want to know more about it, or to put a caption in there, that they missed this whole opportunity. And the tools don't really help them and say, we've just graded what you just did. And you know, it is a fail, just to help them to do better with it.
Rian That are actually guidelines for that? And there's ATAG, yeah. That you create accessible content. And I think that there are CMS is we're actually do that. And maybe it's for WordPress is the lost case, of course, but...
Monique [Laughter] You say something important there like it's the lost case, but it powers nearly 40% of the web. So nearly 40% of the web is a lost case, that's what you're saying.
Rian Maybe maybe this is plugin territory, because I think people won't appreciate it. If you cannot publish a post if you have an h1 and an h3. Or you have a link that's called click here or an image without an alt text when you're really in a hurry. I think the first thing people do is disable that. Yeah.
Jackie I wonder if eventually browsers and search engines start to penalise websites that are not accessible in a meaningful way.
Monique Like they did with mobile friendly, right.
Jackie Yeah, that'll modify behaviour over time, because it did for you, like you just said, for mobile friendly websites, right.
Cathi I heard something that Google also is trying to take that into account.
Monique The power is with Google! We trust in them.
Rian But it's very hard to measure, like automated accessibility testing is really, really hard. Because I use Axe dev tools for that. In the browser, I can get a report. And that gets only like, well, 20-25% keyboard accessibility is so hard to check automated. So
Cathi that's Axe dev tools for anyone looking for a great tool to measure a website's accessibility info. It's a fantastic tool.
Monique We'll share it in the show notes. I think we sort of have to start wrapping up, right. We could talk about this all day, I think. I think one of the things maybe Rian. You can and maybe I'm sort of cutting things away from other people. But I'm curious, you know, there are so many different levels, that still needs work. But where do you think at this point in focusing, like we said, on creating awareness, educating people. Where would be the biggest win at this point you think, to improve the web, like for most people with accessibility needs?
Rian Oh as a hard question.
Monique You can think about it.
Rian Well, it's getting also complicated. And also, like, all kinds of different interfaces or modals who are jumping over each other things asking for attention. It's like, people want to show off this is what I can do look, it's all app like and it's all moving and there's all this fade in fade out. I think people need to focus on the task. Your visitor comes with like I want to order oranges or I want to know your telephone number. Heydon Pickering says people don't want to be delighted. They just want to do the task and move on with our lives. I think if people use get that that essence why are people on your website not to see the great designs JMeter overlays in the popups and fading animation on the background to make sure your fan blows up. They just want a telephone number.
Rian You know, back to basic, what do you want on a website? How can you test your job? Like, how can people as fast as possible, in the best way get the information or perform the tasks they want?
Monique I think, yeah....
Jackie A great point you just made there about bringing it back to your, to yourself or to themselves, right? So when I think about where am I, when I am reading an article or I am reading something, where is it the most enjoyable for me, and it's usually when it is the simplest, right? So it's actually even refreshing sometimes to go to a website that is just so basic. And the article is a nice clear dark print, and the spacing is perfect. And I can just read it, and there's no animations, no distractions, no nothing. And I get what I went there for. Right. So for me, that briefly...
Cathi You get your life back, you get spare time in your life!
Jackie Yeah, I don't need all your animations to load for me to read this article.
Monique And I think that ties in nicely with the last podcast we published, which said, focus on output on outcome, not on output, right, focus on what it should bring to people and not feature like factory kind of things. And another thing I would like to - a myth I'd like to bust is that, if it's simple, it doesn't mean it's not delightful. And it's not boring, because I think it was 2018 already that Automattic, under the guidance of John Maeda, did the WordPress design awards like Accessible Design Awards, and there were two things it had to be built with the new block editor back then. And it had to be accessible. And I was one of the lucky people in the jury. And we got some very accessible sites. But they weren't really designed. You know, they were boring, but two of the winners were one that Level Level brought in where Rian works now, which had a lot of the light, a nice design, but it was fully accessible on the other one was for the Dutch Tropical Institute that was built by Peter van Grieken and Luc Princen I think and yeah, look. Yeah. And they won as well. And they had a very delightful design, which was fully accessible even were built with with the new WordPress editor that wasn't accessible itself back then.
Cathi It had just dropped I think,
Monique Yeah, and simple is, is accessible and simple doesn't mean it's boring. And not interesting. Can we? Do we agree?
Rian It's kind of what you said Cathi at the start, like, you felt limited by colour contrast. Your colour, you couldn't use all the colours. It's just an extra challenge to really improve your creativity. Yes, and I make something that's really appealing. Really simple and simple. isn't easy. That's really hard. Yeah. So it makes you work harder for a better result. And yeah, maybe you're Yeah, that's the way to go at the moment, I'm not sure if making winning case about that.
Monique We need to keep challenging ourselves. I think we all want to become better at what we do.
Cathi That leads me to also sharing with people, the great accessibility courses you've put together. And they are dense and comprehensive. And if it's sort of, we'll share a link to those is there, the website address is Rian?
Cathi Well, we will definitely share a link to that I highly recommend it. It also makes me think about a lot of discussion that's been going on in our industry about whether or not designers need to be certified because sometimes people's lives are at stake based on our work. And I think the arrival of accessibility standards is also another step towards like, why not have some certifications for designers because of all of the accountability on our shoulders. Anyways, I don't want to get into a rabbit hole with that. But becoming certified in accessibility as a whole career and of its own. And it takes a lot of collaboration between people with deep knowledge and design and engineering and accessibility and content creation and marketing and engineering. It takes a whole lot of professionals to really do the greatest to solve the greatest problems we can to the web, so I've had too much coffee, I'll stop talking.
Jackie And with that, I guess we're going to wrap up this podcast and say goodbye. And thank you Rian so much for joining us. It's been a wonderful experience. And we hope everybody got some value out of the episode today, and we will see you in the next episode.
Monique Thank you.
Jackie Well, that'll do it for this episode of rethink.fm. If you've enjoyed this podcast, please head over to iTunes and leave us a review. It's a great way to help others find out about this podcast. We really appreciate you taking the time to do so. Have a great week, and we'll see you in the next episode.