UI Mistakes That Drive People Crazy

Sometimes the best way to know how to design a great application or website is to know what not to do.  The importance of this knowledge has become increasingly clear, as contrary to expectations, websites are not generally improving in line with advances in technology.

If you’ve spent any significant amount of time browsing around the Web, you will almost certainly have encountered your share of frustrating situations caused by bad UI implementations.  You may have found yourself wondering how it is possible for so many sucky websites to exist in this modern age of 3D printing, personal jetpacks, and flying cars.  The answer seems to reside mostly in the fact that may designers (for want of a better word) suck just as badly as their work does.

Real designers apply knowledge to the things they create in order to solve problems for people, making something that looks good and that has real functionality.  An example of great design innovation is Toyota’s inclusion of a chiller box above the glove compartment in their Rev series of pickup trucks.

Or please consider Mitsubishi’s method of automatically switching on the rear view video screen when reverse gear is selected in the Pajero.  These are good design features because although they are not necessary for the operation of the motor vehicle, they enhance the experience for the user by providing useful functionality in the vehicle UI that results in a more positive UX.

Contrast this type of designer with the one who has done three days of community college and purchased a copy of Learn Javascript in 24 Hours and you’ll quickly understand why we have such a massive problem confronting us as web users.

Strive to be the kind of designer who engineers useful experience-enhancing solutions, and not the kind who adds stuff into a page just because “it will look neat” or because “everyone else is doing it”.  This way you won’t drive too many people crazy.  Now let’s take a look at what does drive people crazy, so you’ll know exactly what to avoid…

1. Being too different

Innovation is almost always good, but there can be times when people over-innovate.  The more different you make any parts of your website look and function from what people have come to expect from a typical website, the greater the number of usability issues that can potentially arise.

Think for a moment about the bravery of the first person to move a navigation menu from the left side of the screen to the right side.  While the right is actually a more natural place to put it—due to something we might talk about in another article about reading gravity—placing the menu on the left was so standard that at first many people were bewildered by right-placed menus.

Nowadays it is more standard to place primary navigation at the top of a page, and “hamburger menus” have become so commonplace they could now be considered a standard.  The majority of websites now place advertising on the right margin, and again this comes down to reading gravity (however those designers placing the ads on the right margin may not necessarily know that it’s the best place to put them).  Conversely, it’s nearly always a bad idea to put the ads on the left unless you really want an ad to get noticed.  It will get noticed because it’s in the “wrong” place, but use this technique with care.  Getting no attention is much better than getting negative attention.

2. Stacking

There is only so much room available on a screen, and sometimes you just have to place something on top of something else.  Up to a point, that’s OK, but it should always be easy for the user to get rid of it or move it out of the way to see what is underneath.  Many websites are ruined by the addition of frustrating overlays that are difficult to remove.  Making that problem much worse, what is contained in the overlay is not something that is useful to the user, but simply some kind of nagging or begging for the user to subscribe or buy something.  That’s putting you and your needs first, something you should never do on a commercial website.

3. Including stuff just because you can

Everything on your site should be there for a reason and you should be able to explain that reason adequately to anyone that asks.  If you’re not able to explain the presence of something, it’s a bad design, simple as that.  Many websites today feature huge carousel banners and numerous video plug-ins, none of which are actually necessary for the content supported by the page.  Add to that fancy graphs and charts, newsfeeds nobody asked for, and basically anything that doesn’t help the user to do what they came to your website for.

4. Compulsory form fields that don’t need to be compulsory

When doing business, there is some information you need to have and some information it’s just nice to have.  You shouldn’t get these categories of information mixed up.  Some users may legitimately resent having to fill in an intrusive form field that they can’t opt out of.  At the very least, you’ve forced them to waste some precious time thinking up some fake data to post in the field.  A related problem is form fields that restrict input to a certain format when they don’t need to do so.  Not every phone number will fit into the format you are trying to impose, and not everyone has a middle name or even a surname.

5. Endless loop GIFs in articles

These things are always annoying.  This is one of the oldest web annoyances.  It was annoying people 26 years ago and it’s still annoying people today.

6. Hidden booby traps

You should be honest with your users and you’ll get their respect.  Some websites use sneaky tricks to try to get results.  These include slightly less annoying tricks such as making some of the slides in a slideshow just a page full of ads, so instead of “18 Ways to Remove Baby Vomit from a Car Window” like you promised, you’re only giving them 14 ways plus four pages of ads.  Other tricks include disguising ad links as “next” buttons, using misleading headlines that don’t relate to the page content, and the worst of all is saying something is going to be free when it really isn’t.

7. Unreadable text

There are a few ways to achieve this undesirable feature.  One is using a tiny font size that requires a lot of effort to read.  If your text can’t be read from a distance of four feet (120cm) away from a computer screen, then it is too small or not clear enough.  Another is to place text on top of images or other content without giving thought to contrast.  And finally there is a more recent issue where for some reason people are moving away from strongly colored text towards soft shades of grey or pale blue, which may be aesthetically pleasing but is hell-on-Earth to read for more than a few minutes at a time.

Want to know the best way to design an interface?

It’s really simple.  Just do the opposite of all the things listed above, and your site will be a winner.  Well, actually it wouldn’t hurt to learn about composition, color balancing, using white space correctly and other useful things like that.  But that’s what the rest of this website is for.

header image courtesy of Alexandra

Catalin Zorzini

I'm a web design blogger and started this project after spending a few weeks struggling to find out which is the best website builder for myself. Check out my current top 10 website builders.

Leave a Reply

Your email address will not be published. Required fields are marked *

Rating *

This site uses Akismet to reduce spam. Learn how your comment data is processed.