How Do You Know If Your Web Site Is Responsive?

Posted on

Examples Of Responsive Web Design

Two prospective clients recently asked for my thoughts about their sites. One site was launched over a year ago and the other has yet to be born.

Both shared something in common. Neither was responsive. That is, the designs of each site were not appropriate for mobile devices. Since so much web traffic originates from mobile devices – even for a site you’d think no one would use with a cellphone – having a mobile friendly web site design isn’t just a nice idea. It’s a must.

There is no excuse building a site today that is not mobile ready. How that’s done is something I can tackle in a future post. Right now I’m going to show you how to tell if a web site is responsive. And by responsive I mean that it looks and works well no matter what the device.

The Down And Dirty Way To Check

Here’s a little video of what I and many others do to quickly gauge whether their site is responsive.

Running Time: 5:30

Tools

There are free online tools which work a bit like HTML and CSS Validation (if you know what those are and I know my students do).

Most of these work by copying then pasting the URL of the page you are checking into a text box then seeing the results.

1. Responsive Design Checker

This one is so cool. You can easily check on 10 different display environments. What’s more you get a working version of your site in all of these options. A wonderful tool!

2. Responsive Design Simulator

This one is much simpler and it shows a web page in fully functional representations of a cellphone, tablet and desktop. But when I tried it I saw scroll bars in the cellphone and tablet sims which made the simulation look unrealistic.

To be sure Responsive Design is an interesting and complicated subject. It’s not just how something looks but how users will interact with your site. Emulators like I show you here don’t test for touch events like pinch or swipe. For that I recommended that you do real world testing on the devices you know your audience is using.

Lots of different approaches here. Just wondering what you do.

Tags:


2 thoughts on “How Do You Know If Your Web Site Is Responsive?

  1. Dear Bud:

    Thanks for your video on Responsive Design. I’ve installed a free version of Responsive Theme but of course I wonder whether a paid version would be a little bit better or potentially much better in terms of load time and viewer engagement.

    This brings me to my main point. From what I can see here you have mastered clean & clear cut WP visual design so naturally I wonder whether your time would not be better spent helping clients clean up their WP sites to achieve the best possible responsive engagement rather than focusing on mundane how to get going with WP tutorials that are easy to find all over the net at rock bottom prices.

    I know that my site has a long way to go to achieve the right “look” and navigation. I am also trying to learn Thrive Themes editor and of course master what the just right combination of plugins is needed to make my site rock but stay stable.

    Finally, once I have a model site building instruction set I want to be able to clone it quickly with WP Twin so that I can achieve a “house look” across niches.

    And of course I should not have to pay more than I would for Lynda or any other reputable WP course.

    To sum up. Is there anyway you could offer a before and after WP site makeover service? The first step is easy for you. Just go to x,y,z site and note the glaring deficiencies ( about 15 minutes max per site). The second step is to send the client a bullet point list of hot fixes for action. If the client needs hand holding to make the changes you charge him/her for that as an additional service.
    After the client implements the suggested changes you swing by one more time for a final check.
    And of course you put a free Survey Monkey questionnaire up on your site that asks relevant questions about the purpose & goals of the site(s) under review so you have a good idea of what the site owner is trying to achieve before you visit the site.
    To go along with this you may want to write up a free teaser ebook or a kindle book that explains your take on WP design philosophy and related subjects focusing on how WP site owners can take control of their own design destinies rather than use expensive designers.

    Well, that’s how I see things anyway.

    Congratulations on the design for Joy of Code. Its crisp and tasty like a New England apple.

    Best,

    Harold

    • > Dear Bud:

      Harold

      Thank you so much for your thoughtful post here and please accept my apologies for taking this long to reply to you. My comments are interspersed below.

      > Thanks for your video on Responsive Design. I’ve installed a free version of Responsive Theme but of course I wonder whether a paid version would be a little bit better or potentially much better in terms of load time and viewer engagement.

      > This brings me to my main point. From what I can see here you have mastered clean & clear cut WP visual design so naturally I wonder whether your time would not be better spent helping clients clean up their WP sites to achieve the best possible responsive engagement rather than focusing on mundane how to get going with WP tutorials that are easy to find all over the net at rock bottom prices.

      Actually, the design used for my site is from Twitter Bootstrap which is one of the most popular frameworks. I just worked off of that theme to develop what you see here. A Framework, as you may know, allows designers and developers to start their work above ground zero. It speeds the development process and it lets people like me build off of the shoulders of giants in the web design world.

      Your suggestion is good but you’d be surprised at how uninterested people are in this. At least that is my experience. Yes, sites do need help but it’s not usually a tweak here or there. It’s usually a total make over as they move to responsive sites. I’m not interested in promoting myself as the guy who will re-make your site so that it is responsive. Everyone is doing that already.

      > I know that my site has a long way to go to achieve the right “look” and navigation. I am also trying to learn Thrive Themes editor and of course master what the just right combination of plugins is needed to make my site rock but stay stable.

      If I can help you with this let me know. I know that sounds contradictory but I probably can help. At least you can run your ideas by me.

      > Finally, once I have a model site building instruction set I want to be able to clone it quickly with WP Twin so that I can achieve a “house look” across niches.

      > And of course I should not have to pay more than I would for Lynda or any other reputable WP course.

      > To sum up. Is there anyway you could offer a before and after WP site makeover service? The first step is easy for you. Just go to x,y,z site and note the glaring deficiencies ( about 15 minutes max per site). The second step is to send the client a bullet point list of hot fixes for action. If the client needs hand holding to make the changes you charge him/her for that as an additional service.
      After the client implements the suggested changes you swing by one more time for a final check.

      Well, you’ve already seen my take on this but I’ve also said I would work with you if that is something you’d like. Actually, in one form or another I have been doing this all along. I used to say, “I don’t make web sites. I make them better.” And that will always interest me.

      > And of course you put a free Survey Monkey questionnaire up on your site that asks relevant questions about the purpose & goals of the site(s) under review so you have a good idea of what the site owner is trying to achieve before you visit the site.
      To go along with this you may want to write up a free teaser ebook or a kindle book that explains your take on WP design philosophy and related subjects focusing on how WP site owners can take control of their own design destinies rather than use expensive designers.

      > Well, that’s how I see things anyway.

      > Congratulations on the design for Joy of Code. Its crisp and tasty like a New England apple.

      Thanks again but as I said it was build as a child theme to Twitter Bootstrap.

      Bud

      Best,

Leave a Reply

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