Responsive design is more and more popular today. However, is there any way to test a website’seasily?
Yes, today I will show you 3 ways to test website’s Responsive design.
Viewport resizer is a Responsive design bookmarklet. It’s so easy to use.
Click or drag the button in Viewport resizer to broswer’s bookmark is ok.
- Full customization
- Add and customize sizes on the fly
- Manually orientation toggle by click (portrait | landscape)
- Automatically device window orientation in “Auto Size” mode (portrait | landscape)
- Media query support
- Adapt meta viewport tag from current page
- Manually page reload
- Remove toolbar and land on current page
- Viewport information (size, aspect ratio, orientation and user agent)
In Chrome, there is a default resize function, how to use it? Following:
1. In Chrome, click ‘F12’;
2. Click following button:
3. then click ‘overrides’:
4. You can change ‘user agent’ to test a website’sdesign:
There is also a default resize function in Firefox.
Click ‘Ctrl+Shift+M’ in Firefox, then you can see,
Choose which you want, you can test a website’s responsive design.
Hope it helps.