Testing Mobile Sites On Your Desktop

Testing Mobile Sites On Your Desktop

As you design mobile sites, there are a variety of methods you can use to test the site to see if it looks and behaves as you intend it to on  mobile device. One method is using a standard desktop browser, such as Safari or Firefox tools to “impersonate” a mobile browser. Simply by selecting a mobile device to simulate then loading the web page, the browser will display the page content in much the same way the the mobile device would.

Safari works well but is somewhat limited, you cannot add mobile devices to simulate…you’re stuck with what Apple gives you. To enable Safari to simulate mobile sites, follow these steps:

  1. Select Safari > Preferences
  2. In the Advanced panel, select Show Develop menu in menu bar, note that there is now a Develop menu in Safari
  3. In Safari, open the website you want to simulate on a mobile phone, then select Develop > User Agent, then select a mobile device to simulate

Not to be left out, Firefox comes with a few device simulators, called user agents. To enable Firefox to simulate mobile sites, follow these steps:

  1. Select Tools > Add-ons
  2. In the Get Add-ons panel, search for User Agent Switcher
  3. In Firefox, open the website you want to simulate on a mobile phone, then select Tools > Default User Agent, then select a mobile device to simulate

Additionally, you can download and install many more user agents not included with the base installation for Firefox by following these steps:

  1. After you install the User Agent Switcher as outline above, download and unzip the useragentswitcher.xml file.
  2. In FireFox, select Tools > Default User Agent > User Agent Switcher > Options
  3. Click Import
  4. Navigate to the useragentswitcher.xml file, click to select, then click Open
  5. In Firefox, open the website you want to simulate on a mobile phone, then select Tools > Default User Agent, then select a mobile device to simulate
By WSPA

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*