5 Ways to Fix your Mobile UX | Outbrain Blog

CONTENT MARKETING & DISCOVERY

Why Your Content’s Mobile Experience is Worse than You Think, and 5 Ways to Fix It

| Yuval Ben Itzhak

5 Ways to Fix your Mobile UX

Mobile is big, really big.

As the Chief Technology Officer at Outbrain, I’ve seen a powerful upward trend in traffic acquired from mobile devices over desktop for quite some time.

That means as readers and viewers are spending more time consuming content on mobile, an important question needs to be raised:

Have you checked the user experience of your content when accessed from mobile recently?

Facts for Testing Mobile

When opting to run a test on mobile…

I don’t just mean running a browser on your shiny desktop in mobile emulation mode, but instead, using a real mobile device to access the internet over 3G/LTE and Wi-Fi.

I also don’t mean accessing the content via a new iPhone or powerful Android device, as most readers cannot afford to consume content on such devices.

The average person, globally, won’t even have LTE (4G), meaning Internet connection will probably break from time-to-time while they are accessing content.

You may even be functioning under the impression that Chrome and Safari desktop browsers perform the same as they would on mobile.

But, think again.

The average mobile device isn’t as powerful as your desktop in terms of processors and memory. Additionally, network connectivity isn’t as stable or reliable as Wi-Fi or LAN at, say, the office.

To reiterate, user experience on mobile is very different from desktop.

With all of that in mind, here are 5 ways to ensure your content is well served on mobile:

1. The Size of Your Files Matters

When we create content for desktop, we often don’t consider the size of the images or files we upload to the content.

But, for mobile, size matters.

Mainly because (as mentioned above) internet connectivity isn’t as stable and the data bandwidth isn’t as wide, so images need to be compressed.

In the US, a 3G mobile line translates into a 2Mbps download speed, with a 4G line download speed coming in at an average of 6Mbps. The penetration of 4G in the US market is still in its infancy, and mainly within the heart of big cities.

Therefore, the average size of a single 500KB image would take two seconds to download on a 3G line. If you had an average sized web page of 2MB, you’d then be looking at around eight seconds for a complete page load. That’s assuming, of course, the connection doesn’t break as the reader walks, commutes on the train, or simply enters a new location.

Google reports they are seeing a 58% drop-off for pages that take 10 seconds to load.

Simple, free tools like TinyPNG.com can reduce the size of image files by 60-70% with no notable degradation on quality.

TinyPNG

2. Reduce The Number of 3rd Party Scripts & Redirects to Your Landing Pages

When you create content for desktop, you add 3rd party scripts to do things like measure user engagement, improve appearance, or even to run A/B tests.

I’ve also seen cases where people use a few redirect URLs instead of making their landing page accessible directly. These redirects add latency to page load time and increases the risk of a connection break on mobile – as each redirect requires a new connection.

Over time, more and more scripts are added, and in some cases, I’ve found over 10 analytics services running on the same page, in addition to others.

This is definitely not the way to approach mobile.

As each of these 3rd party scripts load more files, you will end up with dozens, or even hundreds of requests going out of the mobile browser to load scripts that you have no control over in terms of size.

Remember, the mobile browser is not as powerful as desktop, so processing or rendering too many files will slow down the experience.

You should review the number of files included on a page by either using your browser developer tools or with a 3rd party add-on like Ghostery.com which will help discover them for you.

Ghostery_Outbrain

3. Content Load Time Makes an Impact

Mobile users have less time to wait for your content and will switch to another article, app, or experience if yours does not appear quickly enough for them to consume.

In fact, Kissmetrics reported that most people would only wait 6-10 seconds before abandoning a page.

As the common page loads, 3rd party scripts fire first and mobile devices may not complete the rendering of the page, leaving audiences with blank or partially loaded content, detracting from the user’s experience.

That’s why it’s important to structure your HTML to load critical, above-the-fold content first.

4. First Comes First, Not Always True for mobile

If your web content includes a lot of Javascript files, they will probably load one after the other at the same rate.

This doesn’t greatly phase desktop users but can impact mobile user experience very much.

To minimize the impact, it’s recommended to have Javascript load in an asynchronous fashion, meaning, upon receipt of indication that the proceeding operation has been completed.

You can do this by adding the async attribute to external scripts where missing (you probably have it on a few already):

<script async src=”my.js”>

Async_Outbrain

5. Measuring is Your Best Friend

No matter how much you try to optimize, you must measure your output and check how your content appears on mobile devices in order to capitalize on performance.

There are a few free services that can help you with this task:

Google PageSpeed Insights

PageSpeed Insights analyzes the content of a web page, then generates suggestions to make that page faster.

Akamai Mobitest

Akamai Mobitest is a free tool created to raise awareness to Mobile Web Performance.

Simply enter a URL, choose one of the device/location options above, and hit run. Your page will be loaded on a real mobile device, and you’ll receive rich
detail about how long it took to load, including waterfall charts and video recording of the page load.

Pingdom Monitoring Tools

Pingdom offers cost-effective and reliable server, network and website monitoring. The service includes statistics for uptime and response time, and can send out alerts via SMS, email, and more.

To Conclude

The rise of mobile usage in content consumption has been a rapid one.

While many continue to sideline its importance within their overall content strategy, those who embrace the new opportunities presented by such technological impact will reap massive benefits for their business in greater user experience and brand affinity.

I hope these tips will help you along the way.

Do you have a mobile content strategy? How has it affected the way you create content and have you used any of these (or similar) tools to increase performance? Share your stories in the comments section below.  

Hitting "Publish" is only The Beginning!

Download our free A-Z Guide to Brand Publishing to find out how to make the most of your content strategy.

Yuval Ben Itzhak

Yuval Ben Itzhak

Yuval is Chief Technology Officer at Outbrain. Yuval comes to Outbrain with more than 20 years of experience as an... Read more

Add A Comment

* Your email address will not be published. All fields are required.

  • Randy Tinfow| April 5, 2016 at 8:08AM

    For those of us that deliver content to Latin America, it’s follow these practices and other bandwidth reducing schemes or be irrelevant. Cheap Android phones are the platform for more than 80% of views. Bandwidth is scarce and very costly. Should we saddle these users with 3MBs of ads per page, when bandwidth costs approach 5% of personal income?

    In these areas adaptive bitrate (ABR) video with data rates as low as 210k is essential. We also recommend low bandwidth SVGs and Google fonts, to deliver responsive content that is lightweight and scales perfectly to the large variety of mobile screen sizes.

    As for ads and trackers, it’s becoming ridiculous. The AdTech world’s appetite for more and more overlapping data collection is noxious. We are far over the boundary of user abuse when pages that are 25% content and 75% ad related. It should not surprise that the ad-blocking phenomenon is growing, not subsiding.

Loading

Want to promote your content?