7 Ways to Ruin Your Responsive Design

vblog-ruinresponsivedesign-4.5.16-725x390

 

With Google and others placing increasing focus on requiring responsive design for mobile search, going responsive should be on every store owners mind. However, it’s important to know, not only what TO do… but what NOT to do.

Here’s our list of the top 7 ways you can undermine your responsive design

 

 Put a bunch of high-bandwidth content on your home page

Placing lots of high-resolution photos on your homepage will not be well received by users of 3G or capped data plans. Think carefully about what you feature on your homepage and navigation bar. Do you really need fifty “featured products” or could you get away with ten? Research has shown that mobile users are significantly more sensitive to load speed than the average desktop user so it pays to keep things minimalist, especially on entry pages.

Ignore your product fit and audience needs

How detailed are your product photos? Can they be shown smaller and still be usable on a phone? One column, two columns, three columns, what makes the most sense for your products?

vblog-ruinresponsivedesign-4.5.16-2

How is your content structured and how will it re-flow?
As a general rule, items will re-flow from left / right -> top / bottom so be sure that your responsive elements still work if they’re stacked.

vblog-ruinresponsivedesign-4.5.16-3

Don’t organize your products or categories

Have a lot of categories or products? Consider organizing them into easily navigable groups to prevent thumb fatigue from endless scrolling of your navigation menus. Endless menus are only good for hot wings and sushi.

Ignore the importance of the thumb

Speaking of thumbs, they’re important and are used for lots more than just liking things on Facebook. In fact, if you’re reading this on your phone,  the odds are good that you’re using your thumb right now! Of course your thumb is generally bigger than the rest of your digits, so make sure that you’re taking that into account when designing things that need to be tapped. Buttons, links, etc all need to be both large enough to hit as well as far enough apart that you don’t accidentally hit “remove from cart” when you mean to hit “check out now”.

Ignore content pages

We all know that article pages with relevant content are great for SEO, but if you’re not coding them to be responsive they may be actively hurting your site’s rankings. If you need some guidance, check out our DIY Responsive Design series of posts (Part 1, Part 2, Part 3)

Expect pixel perfection

Being an awesome designer can be frustrating. You spend hours and hours designing the PERFECT layout. Your fonts are stunning, your line breaks create the perfect rag, and your photos rival Edgar Degas‘ greatest works. Then on your brother-in-laws iPhone 7, the text breaks differently, the images seem smaller and your fonts, ugh! You’ve got two choices. You can either drive yourself slowly insane trying to maintain your pixel perfect layout or you can resign yourself to fluidity and instead focus your creative energies on writing that novel you’ve always dreamt of.

Surprise your customers

A redesign is the perfect opportunity to market to your existing customers. But before you go live with a responsive re-design, you should consider messaging your users, letting them know not only what you’re working on, but why.

vblog-ruinresponsivedesign-4.5.16-4

Then when you’re done, don’t forget to email your customer list and ask them for feedback. A re-design is a perfect way to get customers back to your store with just an email or two so take advantage of it.

Excited to get started with a responsive template for your online store? Check out the free and premium responsive templates available here or call our team of design advisors at 877-591-7005 for more information about our custom design services.

7 Responses to “7 Ways to Ruin Your Responsive Design”

  1. Adriano

    Add a responsive design (including responsive ad units) improved a lot my statistics in Analytics.

    Reply
  2. iJDMTOY.com

    Do Volusion offer review for the responsive website and give us advice on what to improve?

    My website is iJDMTOY.com

    Reply
    • Anjuli Desai

      Thanks for your comment, Eric! You already have a responsive site, which is a great step toward making shopping easy for your users! Below are a few suggestions from our team:
      – Simplify your homepage – We would recommend removing some of the sections on your homepage to help focus the users attention, currently there is a lot of information for the user to processes which can be overwhelming. Right now you have about 6 sections on your homepage (eg. Slideshow area, shop by parts, featured products, etc.) – we suggest reducing this to 3-4 of your most important ones. You could check your google analytics and see which area is getting the most clicks to help you decide which sections to remove.
      – HTML text – Some of your images have the text flattened into the graphic (example). If you remove the text from the images and code it as HTML, it will help with your SEO and be easier to update the verbiage. This should also help reduce bandwidth usage.
      – Utilize whitespace – Allow for some breathing room between images and text to allow the user time to absorb and process all of your content. Breaking your homepage into digestible sections will make the user experience much better.
      – Consistent color scheme – Spend some time finalizing the colors of your brand and make sure this is consistent across your site and marketing materials. Using the red from your logo for headlines or buttons will help guide the user to your most important content.
      We hope this helps, if you have additional questions, or would like to talk with one of our design advisors about some design or coding assistance with making these changes don’t hesistate to reach out.

      Reply
  3. John Reddicliffe

    We had our website redone to go responsive recently by Volusion and after a couple of niggling issues were fixed we are really happy with the end up result. Concerned about the talk of Google ranking with page speed I did a test using the page speed tools that google provides and we had a user experience of 99/100 which was great but only 38/100 for speed and worried that the speed might impact our google ranking. Is speed something that we should be concerned about.

    Reply
    • Anjuli Desai

      Hi John, That’s a great question. A site’s load speed is one of many factors that go into the overall SEO ranking. The longer it takes for a page to load, the more this signals to search engines that your page is not fast and user-friendly. Users who bounce from your site based on slow load times will also be seen by search engines. To improve site speed, see if you can feature fewer products on your category pages, as each product image that needs to be loaded is another request that must be sent to servers. Try to keep it to around 12 products or so per category page. Also, make sure the images you upload to your site are compressed and reasonably sized. And lastly, avoid flash animations unless they’re necessary. Hope this helps!

      Reply
      • John Reddicliffe

        Compression was a part that I was confused about, we do our images based upon Volusions Knowledge Base recommendations and when we did the page speed test one of the Google recommendations was :-

        “Enable Compression
        This rule triggers when PageSpeed Insights detects that compressible resources were served without gzip compression.”

        The confusing part was that google was saying that it was not recognising gzip compression yet Volusion has said that they use gzip compression on servers so I am a loss with conflicting information and slow page speeds. I was hoping with Volusions new responsive custom design that they did for our site (which looks great) we would have sparkling results to bring us to the forefront but I am worried about now loosing to page speed and ranking.

        When you mentioned about the products I thought I would do a test based on just that – Our new designed home page with 16 products shows a page speed of 38/100 and when all products are taken from our home page it rates 39/100.

        I really hope you can help me with this.

        Reply
        • Anjuli Desai

          Hi John, We’ve passed this feedback along to our product developers who are currently working on a number of page speed improvements, so you should be seeing some changes for the better in the near future. Good luck!

          Reply

Leave a Reply