Monetising a website is an essential aspect of many online businesses, and an integral component of this is often advertising. While online ads can be annoying, they may also be the basis for the ongoing provision of quality content from outside a paywall. So if we accept that appropriate, responsible and respectful advertising is an acceptable exchange, we might be more forgiving of a few ads nestled between content.
A common problem for website authors and web admins is that even if Ads are relevant and often benefit users with timely value-added offers, increasingly sophisticated Ad Blockers like AdBlock Plus, AdBlock, or browsers filter the ads out. The reasons behind this are both varied and complex but at least in part relate to code and content structure.
Avoiding Ad Blocks in Website Code
The code of a website is a fundamental identifier of overt online advertising, whether in the form of inline ads, interstitials, popups, timed ads, gamified ads or any other creative advertising form. Ad Blockers skim code, so we, therefore, need to write clean code that is 'ad free'. This 'ad'-free code should be taken literally by coders, and in all instances, classes and ids should exclude advertising related words like 'ad', 'advertisement', 'offer' etc. so for example, don't use '#adBlock1' as an Id or '.advertisements' as a Class. While this may seem obvious when coding a website, we often go to the most familiar form in our mark-up (#thisIsWhatMyDivRelatesTo), and it's easy to trip up at this initial step. To avoid such mistakes and have legitimate ads wiped from existence, it is good practice to exclude words listed in Easylist in your code.
Classes & IDs to Avoid for Ad Blockers when Creating Ad Blocks on your Website
Don't use classes and ids in your code included in EasyList if you want your Ads to show successfully on your website.
- The EasyList filter lists are sets of rules originally designed for Adblock (adblock.mozdev.org on WayBackMachine (archive.org)) that automatically remove unwanted content from the internet, including annoying adverts, bothersome banners and troublesome tracking.
Our research shows that ads not showing within a website will often immediately reappear if classes and ids avoid any such words and combinations of ad blocker stop words. This adblocking release includes mobile browsers such as Samsung mobile, incorporating an efficient ad-blocking component.
Content layouts to avoid when distributing responsible website ads
Neat intuitive layouts and structures are vital components of good UI/UX, and while these rules still apply to Ad blocks, what is required is flexibility on placement. Indeed, predictable and repetitive ad layouts will make the Ad Blockers job relatively easy. If an Ad consistently appears in the same position on a website, then this can be learned and filtered out by machines and humans alike. Typically ads sit in the header, footer and left and right sidebars with the content in the main body area but switching this up with advertisements that change position will disrupt this predictable formula. One approach is to use code, like jQuery, to place an Ad-block within a target zone randomly, and one way to achieve this is with the following code:-
The jQuery code takes the Ad Block div and moves it between a target, which is 'p' paragraphs, typically within the main content block. This targeting means that as the user reads down, the page presents them with a randomly positioned ad. This randomising ad position on page refresh approach is demonstrated in this blog post in the main content and the sidebar while maintaining the flow and readability of the content.
Be an intelligent and responsible advertiser
Regardless of whether your Ad ultimately shows, the goal of the responsible online advertiser is to offer something of value to the user. In the first instance, this means clearly understanding your users. Advertisements are nothing new, and within a tv advertising context, Ads are placed carefully within breaks where there is a match with the program's followers. It makes sense that a program about baking breaks with adverts about food and food creativity. That's a good exchange for the engaged audience and is less likely to be channel hopped during the interval, so more eyes on the ad. This common-sensical formula, of course, translates directly to the website medium across devices and is the basis of intelligent advertising.
- Keep ads relevant - give your audience something likely to interest them and offer value. Ads that provide a benefit, like a tool that streamlines a process outlined in a post, is a win-win scenario.
- Avoid intrusive ads- avoid advertising mediums that are 'in your face' or annoying. Therefore use popups (incorporating a close button) sparingly and avoid interruption marketing like interstitials that place an additional step between the user and content.
- Label ads as ads - Don't try to trick your audience; if it's an ad block, mark it as an 'Ad', 'Advertisement' etc.
It's also worth bearing in mind that AdBlock Plus research shows that eighty-three per cent (83%) of their users don't mind seeing 'Acceptable Ads' as they don't ruin their browsing experience. So if you adopt an intelligent advertising approach that offers a benefit, you shouldn't beat yourself up too much about a level of additional flexibility.
Is it possible to comply with all Acceptable Ads Criteria?
It is possible to comply with 'Acceptable Ads Criteria', but as we have discussed, there is a delicate balance between being rigid with the rules and providing the space to monetise ads successfully. For example, specific AdBlockPlus standards outline a stringent set of regulations regarding ad placement, ad distinction, ad size, and other specific criteria. For instance, in 'primary content', the maximum ad height is only 200px, negating a wide range of modern responsive design considerations. For example, an Ad image with an initial height of 200px in desktop mode will proportionally scale down on mobile to the point that it may be illegible. You can get around this by serving up different images at different breakpoints or continually showing content centrally and crop at 200px. Still, on the whole, this is not a good use of time as the primary focus is content. Indeed it's far better to create responsive mixed content text, image and video ads not limited by height and width constraints. These feel more naturally in tune with the flow of the content and a sympathetic part of the web page. That has got to be a good thing.
Should I follow all Ad Blocker rules?
The short answer is not if you want all your ads to show in whatever placement and dimensions you desire. We need to be more nuanced with an adaptive approach to online advertising content that permits flexibility. Indeed to maintain control of independent website advertising, the decision and level of advertising is down to the website owner. A website with unacceptable advertising levels will ultimately see a reduction in readership. In this case, the webmaster should adjust ad-block levels accordingly, in which case advertising should be self-governing. We should also be careful that Adblocking companies, which on the whole are profit-making organisations, do not exert overreaching limitations on ad content while acknowledging that advertising needs to be proportionate.
The advice is to maintain a free content website monetised by online marketing such as ad blocks; a website owner should use intelligent and responsible online marketing strategies. This position requires flexibility in the individual choices made by web owners in line with their readers' wants and needs. Often this will be at odds with online ad-blocking software, which makes a rigid form of adherence to their guidelines impractical. There are ways of circumventing the regularly enhancing capabilities of such software, such as random ad placement. Still, these ads should be appropriate, marked as ads and offer a benefit to the users wherever possible. Ultimately the solution is balanced, and in which case, website users will be happy to see ads in return for free content outside a paywall.