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.