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.
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.
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
This doesn’t greatly phase desktop users but can impact mobile user experience very much.
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”>
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 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.
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.