Your website stinks on mobile...

You should stop being such a lazy-assed developer.

There's just too many devices out there to just test on your resizable desktop browser for any excuse not to test on at least the device(s) you own.

Almost everyday I visit a new site or a redesign that effectively breaks in some fashion on my iPhone (other phones are available and yes I have some of those too).

You see, no matter how it looks on your desktop browser. When viewing it on a mobile device it can break. It could be a really long url in a blog post comment, it could be the <code> in your latest blogpost or it could be that new demo video that's breaking out of the devices viewport. All of which, I feel, makes your lovely collection of pixels tarred with a smack of laziness.

You should be testing on the device(s) you're developing your site for. It's 2012, you've got to step up your game. Mobile is getting big so test on what you have or can beg, borrow but not steal. If you don't you're being incredulouos to your craft and this profession.

A back story.

When I saw these issues on my iPhone, I used to tweet the sites creator and try and explain what's broken as succinctly as a I could. Sometimes this was greatly appreciated, mostly it 'fell on deaf ears'. So after months of slowly getting 'less interested' in trying to help I've generally stopped. It's not my problem that you've been lazy in the development of the site not to test it on (at least one of) the devices you're expecting it to work on.

Take your head out of your ass and test your site on all the things.

What can be done.

Well, luckily there's many things you can do to start and, I repeat, you should. I'm sure you've got an internet enabled device. You might even be reading this post on your iPhone or 'droid. So why aren't you testing every aspect of your site on it, thinking of every eventaullity that could break it?

You may only have one phone, but you should really consider getting more. There are a couple of posts on which devices you should consider choosing and I've got a little tumblog on other peoples test suites so you can get an idea of what other developers are using. 

Buy Devices.

You need more than one device. I'd at least recommend getting an iOS device and a 'droid. You don't need an iPhone and you don't need it all to be new. A 2nd hand iPod Touch would work just as well. For your Android device, there's plenty to choose, plenty of ever differing operating systems also. Going with some recent platform version statistics I'd go with Android 2.3.3. A quick note is to not purchase a 'droid that uses GetJar as it's app marketplace. Invariably you can't download any other browsers.

Install those browsers.

For iOS you'll get mobile Safari but also download Opera mini. For Android you've a plethora of choice. It comes with it's own 'Browser' but you should install Opera mini, Opera Mobile, Dolphin HD and Dolphin mini. If you have or purhcase a 'qualifying' device you could and should also install Firefox for mobile.

Hiding in the shadows.

Recently launched Adobe Shadow allows you to test, inspect and preview your desgins on your iOs or Android device. It allows you to edit on your laptop/desktop and see what's being rendered on your device. Which in turn will make your development that little bit quicker and will help iron out the creases of your design you've previoulsy just tested on a resizable browser.

Emulates.

Another recently launched product is Opera Softwares Opera Mini Emulator which allows you to view how your site could look on several devices. You can pair this up with Opera's Dragonfly to edit the code too (a video demo of Dragonfly from Patrick).

If you haven't got an iOS device and can't afford to purchase a iPod Touch you could try the emulator that comes with Xcode as well. Here's a nice little how too on getting it set up.

Blackberries.

Well they're getting cheaper to buy 2nd hand or you could use the emulator but you should really think about them in your designs. For example, there v5.0 browser (found on the populat 8520) doesn't suppoer CSS3 media queries very well. So your responsive design could look pretty crappy.

You have to touch it.

As well as what your site 'looks like' on a mobile device, without testing on them you won't know how 'they feel'. Your finger or thumb is not a mouse cursor. Your sites visitors precision will be off. Your site might be easily accessible by touch but it could be a pain in the frickin' ass when using a thumbwheel. 

If you must.

If you find yourself only resorting to using Chrome or even just for quick things then Paul Mist showed me this little bit of JavaScript that you can save as a bookmark to create a 'iPhone sized' browser window to test in.

Do as much as you can and at least do something.

Going back to basics. Just please, test your sites design on whatever you have to hand and not just on your browser of choice.