In the world of web design, we can look around and see so many shining examples of what makes this industry great. Though we are certainly not an industry without our faults and flaws. In fact, with that same discerning eye one can look around and see examples of our less than stellar industry moments. In fact, one can even point to common examples of balls being dropped in various areas. For example, in the usability arena of web design.

Here we can point to a handful of overlooked elements and oft made careless blunders that haunt far too many of our web design pasts. And hopefully, with this post acting as a helpful reminder, our web design futures can remain free of these usability mistakes. So take a look through them and see how many of these proverbial skeletons linger in your closet.

No Mobile Consideration

Unfortunately for so many already established sites and designs, the explosion of the mobile web market has left many brands unprepared for this new landscape. Many sites and designs are simply not compatible with all of these new devices that have begun shaping a new direction for the future of the industry. There’s not enough mobile design considerations being made. There are plenty of examples of designs breaking on mobile devices, which is about as bad as usability issues get. Mobile users have now exceeded desktop users and every website owner should invest in a mobile friendly site.

At this time there are multiple solutions that one can seek to temporarily get their brands back on track in mobile contexts, but not too many that allow them to take their branding, and often costly designs along with them. So we see a bit of stalling in regards to progress in making the web a fully mobile friendly place. But as this new market continues to dominate in terms of growth, not having considerations of some kind in place for mobile is a big web design faux pas.

Most of the Pre Built WP themes from vendors like Themeforest are responsive. John from Keen suggest that you should still check the website responsiveness and resolution into tools like http://quirktools.com/screenfly.

More on Mobile Design

• Why Mobile Design Should Never Be an Afterthought
• The Mobile Design Process
• Adaptive & Responsive Design with CSS3 Media Queries

More on Margins & Padding

• Box Model: Margins and Padding
• CSS and Spacing
• What Are Margins and Padding in CSS

Not Enough Contrast for Readability

While we are on the subject of visual comfort and doing everything in your power to ensure that the content your design will hold will be displayed successfully, readability is one area that could use more focus. To be more specific, ensuring that there is enough contrast for everything to be read properly. Comfortably. This is one common problem area in web design for sure.

There are a number of web designs that fall into this trap, and at this stage in the game there really is little excuse for this slight to usability. Luckily there are services that will make any site readable even when we have not. However, if we as the designers do our jobs properly, most users will never have to avail themselves of such services while visiting one of our designs. Double checking the contrast of the text and any elements behind it should top your list of finer points tp focus on.

More on Contrast and Readability

• The Principle of Contrast in Web Design
• Contrast Rebellion
• Why Contrast Is Crucial to Web Design

Lack of Progressive Enhancement

This could actually be the cause of some of other errors we have brought up. If you are unfamiliar with this concept, then chances are, this ball has been dropped once or twice in your wake. The wiki definition is actually wonderfully put so we shall defer to it for a quick breakdown of this technique.

While this layered technique does require more time and work to pull off, it really does set the website up with the best possible presentation for those who can view it, all the while providing a natural degradability for others. It is somewhat of the high point of the usability peak. With the number of presentations one must consider and provide for, it is easy to see why this technique is not always employed.

But for the sake of the user. For the content. The client. Or just the design itself, progressive enhancement is the way to go when usability is your driving focus.

More on Progressive Enhancement

• Understanding Progressive Enhancement
• A Complete Guide to Progressive Enhancement
• Progressive enhancement demystified

The Unclickable Clickables

CRO or conversion rate optimization is one of the most neglected form of online marketing efforts. One thing that we as web designers have to keep in mind, is that the internet is no longer in its infancy. It has grown into its adolescence and now its users come with certain expectations. One of those expectations comes to calls to action and clickable elements. When users see elements that appear to be big button like objects, they expect them to be clickable. When they are not, users tend to not be happy with the site. Confusion sets in and they suddenly feel lost.

Same goes with little things like underlined bits of text. Usually anything that is underlined, or a different color from the rest of the text, is expected to be linked to something or somewhere else. So when users come across these unclickable clickables the intuitive nature they rely on from your design gets tossed out the window. They do not know what to expect, or how to move around. This can cause them to flee out of frustration rather than sticking around to try and figure out the specifics of your design.

More on Links & Calls to Action

• Give Clickable Elements a Pointer Cursor
• 4 Simple Design Elements Behind a Good Call to Action
• Simple CSS: How to Make Clickable Areas Bigger

Too Many Options

Another usability problem you spot a lot around the web, especially the longer sites tend to be around and relevant, is that the navigation options climb high into the realm of the ridiculous. When some users face an overabundance of options they become overwhelmed and they turn back rather than push forward. The fewer initial choices that the users have to make when they first begin to look around, the more likely they are to investigate.

If they have the inclination to poke around the site and see what all it holds, and they are immediately met with dozens of places to turn, the more likely they are to think that the site holds just too much so they don’t even scratch the surface. We want to encourage users to go deeper into the site, and in order to do so, we cannot make that seem like a daunting task. We need it to be inviting. And looking after this angle of usability can go a long way towards reaching this end.

Inadequate 404

One place where usability tends to fall to pieces is the 404 page. Generally looked upon as an afterthought (or at least that is how it feels from many of the web designs out there), this error page is not often looked upon as the opportunity that it is. Whenever a user loses their way, unless they have a particularly compelling reason to try, they will often turn around instead of trying to find their way around your site.

So we need to look at the 404 page as a user refresh page for the site. No matter what caused them to lose their way, we need to appeal to the user and come to their assistance. Draw them to other content, or provide a search box so they can look for the content that they were headed for in the first place (if it is even still there). Provide them with other useful information, something to make an impression. One that will erase the slightly negative impression they may be left with given the error.

There are some really great examples of useful and impressionable 404 pages all over the web these days, so dropping this ball is another hint that this part of the design is an afterthought. There are literally showcases across the web that demonstrate the effective ways that the design can help recover whenever these errors occur. We need only take heed of these examples whenever we are working on a website.

More on 404 Pages

• Building a Constructive 404 Error Page (With Examples)
• How to Create a Custom Error 404 page for Word Press?
• 5 Tips to Make Your 404 Page More Usable

The Waiting Game

This is an area of usability that we know we need to work on for Absenting ourselves, but that doesn’t make it any less important. Slow load times for a site can be a site killer these days as users are more and more prone to instant gratification. If our designs lag or drag for them, then we risk losing some who are unwilling to play the waiting game for whatever content we have in store for them.

Once again there are numerous ways to improve the load times of our web designs to cater to our users need for speed. In fact, if you are using WP for your site’s CMS, colorlib.com recently had a wonderful post on ways to speed up your site. The suggestions offered are great places to start no matter what CMS it’s based on. If your site has not been optimized with your users load times in mind, you might want to use one of the free tools that can identify any of these problem areas your site may have. Plugins like WP Fast Cache and WP Smush it will help improve your website speed drastically. To check your website speed, type in your website address into the google page speed tool.

After all, any steps we can take to improve the user’s experience should be seen as necessary ones to be taken.

More on Optimizing Your Website’s Speed

• How to Minimize Load Time For Fast User Experiences
• How to Test and Increase Website Load Time Speed
• Best Practices for Speeding Up Your Web Site

In Conclusion

Examples are all around us of these usability mistakes being made, as we pointed out, we have them here as well. But as long as we keep them in mind as we move forward, we can build a more user friendly web.