Changing the user agent is a great way to test your website. Google just added this feature to their developer version of Chrome making it easy to see your site from different desktop and mobile browsers.
When you change the user agent, you will be able to view you a web page as if you were looking at it from a different browser. This will let you see how your page will react to different browsers without actually viewing your site from that device. If you are developing a mobile version of your site, you can make sure it looks and functions well on an iPad, Android running 2.3 or an iPhone.
How to change Chrome’s user agent
The first step is to make sure you have the latest developer version of Chrome. While the developer version may not always be ideal for daily use, there is a version you can run side-by-side with your everyday version of Chrome. This version is called Canary.
Once you have Canary downloaded and running, there are only a couple of steps to change Chrome’s user agent.
You will need to bring up the Developer Tools. Here are the keyboard shortcuts:
- Ctrl+Shift+I on Windows/Linux
- Command – Option – I on Mac OS X
You will see a 1/4 window open up at the bottom of the screen in Chrome Canary.
You will need to click on the settings gear in the bottom right corner of this window. This will be where you toggle on and off features of the Developer tools.
What you are looking for is the icon that says Override User Agent. When you check this box, you will see your User Agent options.
In the options you can see there are a lot of choices to choose from. The choices do not include browsers like Opera. Your best bet would be to try Other, or open up Opera and take a look at the site in question.
- IE 9
- IE 8
- IE 7
- Firefox 7 – Windows
- Firefox 7 – Mac
- Firefox 4 – Windows
- Firefox 4 – Mac
- iPhone – iOS 5
- iPhone – iOS 4
- iPad – iOS 5
- iPad – iOS 4
- Android 2.3 – Nexus S
Once you choose your User Agent, you can go to or refresh the web page and see how it looks in the browser you chose. Here are a couple of examples.
technorms.com – Windows IE 9
technorms.com -iPhone 5
Wikipedia.org – Android 2.3
Wikipedia.org – Firefox 7 – Mac
While the average Joe may not need a feature like this in their browser, it is ideal for web designers. For those of you venturing into making HTML 5 sites, you can easily find out how your site is going to behave on many of the major browsing platforms.