Skip to main content

Human beings have a problem when things don’t work out the way it was supposed to. Even if we on some level knows that it might not be such a good idea for us to place our expectations on things that were never guaranteed, we still do so anyway. Perhaps it was a relationship that we thought for sure was going to be the one or a job that was supposed to fulfill all of our professional desires or even a website where things aren’t where it was supposed to be and that the links aren’t taking you where you think they would.

I’m deeply sorry to say that I have no way of helping you with the first two issues as I’m still struggling with those as well but if it’s the solution to the final problem you’re looking for, that is certainly fixable. Websites are an interactive tool and when we interact with a website, we have certain expectations on what our actions would result in. And yet, perhaps rooted in our desire to stand out from the crowd, basic interaction design mistakes are all too common in the world of web development.

 

Predictability in functional design

In films, literature or any kind of storytelling medium, predictability is something that is generally frowned upon. We want our stories to make sense but we want them to also keep us on our toes. The 1995 film The Usual Suspects is one of the shining example of a great plot twist and the name Keyser Söze remains one of the most enduring figure in pop culture in the two decades since. In functional design however, the opposite is true as predictability is actually the ultimate goal.

In the last decade, smartphones have probably become the device we interact with the most in our daily lives. Given the frequency of this interaction, we want to ensure continuity even when we switch from one phone to another, which is probably something we’ve done at least once since Apple’s iPhone revolutionized the industry. Things are simple inside Apple’s ecosystem, even if you switch from one generation of iPhone to another, the transition is smooth within Apple’s walled garden but in the free-for-all that is Android, things might get a little too messy.

In the Android ecosystem, phone manufacturers are free to put their own spin on Android, which is why it is possible to put two Android phones side-by-side only to find little similarities between the two in terms of interface. Even if you’re still technically using the same operating system, there’s still going to be a considerable learning curve involved when switching between them. This is the kind of thing you have to watch out for when dealing with interaction design in websites and the following are 4 examples of mistakes that still appear from time to time in web development.

 

Innovation for innovation’s sake

In this world of startups and ‘disruptions’, it’s common to see companies trying to innovate for innovation’s sake without adding actual value to what they’re trying to disrupt in the first place. There’s the deservedly mocked Juicero for one or that facemask that supposedly lets you keep your phone calls private when you’re in a public space but also has the unfortunate side effect of making you look like you’re very much into BDSM. Finding innovation when there’s nothing in need of innovating is pointless and so is the case with web development.

Traffic lights are all the around the world because they work. Steering wheels are all basically the same in all cars because it’s something we universally recognize. Designers have to be clever but they can’t be too clever and unless there’s tangible improvements between what you’re trying to do and how things normally are, making changes for change’s sake isn’t advisable. Some rules, like navigation bars being on the top or on the left or that clicking on your logo would lead users to your homepages, just aren’t meant to be broken.

 

Confusing typography

I honestly think that some web developers insist on using cursive fonts to get revenge on society for forcing them to learn cursive writing in school even though it’s rarely used outside of museum exhibitions. It’s not that cursive fonts have no place in your website, numerous brands like Coca-Cola, Brooks Brothers, etc still use cursive for their logo but they should absolutely not be used for the actual text. Functionally speaking, typography has to be clearly and easily read and cursive is definitely not the answer.

 

Intrusive pop-ups

If you have kids or deal with them regularly (childish adults also fall under this umbrella), you know how aggravating temper tantrums can be. Intrusive pop-ups are like temper tantrums for websites and while I know that they can be necessary, you have to figure out a way of using them without annoying your users. Tuck them in the lower left corner instead of splashing across the center of your website for example and try not to include sound or flashy animations as they can be distracting.

 

Clutter and overwhelming navigation menus

This is especially important for e-commerce websites that might have dozens of items in stock. While it might be tempting to just throw as much thing as possible in your homepage, this isn’t actually a good approach. Instead, try to display stylized pictures of select items that are meant to represent the various categories of items you have available. These images will then serve as a link that would take users to their respective categories.

As an illustration, say you’re in the business of outdoor gears and right on the homepage of your website, you display a picture of camping gears, hiking gears, duffel bags and survival kits. Your navigation bar should also reflect this, instead of putting a dozen categories all at once, use three or four main categories but add more subcategories within those categories. Branching navigational hierarchies are more preferred as too many options can be too overwhelming to people in general.