Today, it’s not enough to have a website display well on desktop browsers alone. You have to be able to show your website to millions of users that browse with a mobile phone or a tablet. In order to see if the website displays well in all those devices, there are certain tools available.
1. Adobe Device Central
Adobe Device Central debuted with the Creative Suite version 3. This application runs from your desktop and allows you to test a lot of mobile devices to see the compatibility of your website on them. Device Central provides a huge list of mobile devices offered for testing that can be updated online.
It automatically communicates with the server to update the list of devices. Different versions of each phone or tablet are also available. After displaying the webpage, it will tell you what sort of errors it was able to detect on it. This is a great way to test a website on a number of mobile devices and find the most recurring issues. With Creative Suite 6, Adobe is discontinuing Device Central, though.
MobiReady is an online testing tool that gives you an overall score for your website on a mobile phone based on various factors. It checks for speed, HTML code errors, character encoding, HTTP response headers, etc. Also, you can see the preview of your website on a few old handsets—Nokia N70, Samsung Z105, Motorola v3i, etc.
iPhoney is an open source application that helps you visualize your website on Apple iPhone. This is not a simulator for any version of iPhone. Instead, it will give you a platform to test how your website will look on it. The resolution supported is 320x480.
4. iPad Peek
iPad Peek gives you a view of how a website looks on Apple iPad. The web page has a big iPad screen on it in which the website you are testing loads. It is not known if the rendering is accurate or just uses the browser in which iPad Peek has been loaded. However, the developers recommend you use the web browsers like Firefox 4 or later, Google Chrome 5 or later, Opera 10.5 or later.
Gomez is a web based testing tool just like MobiReady. It tests a website based on over 30 different factors to rate it between 1 and 5. In order to get results, however, you have to register with the service with your email address and other details. The report about your website is then sent to your email. The report is straightforward with recommendations as to how to develop the website better.
6. Changing User Agent on Chrome or Firefox
You can also test your website through your browser. Every web browser identifies to the website through a string known as user agent. The user agent string contains the browser version, operating system version, location specific data, plugin data, etc. You can use add-ons to change the user agent string on your browser to the user agent string of a mobile device. The web page will then render on your desktop browser how it will on that mobile device.
On Chrome and Firefox, you have an add-on called User Agent Switcher that you can use for this purpose.
|Viewing Google website with iPhone user agent through Google Chrome on a laptop|
Testing a website on a mobile platform is very important for the next web. People are on the move and almost all of them are using mobile phones to access the Internet. In such a world, you do need your website to look good. Use one of these testing tools to make sure your website mobile version looks awesome.