February 19, 2018

Chrome Window Resizer

Chrome's Window Resizer gives you more control of your Chrome Browser

Window Resizer is a great tool to test a website functionality in various browser widths. Basically to test a website responsive design.

Widow Resizer also has the ability to show the current browser size - via a hotkey. This makes it easier for QA to identify a problem on the page using a particular resolution.

Window Resizer Extension

Developer Description

This extension re-sizes the browser's window in order to emulate various resolutions. It is particularly useful for web designers and developers by helping them test their layouts on different browser resolutions.

The resolutions list is completely customizable (add/delete/re-order). You can set the window's width/height, window's position, preset icon (phone, tablet, laptop, desktop) and even the option to apply the new dimensions to the entire window or just to the viewport.

Tips and Tricks

Various things I have learned using Window Resizer:

  • It's useful to change the tooltip timeout from 3000 ms to 5000 ms, that way it will stay long enough for screenshots. (You can change this under Settings -> Tooltip.)
  • In the Setting you can change the layout presets. Remove items that you never plan to use. That way it doesn't clutter the Window Resizer menu.
  • There are four very useful tooltips to remember, see the above for the most commonly used shortcuts that are worth remembering.
  • You don't need to have the Window Resizer Extention appear in the Chrome Extention viewer. Simply right click on the icon, and select 'Hide from Chrome..' and you can still access the features via tooltip.

Comments

Add your Comments

Feel free to leave a comment about this post.

- Feel Free to add HTML to your comment!