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/
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/
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/
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/
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/
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.
