Having a responsive mobile version is a matter of good tone today. When mobile eCommerce is taking 63% of all purchases and this figure is increasing with every year, one has to make sure his website looks fresh and beautiful on any device. With the help from Dtelepathy research we have gathered for you the best practices for Responsive Mobile UX with examples from the top leading companies.

1. Focus on important

Remember, that going responsive is all about the size and focus. Sometimes less can say more. When developing a mobile version, one has to know what’s the most valuable element of the page. Don’t be shy to put in the centre of attention. It can be site highlight with a bright photo (as we see in the example), subscribe form or product feature. Help you customer to notice the main thing the very moment he visits your website from the mobile.

Website: https://www.change.org/

Responsive Mobile UX Tips

2. Provide flexible structure

Think thoroughly about the navigation and flexibility. Let your customers decide themselves what they want to see. Hamburger structure is one of the most popular among Mobile UX specialists. No wonder, it lets customer to see it all with no space sacrifice.

Website: http://www.bonobos.com/

Responsive Mobile UX Tips

3. Keep it minimal

Keeping it minimal is another good thing you can do for your Mobile Version. Mobile User doesn’t have to see all the beautiful pictures you designed. Leave it for the Desktop. At the same time you can use some light-to-load fonts and SVG icons to keep the style.

Website: http://morehazards.com/

Responsive Mobile UX Tips

4. Use simple colour palette

Simple colour palettes look better on small devices, since there’s no much to show there. This way if you have a bright website, it might be worth cutting down to 2-3 colours on mobile. The website that sells paint managed to do wtith 2 colours only.

Website: http://thepaintdrop.com/

Responsive Mobile UX Tips

5. Keep your personality

With all those pieces of advice it is easy to get into another trap – lose the personality of your website. If you have a mascot, some feature background or special icons, try to find some place for them in your mobile version. Just as Pack found a place for their puppy. This would help customer feel less shocked, when they switch from desktop to mobile.

Website: http://packdog.com/

Responsive Mobile UX Tips 

We hope these practices helped you to understand Mobile UX better!

If you feel you need help with a mobile responsive development, feel free to drop us a line.

How useful was this post?

Click on a star to rate it!

Average rating 4.9 / 5. Vote count: 11

No votes so far! Be the first to rate this post.

We are sorry that this post was not useful for you!

Let us improve this post!

Tell us how we can improve this post?


Author

Daria Stolyar is a Marketing Manager at Rubyroid Labs. You can follow her at Linkedin.

Write A Comment