Home / Internet Geek / 15 Terrible Web Design Trends You Must Avoid

15 Terrible Web Design Trends You Must Avoid

The internet has come a long way since 90’s and in the last decade, we all have seen many unpredictable changes in the online world. Speaking of web designs, they have gone through a lot. Every year, we discover a new web trend and in the meantime, numerous of designs left behind.
A decade ago, the rise in popularity of flash and media content steered the designers down to the wrong path. That time the internet was flooded with thousands of annoying flash pages which were not much useful as they thought to be. Just because you can do something with technology doesn’t mean that you should do.

The design is the most important thing after content, it can either make or destroy your whole website. If you do SEO, you might know Google considers “user experience” as one of their ranking factors. Web designers sometimes tend to overthink and in order to gain more profit, they usually take wrong steps. So, if you are also using any of the following techniques, you are innocently killing your own business.

15. Visitor Counter

Visitor Counter

There are still many websites that show visitor counter, copyright and security badges at the footer. Even they don’t serve any useful purpose but having them on personal blogs is no big deal. However, on commercial websites it looks completely unprofessional.
There are thousands of elements available for free, but that doesn’t mean you should use all of them. Furthermore, there is no reason to show everyone how many hits you are getting.

14. Loading Screens

Loading Screens

A few websites display progress bar while loading the website. I bet, there isn’t a single person on earth who likes to see a loading screen bar. Showing a progress bar instead of content is really a very bad idea. On average, no user likes to wait on a single page that takes more than 3 seconds to load. The smart technique: display the crucial content first and let the other elements load.

13. Skeuomorphic Design

Skeuomorphic Design

You don’t need a design that looks real, sometimes simple is best. These days, the web trend is lean towards minimalist and flat designs. The fancy looks, 3d dish, real life fonts or elements look way too outdated. The modern trend is all about user experience and simplicity.

12. Hidden Navigation

Hidden Navigation

Many HTML5/CSS3 sites are primarily based on scrolling. They allow readers to reveal new sections while they scroll down. The idea is not bad but it creates problem when main navigation menu (which by the way works like table of content) goes missing. Still, if you want to hide your primary menu, make sure you are using a small icon to toggle menu.

11. Text Images

Image Text

You might have heard this name, “Google” that drives around 75% of organic traffic. Well, the problem with text images is most of the search engines including Google, Bing and Yahoo doesn’t look for character used in images. They only understand the image by its title, alt text and Meta description. Therefore, along with increasing the page load time, the text images will drop down the traffic you actually deserve.

10. Mysterious Icons

Mysterious Icons

Using icons in menu, toggle bar and key navigation make sense but using fuzzy or unprofessional icon can cause a problem. For example, in the above image, can you tell what does the tie represent? Although, when you hover, it will display a text “tie” but it is still not very much informative for your audience. Moreover, 40% of users are coming from mobiles and tablets and the hover option doesn’t work on these devices.

9. Making Demands

Making Demands

Readers should not be forced to learn how to navigate or use website, it should be intuitive. I have seen many websites that show messages like

  • Your browser/device doesn’t support xyz element, use the latest version of Chrome
  • This site is designed for iPad. If you can, you should check it out on one
  • The website looks great in Internet Explorer. Try to open it there

Instead of forcing readers to use this & that, why not you are making your design accessible and adaptable. Remember: Your clients don’t care about you, you need them, they don’t need you.

8. Too much WhiteSpace and Bizarre Fonts

Too much WhiteSpace

There are still many designers out there who don’t give much importance to white-spaces and fonts. They get so much involved in their own creativity that they forget the design is not about them. And then, what they end up with? A nasty, cluttered page hard to read.
Remember: The design shouldn’t be what you like, it should be dedicated to your audience, what they like. That’s the reason, designer and developers are using A/B testing technique.

7. Vague Animation

vague animations

The best thing about CSS and HTML is they let you add lightweight animations to the webpages. Also, people like to perceive information in a form of media/animation instead of thousands of boring texts. But animations are also a great source of distraction and should be used with caution. Most people often use random animated stuff to make their site more attractive. Do not add any unwanted or off-topic background clips that misguide your readers.

6. Nasty Popups + Ads

popups

The popup trend has been long gone and it is quite surprising how many websites still using this. It usually includes advertisement, subscription box and special gateways which visitors have to pass to read the content that they are looking for.
Splash pages are even worse, I don’t know why Forbes is still using them. May be because they have already established their visitor base. However, Forbes displays daily thoughts to make splash pages a little less annoying. P.S: Don’t use these kinds of redirects if you are new in the market.

5. Autoplay Video

If you wanna turn your happy readers against you, just put an auto-play video/music on the sidebar and he/she probably never visit your site again. Most of the people immediately close the tab when they hear any sound. Furthermore, if you are using third party advertisement, make sure they don’t contain any auto-play clip.

4. Stock Images

Stock images

Stock images can serve useful purpose in certain situations, but using them in access could be harmful for your brand. They quickly become recognizable for what they are: Cliché. So, it’s better to avoid some common stock images like stereotypical customers or corporate groups and try to use your own original ones.

Also Read: Internet Images you CAN and CAN’T use on your Website

Area of Improvement

3. Floating Elements

Web Design Trends You Must Avoid - Floating Elements

People have a big fascination when it comes to floating elements in websites. There is nothing wrong with that, even they are very useful in a few cases like

  • Sticky menu bar for easily navigating new contents on site
  • Sticky checkout box in sidebar of eCommerce website.

The problem arises when you overuse it in advertisements, subscription box and big header area. These floating elements deliver a very poor user experience, especially in smaller screen sizes. Also design-wise, they don’t look good at all.

2. Infinite Scroll

Infinite Scroll

Infinite scroll is a cool concept and people actually love it because they don’t have to reload whole page to see the next section. The problem arises when page scrolls automatically and it has a footer content which gets pushed to the bottom every time you go down. In this case, users experience difficulty while reading/accessing your footer content.

Facebook also had the same problem when they introduced infinite scroll on feeds. However, they managed to solve it easily, by putting footer links on the bottom of sticky sidebar.

1. Parallax

Parallax

Read: 24 Useful Bootstrap UI Editors for Developers

Parallax design is something new that majorly emerged in 2014 and to a degree they are pleasing to the eyes. Many websites are now using parallax design to introduce their product and service. A few of them are using parallax tutorials also which is absolutely fine.
The problem arises when people try to put the entire content in a single parallax page. To get the best out of it, use parallax on a single topic which is divided into several sections.

  • Very Informative Post, I love the way each topic has been explained. And Yes, I agree all the 15 points are true, and also I like the line that: We need visitors, but not that visitors need us! 😀

    Appreciate your blogging efforts!

    • Varun Kumar

      Thanks for your kind words Animesh 🙂