What Makes a Website Look Dated?

As designers, we always want to create work that is either on the cutting-edge or “classic” and timeless. It is important to have a design that looks great and is conceived deliberately in a current style. Having an outdated style for your website can leave a negative impression with your visitors, reduce your overall traffic, and lower the interest and credibility of your site. Retro or vintage designs are great, but retro/vintage and outdated are two entirely different concepts, and no visitor will interpret an outdated site as a purposeful throwback to an earlier time. You can avoid the dreaded dated look by steering clear of these seven pitfalls.

Having Anything that is Flashing or Blinking

Sites with these effects are going away, but believe it or not, I still come across sites with these antiquated effects every now and then. Don’t place banners on your sites that flash or blink, as they are distracting from the content and a part of a disadvantageous strategy. If someone wants to buy something on your site, they will. Strategic placement is much better than utter annoyance any day. Also, don’t set your headers or anything else to blink or pulsate. They used to use this a lot in the 90’s and now it just looks dated… not that it ever looks spectacular.

Generic Colors

Using the default colors for your site is a quick way to make your site look dated. Having your links in the generic blue, and having them underlined is the sign of a less-than-dilligent designer who’s happy with the browser defaults. Most sites now use colors for their links that match the rest of the site. They are usually styled with a hover state using CSS, so visitors know that a section of text is actually a link. Also, when you use a lot of fluorescent colors that don’t go well together, that can make your site look like the dated work of an inattentive designer. Colors that are too bright hurt the eyes, so be sure to use colors like that sparingly, if at all.

Generic Typefaces

In recent years, @fontface and Google Web Fonts has made it easy to integrate custom typefaces in your websites. No longer are you stuck with Arial, Helvetica, Verdana and the other “web safe” typefaces. You can integrate beautiful, bold typography within your site to give it a custom look and personality of its own. It’s easy to do, and your sites will look much more up-to-date and professional.

Using Tables for Your Design

The days of using tables and slicing images into a grid are long gone. Now, you can and should construct all of your layout ideas via CSS. Having a couple of PNG files mixed into a CSS layout is okay, but you no longer have to slice up images to make a beautiful website. You can add dimension to your websites with the text shadow and box shadow CSS properties. Also, there are tons of grid CSS layouts and frameworks that you can use to structure your site properly.

Using Images Where You Could Use CSS

Since CSS has become the predominate method for designing sites, this have almost disappeared from web design altogether. One of the most common uses for using images where you could use CSS was for adding custom typography to a site that just wasn’t available at the time. Now, with Google Web Fonts and @fontface integration, you can find almost any style of typeface that will match what you are looking for. Combine this with transitions, CSS gradients and other effects, and the need for a lot of imagery has gone away.

Not Taking Advantage of CSS at All

Using CSS will make your site much faster than using images. You can achieve so much in the way of style and structure that you never could before. You no longer have to struggle with tables or slicing layouts. When a site doesn’t take advantage of CSS, it’s apparent even to a visitor who doesn’t know their padding from their margin. You just can’t get the same speed, structure, and user-friendliness from a sliced design as you can with CSS. You end up seeing each slice load, and when one gets hung up, then it leaves an ugly hole in your design. Using CSS will cut your load time in a fraction of what it would be with a sliced PNG layout, and it can offer numerous other benefits in the realms of responsiveness, search engine placement, cross-browser compatibility, and more.

Not Using Transparency in Logos & Images That Require It

This is one of the quickest ways to look dated and unprofessional. How many times have you been to a site where the background is a certain color, and the logo looks like it has just been haphazardly pasted on there? Don’t leave a white background behind your logos. Use Photoshop to create a GIF or PNG file with a transparent background. The background of the site will show through and will look much more natural than if you just use a flat JPEG.

Conclusion

Web design is always in a state of progression, and it’s important to stay up-to-date on the latest practices so your website doesn’t look dated. If your website has any of the qualities shown above, you might want to consider redesigning it or at least upgrading it. What do you think is something that makes a website look dated? Share your thoughts in the comments section below.

Frequently Asked Questions about Website Design