If you are developing a website that uses Responsive Design techniques, there are several tools available for you to test Responsive Design.
One of the most commonly used tools for testing Responsive Design in the past is the use of the Opera Mobile Emulator: http://www.opera.com/developer/mobile-emulator
However, if you are not concerned with the use of specific devices that have different screen sizes and you just want to test out your media queries that are used as part of your Responsive Design, you can do this directly using Mozilla Firefox!!
In Mozilla Firefox, use the Shortcut Key Combination: Ctrl + Shift + I. This will bring up the Developer Tools.
On the right hand side of the Developer Tools, you will find a button for Responsive Design:
You can then click on the Responsive Design button to highlight/select Responsive Design:
Once the Responsive Design button has been selected, you should see a screen like the following in Firefox that will allow you to choose various different screen sizes to allow you to test out your media queries:
In addition, if you will be bouncing back and forth between using Responsive Design techniques and non-Responsive Design techniques, you can also use the Shortcut Key Combination Ctrl + Shift + M!
One of the most commonly used tools for testing Responsive Design in the past is the use of the Opera Mobile Emulator: http://www.opera.com/developer/mobile-emulator
However, if you are not concerned with the use of specific devices that have different screen sizes and you just want to test out your media queries that are used as part of your Responsive Design, you can do this directly using Mozilla Firefox!!
In Mozilla Firefox, use the Shortcut Key Combination: Ctrl + Shift + I. This will bring up the Developer Tools.
Once the Responsive Design button has been selected, you should see a screen like the following in Firefox that will allow you to choose various different screen sizes to allow you to test out your media queries:
No comments:
Post a Comment