How Firefox revealed poor web development practices
I love Firefox’s find feature. It’s so much nicer than the standard dialog that requires you enter the phrase/expression prior to searching. The fact that it actively searches the document while you type in a relatively unobtrusive way is awesome and once you end up leveraging it in your day-to-day activities, it makes every other application feel dated. One of the ways that I use this feature is to find specific content on a site that has too much information presented on a given page. Usually, this proves to be a beneficial way to find information I’m looking for without having to sift through a lot of content that I’m not really looking to read right now. This morning, though, I stumbled across a website on which I was trying to leverage CTRL+F to help me quickly find what I was looking for, but rather than helping me find my content, it ended up revealing terrible web development practices for a certain major department store.
So, there I was browsing a website for a major department store looking for a specific area of their site. The homepage of this site was cluttered with a lot of information - two navigation bars at the top, a three column content area one of which featured a cycle of images for various products, and three bars across the bottom each featuring various sets of more links. As soon as the site loaded, I looked at all of the links presented on the first bar on the top of the page - it wasn’t there. I then skimmed the content of the page - look left, look center, look right - and didn’t find what I needed. Finally, the bottom two navigation bars didn’t include the specific link I was trying to find either.
At this point, I pressed CTRL+F and began typing the phrase for which I was trying to find - specifically, I was looking for ‘registry’ in order to find the link for the wedding registry. No results matched - I found registration and register. Frustrated, I started looking for the link again from the top of the page. I found it buried in the second-level navigation bar next to the search field. Why was a wedding registry link next to the search field as opposed to, you know, a ‘Find’ button being next to the search field? Anyway, the reason that the find feature didn’t expose the link was because all of the navigation links are images and this got me thinking. At this point, my primary issue with this site was that not only could I not find what I was looking for on my first visual pass of the site, it was that I could not find what I was looking for even when I relied onmy browser to help me and it failed. It took me a third pass of scrutinizing the main page to find one link - a link that was an image instead of text.
Why would someone create their navigation links as images? There was absolutely no animation on the images, there were no drop-down effects, there were no icons, there were no hover effects - there was nothing at all. The navigation links were static images of text. The site’s load time would have been improved if text had only been used, and CSS could have taken care of all of the stylistic issues. At this point, I decided to inspect the main page of the site a bit more - I found that almost 90% of the content on the page was made up of images. The only text on the page was located on the footer. Again - why? Why not create containing block-level elements decorated with CSS? How are screen readers supposed to read your site when the majority of your content is contained in an image? With images making up most of your content rather than a well-structured XHTML document, you’re automatically decreasing your search engine optimization. Although most people are on broadband connections these days, you are still hurting those people on lower speed connections because it will take so much time for the site to load.
I don’t dislike images on web sites. Like every other piece of content, they have their place; however, if you’re using images to convey some form of expected, relevant information to your audience, then you’re doing it wrong - you’re abusing the web. Essentially, you’re throwing SEO to the wind, ignoring your handicapped users, and telling your audience that you only care about the average joe with decent vision such that s/he only has the standard text-size setting on his browser, that they are in no-way impaired such that they have no dependence on screen readers or other accessibility tools, and that you expect him to read every piece of content on your site when looking for what he needs. Granted, this is any designer’s or developer’s perrogative, but I’d argue that you’re not really passionate about what you do nor that you care about the web as a medium if you build your stuff like this.