This post was most recently updated on September 6th, 2019
Going mobile-responsive is almost a regular expectation from websites these days. If your site is not mobile-responsive, you are already certain of losing around 21% or more of regular users. Some users these days no longer use laptops or desktops and turn to smartphones and tablets for their web browsing needs. As such, the importance of going mobile-responsive can never be underscored for monetizing your business more towards higher marketing success.
How to become mobile-responsive
The very first thing you need to do with your existing website is to make a full assessment of how to make it mobile-responsive. The Twitter Bootstrap project, for example, is a quick grid-based CSS system that will allow you to quickly convert most non-mobile-responsive websites into a mobile-responsive and fluid one. However, you can still do it manually through CSS and have the benefit of greater flexibility.
If you are hard coding your site, the first step is to remove all the classes that set a fixed width on the elements of your website. If you are using CMS like Wordpress, Drupal, or Magento, you can take advantage of built-in themes that are already mobile-responsive. Depending on the framework that you are using, you need to edit the templates to suit your needs.
The next step is to test ad placement and a basic responsive layout for functioning after you make the changes. Test it in a variety of devices and have a good feedback system to allow users to tell you if the design is not working well on their end. You need to test at different times of day to make sure that you are able to cover all your bases before finalizing your design.
Related Read: How to make Publishers Ready as Mobile Ad Spending Surpasses Desktop
Tips on designing a responsive site
- Use Google’s Mobile-Friendly Test Tool to test your pages.
- Make sure that page load does not suffer in your efforts to go mobile-responsive. You can utilize PageSpeed Insights to check issues you may have on mobile.
- Participate in Google’s Accelerated Mobile Pages Project to get you started on creating a basic mobile-responsive AMP HTML page.
- If your site does not have highly customized functions, go for responsive CMS themes from Wordpress, Drupal, Magento, or even Squarespace.
Read: Google AMP Project Launch: What’s in it for Publishers?
Case study: DesignSponge
DesignSponge.com, a premium publisher of ours, redesigned into a mobile-responsive site and made use of mobile and desktop ad integration. As a result of this, they gained a 30%+ increase in their ad revenues.
1) Implement recommended fixes from PageSpeed Insights for mobile.
2) Monitor your mobile traffic from Google Analytics.
Go to Audience > Mobile > Overview.
For more lessons on Mobile Ad Optimization,
subscribe to this FREE email course.
Kean Graham is the CEO and founder of MonetizeMore & a pioneer in the Adtech Industry. He is the resident expert in Ad Optimization, covering areas like Adsense Optimization,GAM Management, and third-party ad network partnerships. Kean believes in the supremacy of direct publisher deals and holistic optimization as keys to effective and consistent ad revenue increases.