20 Web Design Mistakes to Avoid – Part 4: Design


Throughout the first 3 articles of this series that included tips for proper navigation, content and site structure, we’ve outlined a few ways to make sure that your site is very user friendly and highly functional.  Even if your site is a well oiled machined though, you still want it to look the part as well.

You wouldn't put a Harrier jet engine in your pickup would you? Alabamans need not answer.

Truth is, the design of your site can incorporate many of the same usability factors that we’ve talked about in the previous portions of this series.  Develop a design that caters to your prime audience first and foremost, but be sure not to alienate smaller target audiences.  Here are a few tips:

16. Avoid Strong, Harsh Colors and Low Contrasts

Your color scheme is a key component in setting a tone for the content of your website.  Bright red text on a fluorescent green background not only tells your audience “Welcome to my 1980’s arcade and meth lab”, but it will also have all the inviting feel of a rusty 10-inch ice pick to both corneas, especially after several minutes of focusing.  In addition, low contrasting color can be just as hard on the eyes.  White text on yellow or light grey for example, forces strain on your vision just to make out the text.

17. Avoid Crazy Animations

Animation can be a useful tool for your website when used in moderation.  Simplicity works best with animation, particularly in things like drop menus or fading between images in a photo gallery.  It’s important not to use animation as a gimmick.  Your content should always be the focal point on the page, not the 79 objects you have flying around the screen at all times.

18. Choose Fonts Wisely

Elaborate novelty fonts can certainly look sophisticated, but often times they are unreadable.  Sans-serif fonts typically work best for readability on the web.  These are fonts that don’t include any sort of structural details (like Arial, Verdana, Helvetica, etc.).  It’s just plain old text with no frills attached.

Also make sure that your fonts are large enough to be legible at the default setting.  Although most web browsers have a built in zoom function, you can’t necessarily rely on the user to know where it is or how to use it.

19. Make Sure Your Site is Cross-Browser Compatible

Not all browsers display web content the same, and there are truckloads of them out there.  By making sure your design looks the way it should in the most common browsers (Internet Explorer, Google Chrome, Safari and Opera) you’ll cover the majority of your audience.  Don’t forget to test for mobile as well.

20. Make Links Visible and Text Should Be Text

Your users should be able to easily identify links and recognize what parts of the site are active.  Links for example should either be bolded, underlined or of a contrasting color to the rest of the regular text on the page – at least something to differentiate it from other content.  Your regular text should also be just that.  Don’t try to create elaborate text-based images.  Not only can search engines not identify text within an image, but users with images turned off won’t be able to see anything at all.

Overall, these guidelines should help your design fit in nicely on the front end with our previous technical tips on making the most of your website.  If you’re looking for additional dos and don’ts or for a more effective way to manage your site, contact Point Click Media.

One Response to “20 Web Design Mistakes to Avoid – Part 4: Design”

Leave a Reply

  • (will not be published)

Fusebox Creative | 160 Millennium Blvd – Suite B, Moncton, New Brunswick Canada | Phone: 506-855-3591