As of 2015, approximately 60 percent of all website traffic comes from mobile devices, so your organization’s mobile website is now the priority instead of an afterthought. Therefore, it falls on both the content creators and web designers to insure that mobile viewers have a satisfactory content consumption experience. It’s a best practice to keep a “mobile-first” mentality when creating web content, ensuring that all content both functions and looks good on smaller screen devices. Writers that work with a content marketing service need to pay attention to mobile-friendly formatting practices because their content can appear on a wide range of websites that all feature different display styles.
Image size issues
All too often site visitors come across large images and infographics that are just too big to function on a mobile device, resulting in a pinch-and-zoom multi-directional scrolling fiasco. Unless the image is too small to do so, it should be expanded across the width of the screen to appear as large as possible. Maximizing the image to use as much screen real estate as possible works well with the smaller screen, making content easy to read. Infographics work better on mobile devices when designed with a slimmer width: the text needs to be legible without zooming for the best experience.
Images should be as small as possible without compromising picture quality because shrinking images on the page while loading larger image wastes bandwidth and causes longer load times. Web developers should calculate the maximum image size for a spot and limit all images to those dimensions. If you’re supplying images within your content, you may want to avoid using that four megapixel PNG photo graph and replace it with a 720 pixel wide JPG. The JPG format is much more load-time friendly than the PNG format while offering acceptable image quality.
Text Spacing Issues
Mobile device users are not turned-off by long-form content: if the content is compelling they will consume it even on a smaller screen. However, they’ll only stick around if the content reading experience is comfortable, so difficult to read text can cause site visitors to leave.
Text takes up much more vertical space on the smaller mobile device screens than on larger desktop screens, so longer form paragraphs can extend for several screen lengths and create a bad viewing experience. This creates a situation where there’s not a solid visual break in between text which can be problematic when people look away from the screen for a moment and lose their spot. The problem can’t be resolved through programming, so it’s a good practice for the writer to avoid longer paragraphs. Writers don’t need to go as short as with the two-sentence newspaper style, but paragraphs with more than four sentences can be an issue.
Leading space between paragraphs is also extremely important on the mobile web. If there’s not enough space between text blocks, the text will turn into a difficult to read blob. Web designers should keep in mind that the audience expects to scroll down to consume content on a mobile device, so splitting up text with adequate paragraph spacing creates a better user experience than paginating content. Additionally, inline text links can be difficult for mobile users to select if the text is too confined.
From a web design perspective, a line break tag doesn’t separate text sufficiently between paragraphs. WYSIWIG editors usually will handle the spacing issues for you, but straight text inputs will not. So if you’re using a CMS that takes straight text, you’ll likely need to double space between paragraphs to get them to format correctly on the page. Section headers and blow-up quotes also work well for breaking up text on the page.
Make Sure It Works
Mobile users should be able to experience the same content as desktop computer users: if you’re embedding or linking to pre-made content, make sure it works well on mobile devices. Some content, in particular Flash content, will not work on Android and iOS devices so don’t bother including it as 60 percent of your audience can’t see it. Some content will work on mobile devices but display poorly because the host website is not designed to work on mobile devices. In some cases the desktop-only sites may be your only source for content, but if you’re choosing between two possible links that feature similar content you should always go with the one that’s mobile-friendly.
Dan S is a former news journalist turned web developer and freelance writer. He has a penchant for all things tech and believes the person using the machine is the most important element.
