Jay LeonardWe stress the importance of optimizing a website for the variety of devices customers use to access the web. After taking the leap to “go responsive,” it’s important to remember responsive design isn’t a simple copy and paste job. While the optimized website design should reflect the native site’s branding, different devices demand different viewing needs.
Before we dive into what you should be changing, Hubspot outlines some elements you should not be implementing:
- Flash, Quicktime or other animation plugins that are not mobile compatible
- Increasing the width of the page
- Decreasing the font size below 11px
- Creating too small of a navigation menu
Lengthy copy
Scrolling is the death of mobile visits. If your current copy is lengthy, it may be best to reevaluate it for smaller screens. See how you can get the same message across in fewer words or delete whole paragraphs together if you think they provide low value and aren’t engaging the customer. For many mobile visitors, they’re not on your website to read a novel—they’re there to get quick facts and information.
Unappealing images
The development backend will automatically resize images to fit devices, but it’s still important to evaluate images on high value pages such as the homepage and service pages. Perhaps your product images need updating because the details are too small—it’s OK to scrap images for the optimized site in favor for others that will complement the mobile experience. Additionally, scaling down the total number of images of a webpage will help load times.
Annoying ads and popups
Be sure to remove all ads and popups from your mobile and tablet sites as these are not easily modified for mobile devices. They also slow load times and are difficult to close out of when using a smaller screen.
Long videos
Your current developer should know to implement an HTML5 video player so video streams smoothly over mobile. Additionally, watch your video on a mobile device to experience it as your visitor and modify the time and quality if needed.
Un-friendly navigation
Navigation is critical to a successful website—regardless of platform. There should be a responsive equivalent page to every page on the native site. At times, a responsive site may even feature more pages when copy needs to be broken up to attract visitors. Additionally, the navigation menu on the responsive website should be “finger friendly,” meaning the navigation bar is large enough for user to tap on their smartphone or tablet.
This article was written for Business 2 Community by Jay Leonard.
Learn how to publish your content on B2C
Join our Telegram channel to stay up to date on breaking news coverage
Add B2C to your Google News Feed
Sorry, I don’t like leaving negative feedback on blog posts, but in this case I feel I must.
Obviously this has been taken from another website, but its author clearly doesn’t understand what Responsive Design is. Given he’s a web designer, that’s a little worrying. My guess is that it’s a re-purposed post on Mobile websites, but he’s heard Responsive is now the way to go, so changed its focus.
Inaccurate articles lead to confusion in readers without a basic understanding of the subject and I’d really expect better of your editing procedures in posting such a weak fluff-piece. My advice to the reader would be to ignore the advice in this post – there are plenty of better posts available on the subject.
For the record, with a Mobile website, you might differentiate between it and a “native site”, but a Responsive site simply re-styles, or re-positions content on each page – there’s no separate website.
Hi Darren – We appreciate your feedback on the above blog post. It seems there was disagreement over the use of the term “native website” when referring to responsive design.
We agree that responsive websites are using the design of the native site, and in the end it is simply a singular website. I think the confusion came from the article still trying to explain how a native site should change when going responsive, but I don’t believe that discredits the five points made in the article. You’re welcome to contact us at [email protected] if you have further questions.