Responsive and adaptive design has really caught on in the web design and development community, and there are a myriad of tools available on the web to help you test your site at multiple screen sizes. Recently, I’ve been looking for tools which can help me design for different screens more effectively, since I don’t have time to test on a million devices like Brad Frost. Here are three of the best: a native app, a bookmarklet, and a website.

Aptus

Aptus is a Mac App for testing your responsive, adaptive, or mobile site at custom screen sizes.

Using the app is easy. First, select the desired screen sizes and user agents of your ‘devices.’ Then load your site’s URL, and test it at those set breakpoints. You can also take screenshots of websites with the app, and it has the full WebKit inspector built-in.

Aptus is great for testing sites in a native environment, but there are a few problems with the app which have been pointed out in the App Store reviews. For some reason, Aptus doesn’t allow you to preview local files. Instead, you have to use a local hosting solution such as MAMP, and test your site that way. Also, you can’t paste a URL into the path bar, which makes the app useless compared to the bookmarklets available. For $2.99, Aptus isn’t a great buy, but if you prefer a native app, why not try it out?

RWD Bookmarklet by Victor Coulon

There are a few bookmarklets out there which allow you to test responsive designs, but this one by Victor Coulon is my favorite. It’s easy to view your design at iPad and iPhone sizes, in both landscape and portrait orientation, and there’s even a button to toggle the onscreen keyboard, so you can optimize your forms for iOS devices. The only issue I encountered while using this bookmarklet was the lack of custom screen size values. Hopefully that will be coming soon.

The Responsinator

This tool is a standalone website, which performs a simple task: display your site inside the frames of popular smartphones and tablets. It does its job well, and is quite useful to get a feel for what your site looks like if you don’t have multiple devices to test it on. Just enter a URL, and preview it on an iPhone, iPad, Kindle, and too many Android phones.

Conclusion

These are vital tools for testing responsive and adaptive designs on a computer, but it’s always good to test on real devices. Consider these three tools previews, similar to Quick Look on the Mac; they’re for looking at a design, not interacting with it.