Inaccessible Web
Websites should be accessible for any person who has open access to the internet. “According to a U.N study, conducted by the British technology firm Nomensa, 97 percent of websites fail to meet the minimum level of web accessibility.” (Calore, 2006)
They don’t meet the minimum level. If you’re a designer, you love a good design and you want to make something out of nothing that is pleasing to others. If you’re not designing with accessibility in mind, your design has failed others in being helpful, beautiful or functional.
Curious about this 97% of sites I decided to start looking at “well designed” sites to see how accessible they are. I checked out Site Builder Report’s article for Best Websites of 2021 for some examples of sites that are being highlighted for their design this year. The first site on the list is an architect’s portfolio site that has their work, a blog, some philosophy for the brand an about section and a contact page.
The first thing I noticed was that it was centered text which is more difficult to read than left aligned. The contrast in the colors for the font and the button are obviously very good and the font is clear so from a quick look, it’s at 50%.
When I dove a bit deeper into the page through the Chrome dev tools, I was able to see that the image that is on the left side of the page had no substantial alt text. Instead, it’s “IMG0038.jpeg” which is not descriptive at all and instead just shows that you checked a box that says “I did it” instead of thinking who can understand what a picture of IMG0038.jpeg looks like. From there, I saw that the title of the page was an H1 which is good and the rest of the text is in paragraph tags which also makes sense.
You can tab to the two options that link you elsewhere on the page but “Enter Here” is a bit vague for telling you what the button is actually doing and can be confusing to view out of context. The SVG icon for mail on the other hand has no indication of where it’s taking you at all because it’s just an icon.
From here, I thought, “Okay! Could be worse” and then indeed, it got worse.
On the main work page, there is no selector box when tabbing on the site. This leaves the user unaware of what they have landed on to try and access it. The font color that indicates that the pages are not being currently shown are a low contrast gray. So with not being able to have good contrast on the text and also not allowing the user to see the selector box around the link, you’ve made it clear you don’t want people to go the the rest of the site.
Even though the outline is not placed around the items, you can still hit enter and click on whatever you’ve landed on. When you go to one of the images and hit enter to look at the details page, theres no tabbing option at all. As soon as you hit tab, it takes you back to the main work page where is a mystery as to where your selector is and you have to go through the whole guessing game again.
From here, as a user, I would’ve already left the site. Its been made clear that this site does not have usability for all in the forefront of their web design.
I decided to dig a little more into the code and I saw that majority of the alt tags for all of the images on the site were left with “IMG00..” or just completely left blank. None of the images gave enlarging ability at all, which, given the content on the site, you would think anyone would want to enlarge the beautiful images of architectural design to see more details. So here, you’ve also failed able bodied people as well as disabled people in diving deeper into your work.
Lastly, I saw that some of the links provided were full on links with https://… on some of the detail pages of the work. Having a screenreader have to read through “h..t..t..p..:../../..” is unnecessary and inconvenient for those reading through your site. This would have been much better if it were linked as part of the sentence “..can be found at The Friends of Laura Secord website” because it’s clear, to the point and can be read out of context and still understood where it’s taking you.
When designing an inaccessible site, you’re choosing to become only inclusive to those who you think should view your work. When a design has no thought of accessibility you’re assuming that every person who has open access to the internet is able-bodied and that contributes to ablism. Design is a service that you give to everyone and everyone should be included in a good design.
