Designing your site to be responsive means it can adapt to browsers of all shapes and sizes.
This means you don’t have to create a separate site for mobile, tablet and desktop.
Operation Mobile are fully trained in the art of responsive design.
On a desktop browser the site looks like this.
On a mobile device the site looks like this.
As you can see the site remains easy to use and still looks good on a mobile browser.
You can read more about responsive design here.
When you’re designing your site to be responsive how do you know it works?
You could use resize the browser yourself, use a browser plugin to change the size for you, use tools within your IDE or open the page on devices with different screen sizes.
All the above are valid solutions but what if you wanted to see what a page looked on different screen sizes in a single view?
Matt Kerselys ‘Responsive Deisgn Testing‘ site lets you do just that.
Just input your URL hit return or add the URL you want to load as a query string parameter like this http://mattkersley.com/responsive/?http://db.tt/tSEztIzq
As you can see above a website is shown in frames of differing sizes.
Check out this demo where the number boxes increase and decrease in line with the width of a page.