How To Tweak Content for Mobile Display

Statistically, more than 75% of the world’s population will access content using their mobile phones. This means it’s even more important we create content that is optimized for mobile, and or smart phones. I look at it this way; if we don’t optimize our content for mobile phones, then we can be losing 75% of the engagement from our audience. Keep in mind, your competitors will be making sure they are fully compatible because they understand how even 1% can make a huge difference on your bottom-line. As a blogger, it’s important going forward you keep in mind that your audience will be doing much of their readers on mobile phone too. Recently, I’ve been working with several clients helping them convert their content to mobile friend. As a matter of fact, this is why I’ve decided to write on this topic. Next,

Creating mobile optimized content will allow you to tap into a larger audience going forward. Smart phones are something which will always be around, and even improve in a few years. This is why when you create mobile-optimized content, you are increasing the engagement on each piece on content published. Let’s get started, and look at some ways to optimize your content for mobile compatibility.

Avoid Pop-ups

Email marketing is huge, and many people these days are using different types of forms to capture addresses from their readers. However, you have to be very careful when implementing email forms, especially, with a pop-up style theme. I’ve done a lot of testing over the years, and found some of them have NOT been tweaked for mobiles. This means when someone is browsing using their mobile phone, the pop-up will interfere with the overall experience. Here’s another problem I noticed when working to optimize my client’s website. They had built their website on WordPress, and were using incompatible plugins. For example,

WordPress has transformed the way people can make money online. They have allowed their plugin interface to be open-source which means anyone can create a plugin, use API to connect to awesome tools, and charge a monthly price to make money. However, many people who are just starting out don’t like paying monthly so will download crappy plugins to collect email subscribers through pop-up forms. The problem is these crappy plugins, because of a low budget, will NOT optimize their tool to work on mobile phones, and this is where the problem happens. Due to a lack of updating you’ll have a pop-up display which on mobile requires scrolling or even squeezes the entire page.

What can you do to protect yourself going forward?

  • Always test the application or plugin once it’s been installed on your website
  • Read the fine print or features on the plugin page before installation. I’ve noticed when you visit the website, they’ll tell you if the plugin is set for mobile compatibility.
  • DON’T use a plugin. For example, I make sure everything I use to build, and display my forms come from aWeber.com. They are reputable and are always up-to-date with their interface or trends.

Next,

If we are trying to optimize our content, then we don’t want pop-ups showing while we read, right? I’ll discuss this a bit further later on, but make sure if they are displayed they are done correctly so they serve a purpose. At the same time, you want them to be controlled easily so the reader can quickly close them WITHOUT any interference.

Make Things Easy to Close

This is going to be quick, and it is related to pop-ups to improve user engagement on content. If you do have pop-ups in place to open to collect user information, then it’s important they are set to close WITHOUT any problems. Some of the crappy plugins not customized for mobile will be tedious to close. I’ll tell you from experience; the harder to close, the more it will hurt your brand. I’ve left enormous website just because I couldn’t find the information I needed, and when I did the accessibility was very hard.

Make sure if pop-up has been added to website, you provide an easy way for reader to close box so they can view your content.

Use Percentages When Displaying Content

This is something I caught onto at a later time, however I wish I knew this sooner. Once the monitor displays started to change, and the resolution went up I started to see a shift in the way developers programmed their width. For example, at one point I would always configure my width using PX, however now you’ll notice people are talking about percentage more. This was one of the smartest changes I ever made for my websites when designing. By stating width in %, I was able to ensure no matter what screen resolution or size used by the reader to view my content, it would content would adjust accordingly. For example, having a width of 100% means adjust to that percentage no matter what screen size they are using. It was a simple fix to a common problem. Next,

Whenever, you publish content it’s important the display screen will show content on mobile phones by percentage. This will ensure no matter what type of display or size, the content will be customized for that screen size making it easier for your audience to engage.

The cool thing is many people are using WordPress to create content, and their themes have already been customized to make this change. If you know a little bit about .CSS, and are using an older theme, then head into the page width setting it to 100%.

Remove The Distractions

On mobile, the display is thin and it’s important you save as much room for your content. This is why I’m huge at making sure you remove as many distractions as possible. For example, on mobile your focus should be to provide only content to your readers. Why? The screen is limited in size, and it’s important you give your audience exactly what they came looking for. I’ve noticed whenever I’m displaying content for my readers on mobile, the sidebar can get in the way or it gets pushed to the bottom. If it’s towards the bottom, then it’s not too much of a problem, but it can be an unwanted distraction. Thank about it this way:

If you are using your content to convert people, then it’s important you have them only focus on your content. Remove banners, sidebars or anything else which will move the audience away from your bottom line.

Go through each potential page, and ask yourself what are the main pages responsible for your bottom line. These pages are important to engage your readers, and will be used to convert them. After, you should test these pages on a smart or mobile phone making sure they are displayed correctly. In the end, if you see unnecessary distractions, then it’s important to remove them. This will help improve user engagement which will ultimately help your bottom line.

Accelerated Mobile Pages

This is something which has just come into existing because of the dominance of the mobile world. AMP is a script which increases the rate or speed at which your website loads on mobile phones. It automatically loads the most important elements of your website avoiding anything which will lower time. This is especially important ever since the mobile update, and the emphasis Google places on load time to rank websites. With that said, it’s important you have a solid system in place to ensure this script can be implemented without any issue. There are two ways which this can be done:

First, if you don’t own a WordPress site, then here’s a tutorial to help you get started. Much of the work has to be done through manual programming. Check out the AMP tutorial now. Next,

If you own a WordPress site, the process is very easy because it can be done with the click of a mouse button. That’s right, all you have to do is install a simple plugin which adds the required script. Keep in mind another thing, Google does support these types of websites, however they are NOT support openly or widely.

Final Thoughts

Mobile browsing is becoming huge, and it’s important your websites are completely optimized for the change. However, many bloggers I know still fail to think about the impact NOT having a mobile site can have on your bottom line. With that said, it’s important you do the following to ensure you stay ahead of the trend. Let’s briefly look over the following factors that you can apply almost immediately.

First, always start by avoiding pop-ups because they can get very distracting for mobile users. They are using their phones to view your content which means they want NO distractions. If they cannot get rid of pop-up boxes easily, then they’ll leave without reading the rest of you content, and you’ll lose a conversion. Next,

If you are going to have pop-ups make sure they provide added, and relevant value. They should also be very easy to close. Secondly, width should be measured in percentage because this will adapt to any screen size used by the mobile user. This is also great for people who are using other devices to view your content. It’s time to switch from “px” to “%” for better viewing. Next,

The last two are important, but NOT as much as the others. Remove distractions like sidebars, and banners because space is already limited. You can also install AMP which will help load your mobile pages much faster, but keep in mind this can be a very tough process for anyone NOT using WordPress. You’ll have to code, and add HTML to implement AMP. For those using WordPress, it’s as easy as installing a plugin through your website backend.

Get started now, and implement those changes going forward to engage users who are browsing using mobile devices.