Ian, a developer, tells us how some color combinations, notably orange and grey, can make content disappear for him. He also explains how restricting zoom on mobile pages mean he can’t read the content on those pages.
Transcript
Nic: Hi. I’m Nic Steenhout. You’re listening to the A11y Rules Soundbite, a series of short podcasts where people with disabilities explain their impairments and what barriers they encounter on the web. Today, I’m talking to Ian Littman. Ian, tell us a little bit about you.
Ian: I run or helped to run the Longhorn PHP Conference earlier this year in Austin, TX, assist with Austin PHP Meetup, and when I’m not doing one of those two things or herding cats with a number of various API projects and sometimes full-stack projects for a variety of clients, I’m probably talking to somebody’s ear off about internet connectivity, transit, or bouncing between various 24-hour coffee shops in Austin, so it’s great.
Nic: Coffee shops? Fantastic.
Ian: Yes.
Nic: Now, I understand you do have a personal experience of disability.
Ian: Yeah. I’m quite nearsighted and have as well some color blindness stuff going on in there, so suffice to say that there are a few things online that I notice accessibility-wise that some folks might not normally catch.
Nic: Like what?
Ian: I’m here at PHP[tek]n, and the schedule for … the online schedule for the conference has a orange and gray color scheme, which as long as the brightness values of the various colors are distinct, then that’s fine.
Nic: Okay.
Ian: Well, in this case, at least on the screens that I was looking at it with both my phone and my laptop, and they’ve since rectified this error, but you … At least I could not tell the difference between the dark gray background of these little schedule cards that show the title of the talk, and the time of the talk, and the location of the talk, and the actual time and location fields, which were this shade of orange that just fit right in, so the … What’s interesting about that is I think the variant of color blindness that I have is not necessarily a really standard one, so that will catch things off guard where it’s like, “Well, everybody else can see it. Even the folks who are normally color blind can see this in some things that …”
Nic: Orange is such a difficult color to make work from an accessibility perspective.
Ian: Yup.
Nic: Okay, so we have gray and oranges make it impossible for you to actually get anything out of the schedule.
Ian: Yup, and fortunately, that was an easy CSS change. It was, “Hey, don’t use this color for the text,” and that were something that temporarily overrode via a custom style sheet for that page, and then pretty quickly, thereafter … The organizer went in and fixed the CSS, and it was good.
Nic: It’s a good thing that you’re a geek. You’re able to go in and make your own custom CSS, but not everybody that has these issues can necessarily think about doing that, right?
Ian: Exactly, and if I were in the situation and didn’t realize, “Oh, well, I just go in the CSS and change it,” then that part of the website would have been unusable, and I would have had to have just said, “Well, I have to use a paper schedule.”
Nic: Yeah. What kind of other barriers do you encounter on the web? Anything specifically related to being really nearsighted?
Ian: The only other thing that I’ve experienced is in cases where websites will, particularly on a mobile view, enforce a maximum zoom level where you do a “viewport min 1 max 1” or something like that where they absolutely lock out the zoom controls, that becomes an issue as well particularly if you’re dealing with fine print on the site or images that you can’t expand. Yes, it does make for a UX trade-off where maybe you don’t want to risk somebody pinch-to-zooming the site, and then all of the elements get out of whack or something like that, but the flip side of that is sometimes I need to expand the size of the site. If your site disallows that functionality via, again, meta tags on the viewport, then I’m out of luck.
Nic: Yeah, yeah. If there was one thing you’d like designers or developers to remember about web accessibility, what would it be?
Ian: Clear trumps the idea of, “Oh, well, I’m going to have a really fancy design. It’s going to be really unique. It’s going to be a really fresh take,” particularly on colors and to some extent with other UI elements as well. Having something that is semantic and having something that is standard makes more sense than having something that is unique for the sake of uniqueness because realistically, people are going to be spending the vast, vast majority of their time on a site that’s other than yours.
Nic: Yeah. Cool. Well, thank you for that, and we’ll be sharing that with the audience in the next few days and go from there.
Ian: Great. Thanks for having me.
Nic: Thank you.
Nic: That’s it for now. Thanks for listening. If you enjoyed this accessibility soundbite, please pass the word. Share it wide and large.