How and where can I test responsive websites for free

Web developer addon - Test responsive websites for free - pepfry

Web developer addon – Test responsive websites for free

How can you test responsive websites for free?

There are many tools for PC as well as you can test your responsive website online also.

But if there is a way to to avoid those time consuming process and use a simple tool which doesn’t consume much of your valuable time – wouldn’t you want to know?

Yes you would want, there are ways with which you can test responsive websites within the browser without any interruption of going to another tab and loading an external website and then loading your website URL and so on.

Not only that you can test responsive websites – you can also test your Responsive html email newsletters as well!

Go through the tutorial hereHow to create a responsive html email newsletter.

Now, you can do your testings in your comfort of your browser window itself. There are even shortcuts for that!

There are plugins available for browsers that allow you to test responsive websites within the browser and not the good thing is that you need not even reload your website which saves huge amount of time.

Nowadays, there are many browsers available in the market and some you might like and there are many you might not like according to your comfort. If you are a regular browser you might like Internet explorer because you might not have the knowledge that Internet explorer is called a browser and you there are other good browsers available in the market.

If you are a techie then, you should be aware of all major browsers available in the market. And, you might end up with linking a browser or two. Might be you like Firefox and Chrome as I do!

I have kept Firefox as my ‘The best browser‘. If you ask me why? – Its because, its developer friendly and flexible and many more goodness in it:-)

So, I love to debug websites using Firefox’s ‘Firebug‘ and test responsive websites using ‘Web developer‘ tool. Please see below for more information.

Getting you along to test responsive websites!

This plugin is exclusively for Firefox browser. Before you start testing your responsive website – you will need to install the plugin.

Open your Firefox browser and search for ‘Web developer addon for firefox‘ plugin OR click here ‘Install Web developer addon for firefox‘.

Once you have installed the addon – you are ready to go ahead and test responsive websites for the first time!

How to test responsive websites using web developer tool?

  • Open your Responsive website in Firefox browser
  • Click on Tools menu->Web developer->Responsive design view
  • Web developer tool bar addon firefox test responsive websites for free - pepfry

    Web developer tool bar addon Firefox – Test responsive websites for free

  •  OR just press Ctrl+Shift+M
  • You should then see your website browser turning out to be black by default and tool within the browser window and your website inside that tool!

    Web developer toolbar addon launched firefox test responsive websites for free - pepfry

    Web developer toolbar addon launched – Firefox test responsive websites for free

  • You can test your responsive website on a list of screen sizes in the dropdown found within the tool.
  • Web developer toolbar addon firefox scree sizes drop down list test responsive websites for free - pepfry

    Web developer toolbar addon firefox – Scree sizes drop down list test responsive websites for free

    The screen sizes in the drop down list are the standard screen sizes. You can however drag the outer boundary of the tool to change the screen size to your desired size

Below are few tests performed on my website using few screen sizes to show you how it works:

Pepfry.com – When viewed normally without any responsiveness

Test responsive websites for free pepfry regular version - pepfry

Test responsive websites for free – pepfry regular version

Pepfry.com - When viewed on 320X480 [iPhone Portrait orientation] screen size with the help of  Web developer addon

Test responsive websites for free - Viewed on 320X480 screen size

Test responsive websites for free – Viewed on 320X480 screen size

Pepfry.com - When viewed on 480X320 screen size [iPhone Landscape Orientation] with the help of  Web developer addon

Test responsive websites for free - Viewed on 480X320 screen size

Test responsive websites for free – Viewed on 480X320 screen size

That’s it guys, you can go ahead and test responsive websites for free for an unlimited time! You can test it on many such screen sizes of your choice.

If you have any queries, please do not hesitate to ask me or put it on the comment section below.

Please make sure that you also check the checkbox below the comments form [Notify me of follow-up comments by email]. So that you can get notified when I reply back to your comments.

Also, check the checkbox below the comments form [Notify me of new posts by email]. So that you are kept notified when I post a new tutorial or articles.

Leave a Reply

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

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">