Contact a sales consultant 1800.814.4761 or 305 513 3922
"More than 350 designed amd implemented sites"

Monday, September 06, 2010

Top 5 Web Design Trends for Today's eCommerce Success

In these heavily competitive times in our online industry, having an appealing website that converts visitors into clients is more important than ever. You site has to get the visors' attention, make them stay in your store and become interested in bro
wsing your catalog to complete a purchase. For all types of businesses, design can be the key factor to make the difference.

This week I read this article by Grace Smith from Mashable, where she analyzes 5 design trends, that if they are correctly used, can lead to great results. Her anaylsis is very smart and results-oriented. These trends are: Minimalism, Unique Photography, Bold Typography, Clear Calls to Action and A/B Testing.

I'd like to share her analysis with you, and if you find it interesting and believe that any of these can help boost your online business, don't hesitate to contact Gproxy. We can help you leverage your store with this and more techniques designed by our team of professionals.

1. MINIMALISM
While this web design style has been popular for some time, it’s worth revisiting as no small business owner wants to turn visitors away with a cluttered, overbearing and hard to navigate website.

Minimalist design effectively strips away the excess and helps the user concentrate squarely on the content. If a page has too many elements, the user will easily become confused about where to focus on, with many elements vying for attention.

With page weight now affecting your Google search engine position, it’s the perfect time to reassess how streamlined your design is.

There are several principles and steps you can follow to create a more minimalist design:

  1. Go through your site and prune any unnecessary widgets or elements which aren’t serving a real purpose.
  2. Make good use of whitespace, which is the space between different elements of a design. Used well, it will allow for easier scanning of your site and help frame the elements on each page.
  3. With fewer elements, choosing the right color palette or accent color is critical. As color has great significance and meaning, it’s best to test how certain colors interact with each other.
  4. Browse your site through the eyes of your visitors, evaluating if there is too much information, confusing or off-putting elements, or sufficient calls to action. Answering these types of questions truthfully will help you prioritize the essential elements.
A minimalist design doesn’t have to be bland and boring; it can easily be modern, fresh, sophisticated, elegant or refined, based solely on the details within the design.

2. UNIQUE PHOTOGRAPHY
Two men shaking hands, a group of people in suits sharing a joke, the call center girl: these are all tired, cliched images that litter thousands of business websites. These types of images fail to convey either information on the company or a sense of the site’s character, and are essentially meaningless.

Using custom photography or artwork whenever possible is recommended, though for small business owners, both time and budget are limited and stock photos are a relatively cheap and accessible resource.

So when choosing stock imagery, it’s best to keep in mind these four tips:
  1. Research your competitors and industry and take note of the images used. You can then find a unique way to represent your product or service.
  2. Avoid being too literal in your choice of imagery as abstract compositions often give a more dramatic and memorable effect.
  3. Don’t always opt for the cheaper low-res image, as pixelated imagery devalues your overall design and looks unprofessional.
  4. Veer away from the bland and predictable and let the images ‘break out of the box’.
Imaginative imagery will reinforce your brand message and add greater character to your website. So, when you must use stock imagery, do so with great care and take the time to find the right piece that will convey the true personality of your service or product.

3. BOLD TYPOGRAPHY
Web design at its core is about communication, and typography is a vital component of that. Great web typography helps bring order to information and creates a coherent, visually satisfying experience that engages the reader without their knowing.

A recent trend is the use of big, bold typography which helps to create contrast between other text while grabbing a user’s attention. Oversized text can help create hierarchy and ensure users understand your message loud and clear.

In order to utilize typography to create a bold statement, keep in mind the following tips:
  1. Determine the single most important message you want to emphasize, as too many messages can lead to choice paralysis. Understand the qualities of the message you are trying to convey, and then look for typefaces that embody those qualities.
  2. Choose a typeface that will match the character of your work. For instance, if your company embodies the feel of an Old Style font, you should consider Bembo, Garamond and Sabon. It will also greatly depend on what you want to convey with the type, because legibility is as important as the character of the type.
  3. Give the typography the prominent position it deserves by surrounding it with a generous amount of whitespace. This will add emphasis and create even more focus on the typography.
  4. Test out some of the various font replacement options such as Typekit or Typotheque. These allow you to license fonts to embed within your site, and help you to experiment with beautiful typography.
Typography is an art and the decisions you make are subjective; however, carefully selecting a typeface can make a huge difference to the quality of your design.

4. CLEAR CALLS TO ACTION
As a small business owner you want your visitors to complete a certain task when they land on your page. It could be to download, sign up or checkout, but these calls to action are one of the most important (and overlooked) elements in a small business website.

You want to grab your visitor’s attention and move him or her to take action. Crafting a clear, concise call to action is essential.

Here are four tips to keep in mind when designing a call-to-action button or advertisement:
  • Language: Keep the wording short and snappy (always start with a verb), but also explain the value behind the action the user is taking. In some instances it also helps to create a sense of urgency using words such as ‘now’, ‘hurry’ and ‘offer ends,’ with ‘free’ being the number one incentive.
  • Positioning: Ideally, calls to action should be above the fold, and be placed on every page of the site in a consistent position. For instance, Squarespace (shown above), not only has a large call-to-action button at the top of the page, but also has a slightly smaller button in the footer of every page.
  • Color: The color should make the call stand out from the rest of the design. Brighter, more contrasting colors usually work best for smaller buttons. For larger buttons, you may want to choose a less prominent color (but one that still stands out from your background), so as to balance out its size.
  • Size: The call-to-action button should be the largest button on any given page. You want it to be large enough to stand out without overwhelming the rest of the design.

It’s vital you test different combinations of call-to-action buttons and see how each affects your conversion rates (see A/B Testing below). It’s also best to make sure they fit within your overall design.

5. A/B TESTING
With competition growing fiercer online, it’s important for small businesses to have a website that converts visitors to buyers and creates a competitive edge. That’s why it is important to continually measure and improve site performance, usability and conversions.

One of the foremost ways of optimizing your web design is via A/B testing (sometimes referred to as split testing). An A/B test examines the effectiveness of one landing page over another. The two versions are randomly shown to site visitors to see which generates the best results. You then evaluate the performance of each and use the best version.

Various elements can be tested, including, layouts, copy, graphics, fonts, headlines, offers, icons, colors and more. Here are a few tips for A/B testing:
  1. Clearly define your goal before beginning any test. For example, if you wanted to increase sign-ups, you might want to test the following: type of fields in the form, length of the form, and display of privacy policy.
  2. Start with elements that will have the biggest impact for minimum effort. For instance, you could tweak the copy on your checkout button to see if conversions can be improved.
  3. Don’t use A/B testing in isolation as this alone won’t give you a well-rounded picture of your users. Instead, use other feedback tools, such as Feedback Army or User Testing, in conjunction with A/B testing to get in-depth analysis of user behavior.
A/B testing won’t make a bad design great, but it will prove an effective aid in optimizing your current design’s usability and conversions until you decide to overhaul your website design completely.

These are the five design trends analyzed by Mashable, but there are many other trends that might better adapt to each particular inudstry and business needs.

Contact Gproxy Design Team of Professionals today, and learn how we can work together in pushing your eCommerce business to the next level. To contact us, please click HERE.

0 comments: