Device Testing Best Practices
The best way to ensure that your mobile site works correctly on real devices is to test your mobile site directly on a device.
Here are our best practices for tests on various devices, device browsers, and device settings.
Preview on a Device Learn to test individual features or bug fixes during development. Work through our Preview a Local Adaptive.js Site on a Device.
System Test Once your build is ready for system testing, first Create a New Bundle . Then Preview a Bundle From Mobify Cloud on a Mobile Device.
Before you begin the test, check your Mobify tag to see what devices are supported.
Because iOS and Android cover the majority of the current mobile market, focus on the most popular devices of these manufacturers during your tests.
In your local computer's browser, go to your website.
Check that the "Page Source" on your browser to view the HTML source code of your site.
The Mobify tag is at the top of the
<!-- MOBIFY - DO NOT ALTER - PASTE IMMEDIATELY AFTER OPENING HEAD TAG --> ... <!-- END MOBIFY -->
The list of devices that are supported is located inside a regular expression
at the bottom of the Mobify tag. Typically, the regular expression will contain
the name of the device such as
Ask your Customer Success Manager or Developer Advocate if you are not sure which devices are supported on your site.
Typically smartphone builds support WebKit-based browsers only. The smartphones with these browsers include:
- iOS devices (iPod touch and iPhone)
- Android smartphones
- BlackBerry devices with WebKit
Adaptive.js also works on Firefox OS and Windows Phone 8+ if these are enabled in the Mobify tag.
Typically tablet builds support iPad.
Adaptive.js also works on Android and Amazon Kindle Fire if those devices are enabled in the Mobify tag.
Analytics show that most smartphone users browse the web with the default device browser. To simulate typical user behaviour, test on the operating system default browser:
- iOS: Safari
- < Android 4.3: stock browser
- >= Android 4.3: Chrome
Adaptive.js also works on Firefox and Internet Explorer Mobile 10+, if these are enabled in the Mobify tag.
Analytics show that most smartphone users browse the web in portrait mode. To simulate typical user behaviour, test primarily in portrait mode.
You can test that landscape mode does not have visual defects or functionality problems, however, leave user experience optimizations as a lower priority.
Networks and Connections
Networks are a major role in the performance of a site so testing on various carrier networks on various connections gives you a better idea of real-world performance.
Connect to a VPN for device tests to ensure that IP or location-based services perform correctly.
Services and Apps
Does your site have app, Facebook login, or Twitter integration?
Install the apps mentioned above with test accounts. Ensure that the integration is implemented correctly and that integration flow runs properly.
Ensure that services such as location for a store finder correctly report your location, or your distance to actual stores.
What happens if a user does not allow access to his or her location on your mobile site? The usability of the site should not be affected by the user choice.
Do you need more devices to test on? There are plenty of cloud-based device test services available. These services offer free access to a limited set of devices:
Operating System Versions
To find out which operating system versions your site visitors most commonly use, check your analytics.
A good rule of thumb is to test the latest version of the operating system, and then to include a test for the previous major version. For a more granular approach after those tests, test minor versions of each of the major releases of that operating system.
As of the most recent update of this document, Mobify tests focus on the following mobile opeating system versions:
- iOS: 7.0.x, 7.1.x and 8.x
- Android: 4.x