Practical Ecommerce

7 Ecommerce Design Trends for 2014

As more online retailers seek to provide a good mobile shopping experience, expect to see a significant number of site redesigns in 2014. These redesigned sites are likely to follow many popular design trends that are currently impacting entertainment sites, publishing sites, and mobile applications.

Ecommerce platforms like Magento, Shopify, or even WooCommerce (on WordPress) can have a strong influence on how online shops are designed. This can make it more difficult for online merchants to simply redesign a site to keep up with the latest fad. But in 2014, even those sellers that take an “if it isn’t broken, don’t fix it” approach to website design may be forced to do some remodeling thanks to the continued growth in mobile Internet traffic. In fact, some predict that in 2014 mobile Internet usage will pass desktop Internet usage, and mobile-based ecommerce might account for 30 percent of Internet retail sales.

Given that ecommerce business are likely to be resigning to support mobile, these sites may also follow other important web design trends.

1. Responsive Design

Mobile is going to be the primary driver for ecommerce web design in 2014, but don’t expect Internet retailers to abandon desktop users. Rather, responsive design, which has already been a trend in ecommerce site design, will to continue to grow in popularity, allowing online sellers to provide a good shopping experience regardless of the device a shopper is using.

Solved by Flexbox

Solved by Flexbox.

As a subset, if you will, of responsive design, you may see more site designers using the CSS Flexible Box Layout Module. This is a proposed World Wide Web Consortium standard that is enjoying relatively good support across browsers, including at least partial support in Chrome 31, Firefox 25, Internet Explorer 10, Safari 7, Opera 18, iOS Safari 7, Android Browser 2.1, Blackberry Browser 10, and IE Mobile 10.

Three resources will help those unfamiliar with the Flexible Box Layout Module. These include CSS-Tricks’ “A Complete Guide to Flexbox,” the Mozilla Developer Network’s “Using CSS Flexible Boxes,” and Philip Walton’s “Solved by Flexbox.”

2. Finger Friendly Interfaces

The focus on mobile and what many call mobile-first site design is also likely to lead to more finger-friendly interfaces in 2014, since on tablets and smartphones most users are interacting with the web page using fingertips or, perhaps, a stylus.

In the context of ecommerce website design there are perhaps two impacts of the trend toward finger friendliness.

First, expect to see fewer content sliders. These sliders have long been popular on websites since they allow merchants to show a lot of information in a relatively small amount of screen space, but they tended to have relatively small next buttons that can make them a bit more difficult to manage on a smartphone.

Next, be on the lookout for larger navigation buttons and links, as site designers try to make it easier for shoppers to browse site hierarchies or click links.

3. Flat Design

Flat design can be seen in the Windows 8 interface, in Apple’s iOS 7, and in dozens of popular websites. This aesthetic tends to avoid drop shadows or similar — focusing on strong colors, and interesting fonts.

This design trend has a few advantages at present. It often leads to simple user interfaces that are relatively easy to make responsive. It tends to use graphics in a way that leads to relatively smaller file sizes and, therefore, faster loading pages, and it can be a differentiator for sites.

Sites like Canopy, which allows users to find and share products available on Amazon, offers a good example of how flat design is likely to be applied in ecommerce site design.

Canopy

Canopy

4. More Content on One Page

In 2014, expect to see site designers and developers adding more content to individual pages in at least two ways.

Quick views, which allow shoppers to get additional product information without leaving a product category page, are likely to continue to grow in popularity since that makes it particularly easy for mobile shoppers to learn more about products without having to load additional pages.

Also look for pages to become longer, perhaps, even scrolling “infinitely” like Tumblr or Pinterest.

5. Interesting Fonts

Online typography has been exploding, if you will, in the past few years, and this trend is not going to slow down in 2014.

Expect to see sites using distinctive, brand supporting fonts to convey an online store’s feel. To see examples of typography in action on an ecommerce site, visit Free People, Design by Humans, Afends, or the Yellow Bird Project.

Free People

Free People.

6. Great Big Graphics

This particular trend may seem counterintuitive in the context of mobile Internet use and the overall design to provide a better mobile experience. But it turns out that big graphics really is relative to screen size, and with a bit of good site development, designers can deliver big graphics appropriate for a user’s device.

Relatively larger graphics that link to products, also tend to make for finger-friendly user interfaces, which is another reason this trend will grow.

Sites like Born, Hagger, and Tommy Bahama serve as examples.

7. Video and Other Rich Content

Mobile video consumption is on the rise, more than doubling last year, so it is clear that consumers don’t mind watching videos on tablets or even on smartphones.

In this context, video gives online retailers an excellent medium for providing useful content and detailed product information. Look for more retailers to begin including video or other rich media content in content marketing and in product descriptions.

Armando Roggio
Armando Roggio
Bio  |  RSS Feed


Get the Practical Ecommerce RSS feed

Comments ( 18 )

  1. Victoria January 15, 2014 Reply

    Thank you for the great review – totally agree with design for finger touch – it’s now crucial, since shopping on mobile devices will soon be equal to pc. And as for flat – think it’s new iphone trend that has spread on all devices and platforms

  2. Isadora Design January 15, 2014 Reply

    Everything in this article is spot-on. As a web design company, we seek to create responsive web design (happy to see this listed as No. 1 on this trend list), as that solves many user access issues. A successful website designer knows that creating finger-friendly, aesthetically pleasing (like the trendy flat designs) interfaces transcends across phone, tablet and desktop use – and everything in between.

    Cassandra
    Isadora Design – Handcrafted Web Design Company

  3. Hugh January 17, 2014 Reply

    This article seems to omit a huge success factor for any eCommerce site, how does Google find you? The article mentions in step “More content on one page” but really what should be said is more relevant copy of each product on 1 page.
    Remember Google is looking for relevant copy and to give your page a ranking for a term and like iterations of that term. Having 20 or 30 items on a page (more content on your page) hurts you more than helps you as you are diluting the value of the page … what should Google reference this page for?
    One only needs to look at your Canopy example and think of it as Google and ask yourself, “What is this page about?” and “What is the most important thing on this page?” If you look purely at text … its “Amazon” … Good luck ranking number 1 for Amazon.
    Design is more about trying to emulate Apple … Apple can design the way they do because they are Apple. I would suggest that relevant live text is far more important to success of an eCommerce site than large graphics.

  4. Corey@cardtruth January 17, 2014 Reply

    I will keep note for trend #7 – Video and Other Rich Content. This will be a sure hit not only for e-commerce sites but also with social media platforms.

  5. Mike January 19, 2014 Reply

    Great article, I agree with everything here and I think to supplement #1 you could reference Zurb’s Foundation framework rather than flexbox. Foundation explains responsive much better, comes with a better arsenal and they even offer courses on responsive design.

    –Mike
    Otreva

  6. Suparna Rao January 21, 2014 Reply

    Great points here, Armando. Totally agree with you on flat design. Itlends itself very well to smaller screens and makes for better user experience.
    Suparna
    Boston Technology Corporation

  7. Darshita January 23, 2014 Reply

    The trends for Web are a little disheartening to me. It seems that the trend of aesthetics has been substituted for well, blah. Content is very important and if your site is utilitarian at its core, then by all means, content away. But where do you draw the line? It would seem that these new trends are like throwing the baby out with the bath water. UX means “user experience.” What kind of “experience” can be had by going to 10 different sites and all the user experiences is, “Oh…look. Another site with a white background, flat colors, and a bunch of text. Looks like Windows 8. What an experience…yay…next.” Is this the new “trend” that can be expected from all of this? When did the trend go from artistic expression via design to just making it work by using a bunch of canned content?

  8. Armando Roggio January 23, 2014 Reply

    @Darshita, personally, I think aesthetics are a vital part of site design, and I also, personally, think that at the moment, flat design is one of the most aesthetically pleasing design trends. Here are several sites that typify the flat design aesthetic, which are, in my opinion, very attractive.

    http://mediatemple.net/
    http://www.selectivefew.com/
    http://fontwalk.de/
    http://canopy.co/
    http://www.appearhere.co.uk/
    http://bravepeople.co/#1
    https://exposure.so/
    http://www.obabyapp.com/
    http://appdock.co/
    http://focuslabllc.com/
    http://zurb.com/ink/
    https://cottonbureau.com/
    http://hoverstud.io/babbit/
    http://estimote.com/
    http://www.ohbeer.com/

  9. Laura | Ricemedia Web Design January 29, 2014 Reply

    You can’t beat a good bit of typography – especially when the rest of the site is so minimalist.

    Laura @ http://www.ricemedia.co.uk/

  10. Diana February 11, 2014 Reply

    I used this website http://www.sincronix.com to redesign my webpage.

  11. Krish TechnoLabs February 12, 2014 Reply

    It’s very interesting, and I am excited to watch this year. Every day is a new learning experience with new tools being thrown in the game. I think responsive design or mobile apps for big eCommerce will lead this year.

  12. Vipin Jain February 19, 2014 Reply

    Great post! My personal favourite is Responsive Design, but I also like the long scroll (personally I use my mobile a lot, so both of these are awesome). Good post, thanks!

    Konstant Infosolution

  13. Mall of Style February 25, 2014 Reply

    I would give full weigtage to responsive design. Every one wants to shop with different devices.

  14. Daniel Tay February 26, 2014 Reply

    Great list, pretty much spot-on! I identified most of these trends in the top 24 ecommerce stores that I thought had really inspiring designs: http://bit.ly/1fVmQxA. Having quality high-resolution photography also seems to be another key factor.

  15. syed qasim March 4, 2014 Reply

    i like this artical it’s a great review finger touch is so awesome

  16. António Freire March 26, 2014 Reply

    This Article is very misleading. Things like videos in a homepage of an eCommerce website is very wrong, due to load time in mobile devices. Also, one page design and loading products in a lightbox or modal view via Ajax, are not best practices – of course you can contour that but thats actually not the reality nowadays – You should always follow best practices concerning website navigation and SEO. In conclusion, you say a lot of things that are wrong practices in the web platform. If you don’t have the knowledge you shouldn’t write about it!

  17. VIPete June 25, 2014 Reply

    I totally agree on the flat design part of your article. These days seeing gradients in design kinda make my eyes hurt! Responsive is also a must. Kinde feel sorry for the people who have had their ecommerce site made some time ago and are now kinda stuck with a non-responsive site, right? But well, trends come and go, and that is always good news for Ecommerce designers!
    Greetings,
    Peter @ http://floripadesign.com/

Email Newsletter Signup

Sign up to receive EcommerceNotes,
our acclaimed email newsletter.

And receive a free copy of our ebook
50 Great Ecommerce Ideas