10 Design Elements to Avoid for a Professional-Looking Site

Most online store design rules are common sense, e.g. no music players unless you’re selling music. I think we’ve all got a handle on that one – it’s been a long time since I’ve seen anyone break it.

There are others that should be common sense, too, but some people still don’t follow them. Like the one that says you need to double-check your spelling, because if you can’t get their/there/they’re down, no one’s going to trust you with their credit card information. But those are still simple enough that we don’t need to spell them out again (and again).

The ones we’re interested in are the ones that aren’t intuitive, or that many online businesspeople – especially the newer ones – might not have even realized they’re breaking.

So if your e-store includes any of the following items, remove them immediately. They’re giving your viewers eyestrain, killing your conversion rate, and hurting your attempts to be taken seriously.

As we’ve mentioned in a previous article, a single popup – set to trigger when your visitors leave the site – can be an excellent place to invite customers to sign up to your email list. But that’s the only time you should use a popup. And be aware that even that will annoy a portion of your viewers.

I assume anyone reading this is smart enough to stay away from popup ads – there’s a reason they’ve been largely relegated to the same kinds of sites that give you malware.

On one hand, you have the sites that look like the designer was blindfolded and spun around before being let loose on a hex chart.

These are usually built by well-intentioned amateurs who want their websites to “pop,” but don’t know anything about color theory or combinations. On the other, you have websites with light gray text on a white background – a design crime often committed by pros who should know better. Neither extreme is what you want, so make sure to properly study how to mix and contrast colors on your site.

You only need two to three fonts: one for your header, one for your body text, and if you’d like some more visual interest, one more for captions and other design elements you want to set apart from the rest of your site. But that’s it.

Don’t go overboard with the H1s and H2s, either. If you want to emphasize something, bold or italicize it. But even that should be done sparingly.

Videos are proven to enhance conversions on sales pages, but I can’t think of any reason to have more than one per page. Your viewers came to buy something, not to simulate a TV store window from the 70s.

On a related note, too much choice on one page can overwhelm your visitors. It’s been proven that the more choices a store offers, the more people will stop to look, but the less they’ll buy. Research suggests that the more choices you offer, the more time it will take viewers to think them over, and the more likely they’ll be to postpone the decision until some unspecified time that often never comes.

But wait: don’t throw any of your variant products in the garbage. The best way to deal with this is simply to organize your site so that there are more categories—but again, not too many—so your viewers can more specifically nail down what they’re looking for. Then limit the amount of choices within each category to a few strong options.

I can see a few uses where these would be acceptable, like ebooks, downloadable white papers, and… and… No, that’s pretty much it. Anything else you care about your viewers seeing should be on a real page on your website. Even your sales brochure should have an online equivalent. Long articles about your business, like scans from local newspaper reviews, should be reduced to a few snippets you can put on your testimonials page.

Fitts’ Law states that people are more likely to click on bigger things. No, it’s not some internet joke rule. It’s actually far more interesting and complex than that summary, but that’s the most efficient way to put it. It’s common sense, but a lot of web designers still get it wrong, giving undue importance to trivial things and hiding the important ones by making them small and out of the way.

For example, how many sites have you seen where the contact link was tiny and hidden in the footer? Or where the social buttons were miniscule, off to the side or towards the bottom of the page, and made the same color as the rest of the page in order to blend in? And how many sites have you been to where it was difficult to access the sales page? So take this into consideration when you design.

If your readers have to read the “about” page or, even worse, sit through an intro to figure out what the site’s about, you have a problem. This isn’t too common with online stores. Usually it’s an issue relegated to design studios, art collectives, and apps. Still, online businesses who put looking cool over actually being informative can easily fall into that trap.

There’s a reason the minimalist, vertical-scrolling look is popular among online businesses these days. Personally, I think it’s getting a little old, but it does one thing very well: it keeps the customer’s focus on the content.

There’s nothing wrong with using a tasteful photo or illustration as your background, but it’s advisable to blur it, lower its contrast, or find some other way of making it fade into, well, the background. You don’t want your viewers continuously looking back to it instead of at the products.

If you’re going to make anything online, let alone something expensive, you want to see large, detailed pictures of it from multiple angles. This is basic, but you’d be amazed how many new online stores still fail to provide images larger than 500×500. If you’re worried about how to incorporate them into your layout, just use them as zoom images, or provide a link to the larger version.

There’s a special addendum to this section: make sure if you have a small primary image with a mouse-over zoom function, that mobile users also have some way of easily accessing the hi-res version.

It’s strongly recommended to get a professional designer to implement your ecommerce website design. No matter how cool the image of your site you have in your head is, a professional can implement it better. Plus, ideas often run headfirst into reality when you try to implement them. Everything takes longer, is more expensive, or requires more coding than you’d expected – or worst of all, you get it the way you wanted, but it still looks like it’s missing something. However, if you have to do it yourself for the time being, these tips should keep your site looking at least competent.

What’s your least favorite product page design problem? And how did you avoid these problems when you were designing your own site? Any more advice? Let us know in the comments.

Image: Death to the Stock Photo

About

Brenda

Brenda Barron is a freelance writer and blogger for hire, specializing in technology, WordPress, business, and e-commerce topics. She lives in southern California with her husband, daughter, and two cats.

Sito web