Friday 7 June 2013

Online Responsive web design testing tools


Responsive Web design testing tools

Responsive design is an approach to web page creation that makes use of flexible layouts, flexible images and cascading style sheet media queries.  The goal of responsive design is to build web pages that detect the visitor’s screen size and orientation and change the layout accordingly 

1. http://mattkersley.com/responsive/ 

This tool has been built to help with testing your responsive websites while you design and build them.You can enter your website's URL into the address bar at the top of this page (not your browser's address bar) to test a specific page.


2. http://responsivepx.com/ 

Enter the url to your site - local or online: both work - and use the controls to adjust the width and height of your viewport to find exact breakpoint widths in pixels. Then use that information in your media queries to create a responsive design


3. http://screenqueri.es/ 

Screenqueri.es is a Pixel Perfect Tool to Test your Responsive Design / Media Queries. Select from 30 Pre-defined Screen Resolutions OR Drag Screen Handles To Go With Your Custom Screen Resolutions


4. http://responsivedesignsimulator.com/ 

The responsive design simulator serves one purpose: to help designers, and audiences, visualize their responsive sites on popular devices. Simply type in the URL for your site and view the scrollable simulations below. Keep in mind, this is not a replacement for actual mobile testing as the mobile browsers can render CSS and HTML uniquely.


5. http://lab.csschopper.com/responsive/

 An exceptional online responsive website design testing tool by CSSCHOPPER to test responsive design on different device resolutions