By now, every CEO should know the basic premise behind responsive design. Responsive design ensures that your website will display an optimal experience to your customer in accordance with the device they’re using. This definition sets the framework for responsive design, but it does not answer all of the questions one may have about this growing website necessity.
I sat down with our Lead Senior Front End Developer at Stratus Interactive, Jeff Aspenburg, in an attempt to answer the most common questions we face regarding Responsive Design.
What is the main difference between responsive design and mobile?
Responsive design is a single website or web application that adapts to each device, whether it's a tablet or mobile phone or even a large desktop screen. It makes use of flexible layouts, flexible images and media queries.
[Transform your website into your top salesperson: DOWNLOAD OUR FREE GUIDE!]
Mobile design is a website or web application that is created for a particular device.
What process do you use to make certain that a client needs a responsive website as opposed to a mobile site/application?I start by asking the client about their audience and their buyer personas. This gives us insight into who will be viewing the website. Next, we research their google analytics to see what devices their audiences are using to access the website. If a good number are mobile devices then they would be a good fit.
However, not having a mobile audience is not the end all for not having a responsive site.
Old websites were built with small fixed width columns between 600 and 800 pixels wide that now make a website look too small for our large computer monitors, and leaves blank columns on both sides of the website. Responsive design would also be a great fit for this scenario.
Websites that are content driven are a great fit for responsive design, since it’s much easier to read a website when the font adapts to the device you are viewing it on.
Responsive design is not just about adapting a website to a device. It is also about limiting elements of the website to be more easily viewed on mobile devices. Our clients need to be ok with this, otherwise they wouldn't be a good fit. Limiting elements can make for a better UX, faster load times and a simplified navigation.
As a developer, how do you determine prioritization/breakpoints?I start with standard breakpoints:
• Laptop
• Tablet
• Mobile
I like to look at a website’s Google Analytics to get all the data on what devices are trying to access the website. This helps me decide what custom breakpoints to add the responsive design.
Recently, we’ve been adding large screen monitors to our breakpoints of 1200 px and above.
Every website is different so tweaks are done throughout the website to make sure the UX is up to par for the device. We use a program called Browserstack (http://www.browserstack.com/) to view our projects on a variety of devices.
In what three ways do you see responsive design evolving over the next few years?1. Web technology has really grown over the last couple of years and I think responsive design will grow with the time.
2. I think viewing websites on laptops and desktops for general information will soon end and tablets will soon take over, but I could never see myself developing a website on a tablet.
3. There are so many devices out there now and the number is growing rapidly, only making it harder and harder to have perfect responsive website. I feel this is a huge issue developers are up against.
--
Have a question about responsive design? Leave it in the comment area and we'll answer it!