Best Tools To Test Your Website’s Responsiveness
Since converting my game websites to be fully responsive and use HTML5 I’ve gone through a lot of different responsiveness testing tools. So far these are my favorites:
- Web Developer – addon for Firefox. This takes the cake for me because it’s already built into the right click menu on my browser so it’s really easy to invoke whenever and wherever. On top of that it’s designed to show you a number of different responsive views at one time and you can customize the views that it shows when it launches. Of course it comes with a whole host of other nifty tools to aid in your web development so it gets a raving 5 stars from me. It’s not as fully fleshed out in Chrome but there is a Chrome version as well. The only downside to this tool is that if you change something and you want to see an update of your changes you can’t just refresh the screen that pops up in a new tab. Instead you have to close the tab and launch the responsive view from the right click menu. Not a huge bother but it could be improved upon.
- http://quirktools.com/screenfly/ – simple, intuitive interface. Just enter your website and you’re well on your way for an easy experience to view your site on phones, tables and even televisions. The downside of this website is that you have to reload it every time you want to check what a different page of your website would look like.
- http://ipadpeek.com/ – the ipad and iphone emulator. It looks like an ipad and it does a pretty good job emulating an ipad and iphone — it will even show screen rotations. The only downside to this is that it doesn’t let you change version of the ipad because I believe the newest AIR 2 has a larger screen than the one in this emulator but I could be wrong.
- http://www.mobilephoneemulator.com/ – the multi-phone emulator. So this isn’t nearly as easy to use as the item in the number 2 spot which is why it’s bumped down a spot on my list even though it has a much wider array of phones you can test your site on including some of the popular android, htc and samsung phones. Just pick the make and model and enter your website and this site will render it to the proper screen size.
- http://ready.mobi/– last but not least. Although this doesn’t rank high in the visual department this is an excellent tool for evaluating what issues your markup may present to mobile users. Things like images exceeding certain file size and dimensions (which make for a slow mobile experience) and how your file sizes will impact your loading times are why this site makes my list. The downside is that it doesn’t visually show you what your responsive site will look like but it takes an analytical approach which is super helpful and informative regardless.
