10 most common mistakes in web design you must stop doing right now

Anyone can call himself a web designer. However, the quality of work can vary tremendously. Avoid the 10 most common mistakes in web design right now.

Creating a website is dead simple, nowadays. Anyone can just buy a template and fill in the content. Services like Squarespace or Wix make it possible even without knowing any HTML. So basically, anyone can call himself a web designer. However, the quality of work can vary tremendously. Moreover, the differences are not obvious to your client. Here are the 10 most common mistakes in web design according to me and how to avoid them right now.

1) Designing above the fold

Back in the 90's, web design used to be different. Everybody was designing fixed layouts, for one screen resolution, trying to fit as much as possible above the fold.

Nowadays, the situation is way different. We have hundreds of devices and screen resolutions, different web browsers. There is not the resolution. And the websites don't have to look the same across all those devices.

Moreover, people are used to scrolling, nowadays. Scrolling is exploring, clicking links is decision making.

Stop trying to fit everything above the fold. There is no fold. Let people scroll by designing a meaningful information flow on your page.

2) Designing what client wants, rather than what he needs

Oh, the clients. They always ruin your design by insisting on using a cat photo in the background...

"Make the logo bigger! Put an image carousel on the homepage! Can you make it blue? My wife likes blue!"

Client's perspective on web design is usually very limited. The clients don't know, they don't know. This is called the Dunning-Krueger Effect. Psychological studies suggest the most incompetent people in a given area tend to overestimate their skills, almost as they were professionals.

Don't fall into this trap and start questioning everything client tells you to do. Otherwise, you will end up re-designing the whole website to match clients biased wishes. This is not design work.

Listen to what your client has to say but always validate the information. The best way to do so is by conducting some kind of user research.

3) Poor typography

Typography is the foundation of web design. Some even say web design is 95% typography.

I agree.

Typography is not about the font choice. It's about the good use of typographic elements, styles, and vertical rhythm. A layout of a web page is nothing else than arranging text into blocks.

Good typography is invisible. That's why it's not obvious to everybody. But just take a look at a random great-looking site. Now leave out the images. What you'll end up with is a solid typographic foundation.

Study it, explore it. Try to recreate it. You will find out, it's all about the small details. The font size. The white space. The combination of fonts. And so on.

Or the other way around - take a bad design. Now, focus just on the typography and try to make it right. It will take your design to whole another level.

4) Designing without a real content

In my previous article, I argued that designing a website without content is like writing a book without having anything to say.

The fact is, no one comes to your website to admire your beautiful design. The only reason people visit a website is the content.

When designing a website, you should have a clear idea of what type of unique content are you going to offer to your audience.

If you can't offer anything, you might not need a website at all. Just saying.

5) Not including a clear call-to-action

Hand in hand with the content goes an online marketing strategy.

Every page should have one clear action to take, a call-to-action. This might be:

  • Buying a product
  • Signing up for a newsletter
  • Making a project inquiry via the contact form
  • Sharing an article on social media

What is the point of having a traffic on your website, when you don't work with your audience? Make yourself clear about the overall goal of your website first!

6) Using auto-rotating image carousels

Using an image carousel (especially an auto-rotating one) is one of the best ways to bury your content. Still, everybody wants one. It's amazing to me.

Many studies have proven, people ignore image carousels. One of the reasons being they look like an ad. And people are really good at ignoring ads.

"But XY have an image carousel!"

The fact, that somebody else is using a carousel doesn't mean you need one too. You can't even tell it works for them. There are some situations, where carousels perform well. However, designing one isn't that easy.

In the most cases, just replace the carousel with a static hero image. It will perform much better.

7) Bad contrast and readability

People don't read on the web unless they're really interested in the content. They rather scan the content, looking for certain keywords and phrases. Don't make it hard for them by violating the readability and using poor text-background contrast.

The most common mistake I encounter is exceeding the optimal line length. Not only does the text block look terrible, but it also makes it hard for your eyes to find the next line.

The optimal line length is between 50 and 60 characters.

8) Poor forms and error messages

The forms are the place, where the interaction actually happens on your website. At the end of every user-flow, there typically is a simple HTML form to fill out and to submit.

It would be logical, to treat it with special care. However, this is often not the case.

The user experience of a form has a huge impact on the conversion rate. Make it as easy as possible for the user to complete the action:

  • Make sure all labels are clear
  • Reduce the number of required fields to minimum
  • Place the labels above the fields, rather than to the left
  • Don't use placeholders for long forms
  • Provide meaningful error messages

9) Effects overload

There are tons of nice premium WordPress themes. They offer great flexibility, functionality, and features, including animations.

The only reason for this is to sell the theme to you.

Don't ruin the user experience by overloading your website with meaningless effects. An animation should always have a clear purpose, it should communicate some kind of state-change on your website. One simple animation can save you a long description of what just happened.

But animating every element just because it's kinda cool makes only the opposite. The same goes for the overuse of the parallax effect.

10) Poor navigation and information architecture

Often, designers focus on the homepage but tend to forget about the other pages. Yet the homepage is there only to get user's attention and guide him to some other page, where a conversion might happen.

Therefore it is crucial to provide a clear navigation and information structure. Try reducing the number of pages and avoiding multiple navigation levels. A shallow structure is always easier to navigate than a complex one. Simply because the user doesn't have to make decisions, where to click next.

Conclusion

To distinguish between a good and a bad web design isn't as trivial as some might think. The clients especially. Don't do everything your client tells you to do. He often has no idea about web design.

There is a lot of things down the road that can go wrong. Don't do things just because everybody else is doing it. Be aware of the most common mistakes and avoid them. The impact on the result can be huge.

Filip Pižl

Filip Pižl

Filip is a Czech interactive designer, living in Dresden, Germany. He focuses on UX/UI design and strategic web design.