Prime Insights

5 Key Concepts of Responsive Design

Two and more years ago, the only people really talking about responsive design and development were the professionals. Those people doing it and helping their clients by building their sites that way, but those same clients didn’t really know to ask for it.

Now they do. More and more, the everyday web user knows what responsive means, at least in its most basic definition, and business owners are demanding responsive sites because they know that is usually the best option for them.

So, you might know basically what it is or know to that it helps your site’s SEO and user experience (UX), but what exactly are the key concepts of responsive design?

  1. Good responsive designers and developers know that the key philosophy is mobile first. Why? Simply put, when you’re building a site, it’s easiest and most efficient to start with the smallest viewing size.
    But mobile first isn’t only about ease of build; it’s also about really examining your content and deciding what your user is going to need. With mobile first, you can strip down to the essentials, keeping your site lean, quick to load, and easy to consume.Mobile website
  2. Code once, publish everywhere. This one is really more for us lazy developers out there, but it’s a great money-saver for clients, too. With a responsive site, we write one set of code and that one set works across browsers and devices.
    Why is that great for you as a client? One set of code means one place to update (unlike the 2-3+ for an adaptive site), saving you time and money throughout the life of your site.
  3. Mobile sites need everything. And I mean everything, that you can do on your desktop. Didn’t we just talk about trimming the fat for mobile? Yes, but that was for the whole site.
    A key component of responsive design is giving your consumers the ability to do everything they can on a mobile phone the same as they could on a desktop.
    The consistent experience of responsive also means they don’t have to learn three different ways to achieve the same goal on your one site.
  4. Images and videos need to be flexible. This component might be aimed a bit at a developer, but clients can bear this in mind, too. When choosing the images that you want on your site, remember to provide hi-res graphics that can be viewed well at 2000 pixels wide and great at 320 pixels. Keep away from graphics with text in them, since what looks great on a large screen will be illegible on a mobile.
    Videos, too, need to be easily viewable no matter what the screen size. And developers, make sure to make them responsive so they don’t bleed off the side of the window.
  5. Everything needs to be fluid. Even your typeface. This is often a component people forget, but everything on your site needs to look great from 320-2000 pixels wide and above. That includes your fonts.
    See, those large bold headlines on your desktop may be force-broken in weird places on a much smaller device. Font sizes will need to change by screen size, but don’t think that a small screen means impossibly small text. Rather, your main copy text might actually be a bit bigger on a mobile to allow for skimming, but your headlines a bit smaller to make sure they fit. In the end though, it’s all about what’s best for your personal user’s browsing experience.

Do you have any other key concepts of responsive design? Please share your thoughts in the comments below.

Author Byline: Ford Saeks, Business Growth Specialist, Keynote Speaker, Author and Consultant. Helping you find, attract, and keep your customers.

July 7, 2015 Posted By : Ford Saeks


Submit a Comment

Your email address will not be published. Required fields are marked *

Recommended Reading

How to Create a High-Converting Homepage

How to Create a High-Converting Homepage

Do you ever wonder why some businesses bring in a ton of leads that convert to sales while others struggle to stay afloat? Why some make huge profits while others barely break even? There could be a plethora of reasons behind a business underperforming, but a pretty...

read more
Event Second Screening: Is Your Website Responsive?

Event Second Screening: Is Your Website Responsive?

Think about the last event you attended. Usually the speaker will have a slideshow or some kind of media to provide an interactive element. Many will have their website listed throughout the materials they show. If you like what you’re hearing, is it not one of your...

read more
Yep, Even Speakers Need Mobile Websites. Here’s Why…

Yep, Even Speakers Need Mobile Websites. Here’s Why…

If you're a professional speaker, you can't afford NOT  to have a mobile website-- and not just because your site's rankings depend on it. Even if you're not seeing a lot of mobile traffic to your site, having a mobile presence is still a tremendous asset for...

read more
  • Subscribe And Stay On Top

    Sign up for Prime Insights and get big ideas for your business.
  • Ready to increase the performance of all your marketing efforts?

    Download "10 Tips to Transform Your Marketing Materials Right Now", our guide to getting results.

Audit Your Marketing. Transform it.
Outpace Your Competition

Enter your info and we’ll analyze your website, SEO, social media, videos, copywriting, design and more!

  • Audit your marketing. Transform it. Outpace your competition

    Enter your info and we’ll analyze your website, SEO, social media, videos, copywriting, design and more!