10 Design Mistakes To Avoid: Part 1
When designing for the web or any other graphical piece, there are usually a few mistakes that are commonly made. To help you avoid these costly hiccups we’ve come up with a list of 10 mistakes you should try to avoid when creating your visuals. Make sure to check back next week for our final 5 – Part 2.
1) Web 2.0 Graphics
While Web 2.0 is commonly associated with the development of social media like Facebook, Myspace, and LinkedIn, there has also been a type of design style that grew along with it. Web 2.0 graphics are commonly associated with shiny, bold elements often featuring some form of depth (like heavy highlights and shadows) to a nearly cartoon-like level. At the time these graphics worked; people wanted to connect with each other online more and having websites with energetic, inviting assets naturally encouraged that.
Social media isn’t a novelty anymore so there’s no real reason to treat design the same way. People want a clear function in how a website works, not overbearing graphics for the sake of having them. Particularly since Retina-based displays are becoming much more common, even the most subtle graphics are already vastly more vibrant than on a traditional monitor.
2) Excessive Skeuomorphism
Skeuomorphism is a design trend promoted by Apple in which graphical elements appear as hyper-realistic objects. For example: a bookcase for an e-book app would appear just like a real, wooden shelf with the slight grainy nuances found in one proper. This blurs the line between digital and reality, and makes for an exciting showpiece.
While still a great tool for enticing users, the trend has become overused to some extent. It is slowly being replaced by clean, sometimes minimal aesthetics like (oddly enough) Windows’ Metro design. Based more on functionality and typography than detailed graphics, it works to bridge the gap between desktop and mobile devices. However, some (me included) feel if used incorrectly it may appear too lifeless, so a fine line between function and form must be analyzed when working on a modern design.
3) Sun Burst
Sun bursts have already found themselves fading out after years of being used to promote sales and other exciting calls to actions. This type of element isn’t horrible, but simply found over-use due to its simplicity in designing and attracting the visitor’s attention. It can still be utilized, though, as things such as fade outs and softer lighting can alleviate a sun burst from seeming too bland while retaining its ability to help a subject stand out.
4) Lots of Fonts
Thanks for CSS3 (and CSS2 to an extent) featuring non-standard web fonts on a website is finally available for developers. This is great as it offers more customization and branding of a web page. With these new options also brings the hazard of overbearing the user with too many different font options throughout the page.
Focus on choosing just two fonts for your site, one for the headline and another for body copy. A typeface with different variants (book, bold, black, etc.) help as it allows a nice distinction between things like sub-heads while keeping everything in the same font family. And don’t be afraid to use the standard web fonts of Arial, Verdana, and company, as they remain extremely viable and easy to read choices.
5) Stock Photos
Stock photos have always been a difficult beast for designers. Websites need images and clients aren’t always capable of taking their own or paying for a photography session, so stock photos end up becoming the easiest way to populate the site. The human brain is excellent at analyzing images though and can tell when a photograph appears insincere. Nothing screams more generic “salesy” as a stock photo promoting a product.
This can be solved in a few ways, the best being to encourage the client to allow custom photography. If that still doesn’t work, try to adjust the graphics of a stock image through textures in a Photoshop layer or a gradient placed over top. It won’t remove the “fakeness” of the picture, but will help reduce its jarring nature amongst the rest of the website.