Commonly Misused Web Design Techniques that Tank Conversions

Web design is an evolving craft with room for change.

+ There used to be a need to display well for just 1024x768 screens; now brands need to think about a small army of devices and screen sizes that will be used to get to their site

+ There used to be no need for the hamburger menu; now it's a critical component of Web usability for small screens

+ There used to be a need to say "click here" all the time when users were still being educated about how the Web worked; now "click here" is a distracting relic from a bygone era

There's no doubt that change is and will always be part of good Web design.

That said, there are a ton of sites changing their Web design to accommodate newer website elements like using ghost buttons, which, when used in the wrong environments, can take a serious toll on conversions.

Web design change is useful when it addresses technology problems (e.g., hamburger menu, responsive design) or when it solves for a change in the general user mindset (e.g., the removal of "click here" from links). When it's introduced simply for style, however, brands could fall into Web usability traps.

Masonry Layout

Look, Pinterest is great. It's an incredibly beautiful environment that is great at what it does. What Pinterest does not do is this:

+ Cater to a group of task-oriented users who have a specific need

+ Serve a demographic that will leave if they don't see a path to fulfill that need quickly

That description fits the bill for basically all ecommerce sites and over half of the educational sites out there.

The "masonry" layout (see image) is a niche technique being used for non-niche purposes, to the detriment of user experience. The usual reason for imposing this on users is an executive going "let's make this site sexier" or "our site feels dated."

If a company has visitors going to its website to look for a specific product or service, job number one is to help the user find what he or she is looking for. Being sexy or trendy is a nice plus, but it shouldn't be done if it's going to get in the way of users finding what they need.

The masonry layout is a great way to trade a lot of Web usability for minor design gains. (Note that "grid" layouts with specific dimensions are fine for most ecommerce sites, while the masonry layout with uneven blocks is not.) A company should only use masonry layouts if:

+ The audience isn't in a task-oriented mode for the visit (leisure/travel/special hobby sites)

+ Sales, downloads and trials are not the website goals (brand-building is more important than conversions)

What about Ghost Buttons?

There are very few things that can tank conversions the way misused ghost buttons can. Read more at wsm.co/ghostctas.

Content-Free, "Feel Good" Labels

There are a ton of sites that employ "happy talk."

There's a pretty good reason for this: if a user does not feel welcome or if the user thinks the website is too cold or transactional, that user will leave. That part is actually true.

The problem is that in trying to avoid being "cold," the pendulum usually swings too far in the opposite direction, ending up somewhere in the "friendly alien" zone.

Only marketers will think of using "discover," "enjoy" and "celebrate" for trips (see image), when the perfectly normal "hotels," "cars" and "flights" will get the job done, but we still see a ton of sites do that for navigation purposes.

Rather, however, brands should design all labels for clarity. The test is, users should have a reasonable idea what to expect when they click on a navigation element. If a site fails that test, marketers are being too cute. And rather than being warm and charming, brands are coming off as an insecure company trying to be clever. Be warm when writing copy for descriptions - the website labels are written for clarity.

Missing Breadcrumbs

For the past few years, breadcrumbs have been getting kicked in the teeth.

For whatever reason, flocks of designers have declared them unhip, unfit to stay in clean, flat designs with a mobile-first or mobile-only philosophy. Some designers started treating Web designs with breadcrumbs the way they treat sites with "click here" as a navigation element, basically insisting that both of them are dated elements that are no longer needed.

The thing is, "click here" doesn't serve any purpose other than to educate users that they can in fact "click" on a particular element. Since that battle has been won 15 or so years ago, the convention can go away.

Breadcrumbs (see image), while they've been around pretty much as long as websites have been around, fulfill particular needs:

+ They tell the users where they are relative to the rest of the site, which is critical if they get to the site from a search engine or from another website rather than the homepage

+ They provide paths to other parts of the website architecture

Those are not dated needs. They are just as relevant today as they were 20 years ago.

Make Only Necessary Changes

It's not a binary choice - brands can have a trendy site that's also usable.

Designers only make compromises that harm usability and conversion rate optimization when they follow Web trends without knowing what they are designed to do. Most of the time, when professionals use "feel good" labels, take out breadcrumbs for "clean" design, utilize ghost buttons or use a masonry layout, they are giving users an incentive to transact with someone else.

Martin Greif brings 25-plus years of sales and marketing experience to SiteTuners where he is responsible for driving revenue growth, establishing and nurturing partner relationships and creating value for its broad customer base.