In this post, we’d like to take things a step further and highlight what makes good responsive design and what should be avoided.
First, to build a site with responsive design, there are two approaches:
Regardless of which path you choose to make a website responsive, we want to ensure you’re not forgetting one fundamental element: user experience.
Ultimately, responsive design on its own isn’t the key to conversions; it’s also the quality of your website from the user’s perspective. Ranking in the top of search results won’t do you any favors if a viewer clicks to your site and immediately leaves due to poor design.
With that said, check out these DOs and DON’Ts of good responsive design vs. bad responsive design.
Don’t: Make an exact replica of your desktop version.
Do: Include the key elements of your site and leave out the ones that aren’t necessary. Users don’t expect a carbon copy of your desktop site. In fact, it would be overwhelming!
Don’t: Use a generic, pre-made design.
Do: Maintain your branding throughout. Ensure each page reflects your brand at all screen sizes. Use elements smartphone users are accustomed to seeing. Also, be sure to preserve padding and white space to keep the design clean and easy-to-read.
Don’t: Put all of the content on one page.
Do: Incorporate a clear menu with access to secondary pages. Place your call to action on your main page and ensure the rest of the mobile site is easy to navigate.
Don’t: Use different images for different devices.
Do: Use images that resize within the confines of a fluid grid. This is done using CSS code and will ensure the images on your site don’t look stretched or pixelated.
Don’t: Design your mobile site as an afterthought.
Do: Think mobile-first. Why? Mobile web browsing on smartphones and other devices is replacing desktop traffic at an increasingly rapid rate. If the majority of users are accessing your content on a non-desktop device, make it function in a way that follows mobile norms and touchscreen patterns.
Don’t: Expect to get it perfect on the first attempt.
Do: TEST! Share your site with friends, family members, or test-group customers. Get their feedback. Know what they’re immediately looking for when they access the mobile page and display it prominently.
Keep these tips in mind when building your mobile-friendly website and you’re on the right track to providing a true quality user experience regardless of the device.
Embrace new technology and step ahead of your competition!