Visitor Monitoring Why EVERYONE needs to test on mobile | Keynote
Blog

Why EVERYONE needs to test on mobile

By Aaron Rudger | June 12, 2013

CATEGORIES: Mobile Quality

We're always looking for good examples of how most websites and applications can benefit from additional testing, especially from a mobile perspective. We decided to leverage the recent refresh of our own Test Center Developer website (the marketing website on the company website) to help demonstrate this point. The site was pushed live after thorough testing in FireFox, Internet Explorer and Chrome browsers.

The next step was a round of testing of the Test Center Developer marketing website in Test Center Developer - the actual product. We went through the pages on an iPad 4 & iPhone 5 and as we'll see, there were issues with rendering in the popular mobile browsers that didn't come up with popular desktop browsers. These are issues that a tester can work with the development team to fix.

However, the mobile browser also exposed a group of issues that need to be addressed by our design team. These design issues are viewable on desktop browser but were greatly magnified on the mobile screen. The good news is that using Test Center Developer (TCD) lets us quickly test, capture screenshots and share with our design and development partners.

Let's take a look at what we found and sent to our web partners.

Feedback to development team

We checked out an iPad 4 and navigated to the new TCD product page. The first thing we noticed is that the banner area doesn't fully extend out to the right:

1_iPad 4 with imcomplete banner

We then tried to play the video on the iPad 4 and found two issues. Firstly, the video didn't play. Secondly, the gray background did not extend completely to the right:

2_TCD Video

Then, to demonstrate to the development team that this was a site issue and not a problem with the iPad we captured a successful screenshot of our video playing in the DeviceAnywhere Free product:

3_Success with DA Free video

Next we went to our TCD Trial Request page and saw that the banner image and footer area were not loading properly:

4_Trial page

With this new site we've introduced a new section for our Test Case Manager tool. It's a great product feature, and the page looks great on a desktop browser. But for an iPad user it isn't displaying as expected and the video isn't working as well:

5_Test Case Manager iPad 4

Finally, we let our development team know that we need to address TCD rendering on the iPhone 5 as copy is bleeding out of the intended sections of the page:

7_ iPhone rendering issues

Feedback to design team

As noted before, viewing pages properly developed, within the limited confines of the mobile browser can help illuminate design issues that could be caught on the desktop browser. Here we see content is delivered all of the way to the edge of the screen:

1c_ TCD Spacing

The logo needs to be moved right:

8_Proper logo placement

and the banner content needs to be moved inward as seen below:

1a_TCD with Proper Spacing

The bottom line

Let's face it, anyone developing a website wants it to look good for all users, and that means mobile users as well. We're no exception and that's why we test. If you're not spending the time to test your site on real smartphones and tablets, there are things you may miss in your desktop QC process that your mobile visitors won't. And if you're still not convinced, try Test Center Developer for three hours, on us, and see what you can find.

Back to Top