Today’s web shows up on a tremendous variety of screens — desktops, televisions, tablets, phones and lately “phablets” (whatever those are). Testing your site on even a fraction of the devices available can seem like a full time job. Tools like Adobe Shadow simplify the process somewhat, refreshing your local site across devices with the click of a button. But Shadow has limitations, for instance, it only works with WebKit browsers.

If you’ve got a wide array of devices to test with you’ll probably want a local network solution — that is, serve your site over your local network and connect all your test devices to that virtual host domain.

Unfortunately setting up a local network and connecting to it can be a pain, which is where the curiously-named Xip.io comes in. Xip.io is a wildcard DNS service that makes it drop-dead simple to set up a network and connect any device to your local test site.

The service is really just a custom DNS server you can easily tap into. So, for example, if your LAN IP address is 10.0.0.1, using Xip.io, mysite.10.0.0.1.xip.io resolves to 10.0.0.1. With the DNS taken care of you can access virtualhosts on your local development server from any devices on your local network, zero configuration required.

Xip.io is a free service from 37signals, whose Sam Stephenson says, “we were tired of jumping through hoops to test our apps on other devices and decided to solve the problem once and for all.” Xip.io might not work for everyone, but if you’ve ever struggled and failed to set up and test sites on a local network, Xip.io might be able to help.

If you’ve embraced responsive web design — and we sincerely hope you have — you know that fluid layouts, helpful as they are, can be tricky. Combine them with @media queries to re-size and re-position elements on the fly and you’ll quickly find that testing your site is much more complex. Not only do you […]

If you’ve embraced responsive web design — and we sincerely hope you have — you know that fluid layouts, helpful as they are, can be tricky. Combine them with @media queries to re-size and re-position elements on the fly and you’ll quickly find that testing your site is much more complex. Not only do you need to test across browsers for rendering differences, now you need to test across screen sizes as well.

Unless you’ve got a giant horde of cash stashed under your desk, you probably don’t have every tablet and phone out there. Even if you did have every mobile device and screen size on the market, would you really want to test a website in every single one?

That would be incredibly inefficient when there’s nice web-based tools like Screenfly that can handle it all for you. Head over to Screenfly, plug in the URL you’d like to test and then start flipping through the various tablet and mobile device screen sizes to see how your @media queries are handling smaller screens.

Screenfly doesn’t account for rendering differences between devices (which should be minimal given that most mobile web browsers are based on the same WebKit rendering engine), but it does do a good job of showing you what your shiny new design looks like on the latest tablets.

There are of course other web-based tools out there that can help in similar ways, but we like Screenfly for its clean, simple interface and nicely done transitions. If you’ve got a favorite, drop a link in the comments and we’ll check it out. If you like Screenfly, you might want to keep an eye on Quirktools, the makers of Screenfly. The developers claim to have a wireframe app (no flash) and some other tools in the works.

]]>http://www.webmonkey.com/2011/07/screenfly-the-easy-way-to-test-responsive-web-designs/feed/0Browserling Puts Every Browser Inside Your Browserhttp://www.webmonkey.com/2010/11/browserling-puts-every-browser-inside-your-browser/
http://www.webmonkey.com/2010/11/browserling-puts-every-browser-inside-your-browser/#commentsWed, 24 Nov 2010 17:33:21 +0000Scott Gilbertsonhttp://www.webmonkey.com/?p=49203Developing a website that works well in all web browser isn’t easy, particularly if you’re using newer elements in HTML5. Even among modern, standards-compliant browsers, HTML5 support varies, and figuring out how and when to fall back on other solutions means a lot of cross-browser testing. Thanks to virtual machines, testing across web browsers has […]

Developing a website that works well in all web browser isn’t easy, particularly if you’re using newer elements in HTML5. Even among modern, standards-compliant browsers, HTML5 support varies, and figuring out how and when to fall back on other solutions means a lot of cross-browser testing.

Thanks to virtual machines, testing across web browsers has become much easier. But if you’re looking for an even easier way to see what you site looks like in, say, Internet Explorer 6, check out Browserling, a new cross-browser testing tool that embeds any another browser inside your browser.

Browserling relies on Amazon-hosted virtual machines to do the embedding. The result is a real-time, fully interactive look at your site in virtually any Windows web browser, (Yep, it only works in Windows). It’s a step up from other web-based browser tests which just offer screenshots of what your site looks like in other browsers.

Unfortunately, as cool as the concept is, Browserling has a few drawbacks. The worst part of the service is that, for now anyway, you’ll be waiting in the queue for some time. To keep resources under control, Browserling severely limits the number of users connecting to the service at any one time. You’re also limited to how long you can use Browserlings VMs — 90 seconds is all you’ll get without creating an account. If you sign up you’ll have five minutes, which gives you a better chance to check out your website, but is hardly enough time for real testing.

The site advertises paid plans, which promise to let you ditch the queue and time limits, but at the moment the paid option isn’t actually available.

Our other main gripe is that while Internet Explorer is well represented — you can test in versions 5.5 all the way up to IE9 Beta — older versions of other browsers are scarce. While it’s true IE is probably what most developers are interested in, it would be nice to see older versions of Firefox, Safari and Opera supported as well.

While it would be premature to delete your own virtual machines, Browserling has potential. If Browserling can work out the kinks — we experienced numerous errors, crashing VMs and other problems, but it’s probably just getting smothered by hugs — it may eventually help take some of the pain out of cross-browser testing.

Want to know if your website can stand up to a sudden, massive deluge of traffic? Sure, you could use some of the available tools like Flood, JMeter or The Ginder. But none of those options have bees with machine guns. The news applications team at the Chicago Tribune, has released a new tool it […]

Want to know if your website can stand up to a sudden, massive deluge of traffic? Sure, you could use some of the available tools like Flood, JMeter or The Ginder. But none of those options have bees with machine guns.

The news applications team at the Chicago Tribune, has released a new tool it calls Bees with Machine Guns that uses Amazon EC2 servers to launch what amounts to a distributed DoS attack against your site.

Now only is it an incredibly handy way to load test a website under arguably more realistic conditions than you’d get with other load testing tools, Bees with Machine Guns has awesome print statements that will turn your terminal session into a war zone.

Keep in mind that this is essentially a DoS attack. Launch it against a site that isn’t yours and very bad things will happen to you. But for testing your own site’s performance, Bees with Machine Guns is awesome — all you need is an EC2 account and the script.

Major bonus points if your site can fend off the bees with miniature pies: