5 Bookmarklets to Test Responsive Layout

5 Bookmarklets to Test Responsive Layout


5 Bookmarklets to Test Responsive Layout

Introduction

Responsive design is a big bomb in web industry. If you are developing a responsive layout, the most common testing method to preview your website is to resize browser width to make sure everything appears alright in different dimensions. I always do that, and then eventually, I discovered these useful bookmarklets to test responsive layout. Most of these bookmarklets come with predefined dimensions of popular devices, hence, save the efforts and times to resize your browser manually.

Viewport Resizer

This bookmarklet is created by Malte Wassermann. I'm currently using this. You can add and customize sizes on the fly, also, it supports automatic device window orientation.

Resizer

Resizer allows you to quickly change the dimensions of a webpage to test responsive design. Available as a chrome extension!

RWD Bookmarklet

Another handy responsive design bookmarklet. But you can only test your size in two types of resolutions and different screen orientation.

Responsinator

The Responsinator helps website makers quickly get an indication of how their responsive site will look on the most popular devices. It does not precisely replicate how it will look, for accurate testing always test on the real devices.

ish

ish. is yet another viewport resizer. What’s with the name, you ask? Small-ish. Medium-ish. Large-ish. That’s the idea. Many have long been preaching to let content, not device widths determine breakpoints in responsive designs, so rather than determining several fixed breakpoints, ish. roughs out general ranges in order to better serve the entire resolution spectrum.

Author: Kevin Liew

Kevin Liew is a web designer and developer and keen on contributing to the web development industry. He loves frontend development and absolutely amazed by jQuery. Feel free to say hi to me, or follow @quenesswebblog on twitter.

Share the love

4 comments

greg
Tue, 18th December 2012
the link for ISH is wrong :( Reply
Kevin Liew Admin
Wed, 19th December 2012
oops, sorry. it's updated. Reply
Dave Brown
Thu, 14th March 2013
Thousands of search engine favelets/marklets on http://www.presearcher.com/marklets.asp that you can combine with others. Also, everytime you customize search on http://www.presearcher.com/marklets.asp you get a new bookmarklet generated. Reply
Nicole Windham - uGurus.com
Wed, 6th November 2013
Hi there, this is a great resource for the Responsive Design Knowledge Hub. Check it out here: http://goo.gl/1Nj8rx
Reply

Leave a Comment

Please keep in mind that comments are moderated and rel="nofollow" is in use. You can use [code][/code] if you want to write codes. Don't spam us :) Thanks!

Advertisement