I don’t have to tell you that mobile traffic is taking over desktop traffic in a fast pace. Mainly because I already did. We have been talking about making sure your website is responsive and how Mobilegeddon is hurting websites. In this article, I’d like to talk about the practical side of optimizing your mobile content for devices with smaller screens, like mobile phones and e-readers.
Optimize design for smaller screens
You have to make sure that you are not just loading the desktop website on that small mobile screen. That just won’t fit and will require your readers to pinch and zoom. Make the best use possible of that mobile screen; use a responsive website. This means you’ll have to make sure that on pages that focus on content, the screen is filled with that content and nothing else. No distractions.
Optimizing mobile content
If your site’s mobile design is optimized for mobile devices, so should your mobile content be. Responsive design means you are serving the same website, the same mobile content as the content you are serving in a desktop browser. Does that change the entire ball game? No, it most certainly doesn’t. I actually don’t think you’ll need to change the way you write content. Writing content for online readers has to do with summarizing and preparing your text for scanning. Let’s go over a few common issues.
Headings
Headings have to be short and summarize the section or paragraph they are added to. Try to focus on the main subject, while trimming away all the extras. Especially for mobile content, long headings will appear aggressive. They will take up multiple text lines and push all the valuable paragraph text down. That is of course much less of an issue on your desktop site. Can we add numbers to that in terms of font size and number of lines? No, not really. It all depends on the font you have chosen for your headings, and even the color of the headings. You might want to tone your mobile content headings down a bit, if your desktop site has vibrant colors. That will already help a lot.
Introduction
Try to explain the main subject of the page or article right in the first section of your mobile content. As with desktop sites, scrolling isn’t bad at all on a mobile site. But leave it up to the visitor if he or she wants to scroll, and allow them to make that decision as soon as possible.
In the introduction of this post, I have also added some escapes (links): perhaps this post isn’t the one you were looking for, so feel free to visit some of the other articles we have written on the subject.
Prevent scrolling back
Marieke and I have been talking about reference words quite a bit over the last few weeks. I tend to refer to headings or the previous paragraph using sentences like “This means…” or “That could…” as the first sentence in a new paragraph. For the flow of reading, even more when it concerns mobile content, that isn’t what you want to do.
This means that a visitor isn’t able to scan your article. See what I did here? The first sentence of this paragraph should have been: “Don’t use reference words to refer to a word in another paragraph, as this will mean a visitor isn’t able to scan your article”. The first sentences of all your paragraphs combined, should summarize your article.
If the first sentences of your paragraphs summarize the article, your mobile visitor can easily scan the mobile content on his phone and understand your main point.
Conclusion
The final paragraph or section of your article has to contain a short summary and your main conclusion. That also means this isn’t the conclusion of this article yet, by the way. Your article has to have a head and a tail. You are managing expectations in the introduction (head) and you are sending the visitor home with your main conclusion about the subject at hand (tail).
My posts are usually about something you can do right after reading. I hope to shed some new lights on certain subjects, but most of all I try to motivate you to optimize your website with some common sense and a variety of tools I use myself. That’s usually the first paragraph of my conclusion. Besides that, I always ask for your opinion on things or ask you to go and optimize your website. I use the last paragraph of my conclusion for that.
On a mobile device, chances are you won’t get to that conclusion. A bus might arrive, or someone starts talking to you. You are distracted. That is why optimizing your mobile content, even more than for desktop content, requires you to keep all of the above in mind.
Optimize images
On a mobile phone, images usually take up most time to load. Make sure file sizes are as small as possible. Design for performance. A few years ago, we were all claiming that image size mattered less, as internet connections were getting faster. That still goes for desktop in my opinion, but you might want to reconsider this for mobile content. Matthew Young did an article on optimizing images for your mobile website, highlighting the three main issues:
- Use a page speed to tool to identify which images are the culprits.
- Compress your images.
- Define your image dimensions.
Drop the full article in your Evernote: The #1 Thing You Can Do to Improve Mobile UX: Image Optimization.
There is one extra step one could take to optimize these images: serve another image on your mobile website. You can do this by using the <picture>-tag and a media attribute. Or, if you are not a (front-end) developer, use the RICG Responsive Images plugin (WordPress) for that.
Actual conclusion
In this article, I tried to give you some hands-on advice on how to optimize your content for mobile readers. If you are serious about writing mobile content, there are a couple of things to consider:
- Use a clean design that focuses on your content.
- Optimize your text for scrolling, by using headings, adding a proper intro and optimizing the first sentences of every paragraph.
- Write a great conclusion, but keep in mind some mobile visitors won’t read it.
- No text without images, so optimize your images for faster loading.
I’d like to send you off with one last advice. In this article, I already mentioned that most tips apply to both desktop and mobile content. If you are serious about optimizing your (mobile) content for your visitor, please read our eBook on Content SEO. It will help you structure the way you think about your (mobile) content. And in the end, that will bring you the biggest wins!
Our Content SEO eBook is now on sale for only $15 (normally $19). So go and read it now!
This post first appeared as Optimizing your mobile content on Yoast. Whoopity Doo!