Using HTML5 Banners instead of GIFs

Printable View

19 March 2018, 10:20 am
nowagering

Using HTML5 Banners instead of GIFs

Hi all, this isn't specifically related to Wordpress, but couldn't find a better category.

I've been struggling with the new HTML5 banners for a while, as typically I've always used GIFs, either self-hosted or direct links to the backends.

However, with the growing number of affiliate programs using HTML5 banners I think it's time to start adopting this approach.

My issue is that I have always auto-generated deals around the website, with the code reading from one config file/database where the various operators and their links, banners, attributes etc are stored, so I only have to change settings in one place, and the changes automatically appear around the site.

This is easy with GIFs, because you can just enter the URL to the image (whether internal or external) and the website code will spit it out in an `<img>` tag.

But, with HTML5 banners, this isn't possible as they are served either by a `<script>` or an `<iframe>`.

How do you manage HTML5 banners?

Also, how do you get them to respond to changes in the viewport size i.e. get them to be mobile responsive?
22 March 2018, 6:42 am
nowagering

Nobody using HTML5 banners?
22 March 2018, 2:22 pm
PROFRBcom

Might it be easier to screenshot the various images on the html 5 banner, create your own gif, and continue as you were doing before with the seemingly quick and simple config file set up?
23 March 2018, 9:18 am
nowagering

Hi, thanks for your reply, yeah I agree that would probably be simpler, but custom banner creation for UK markets is "outlawed" by most operators now, due to regulation and compliance :)

Do you use HTML5 banners? How "mobile responsive" are they? And is it easy enough to spit the <script> or <iframe> out into your page template and respect the size/positioning of the containing element (div etc)?
29 March 2018, 8:17 pm
Breakout Affiliates

To my memory HTML5 even without CSS does scale very well with mobile screens, you might have to write a two different page orientations/styles for a large screen(desktop) and a small one (mobile) device and it should scale boundaries and margins for you
17 April 2018, 4:16 am
vmguide

It's a tricky question which I think should be investigated further by advertisers since it would be in their interest that their banners are responsive.
It is posible to scale iframes responsively, but in most cases the content in the iframe have fixed widths with unique css classes that can't be modified in a dynamic way.
My solution so far, has been to replace the banners as the viewport gets smaller. In our case I use 3 different sizes (three different code snippets) that will display on different screen sizes. This required a fair bit of coding to achieve but works pretty good. We are not using any automated service though.
24 April 2018, 10:16 am
CasinPop

GIF works everywhere and normally has better conversion since its still used as fallbacks.
25 April 2018, 4:58 am
wonderpunter

256 colour gifs? gifs are too heavy for too little .. best go html5
30 May 2018, 4:48 am
nowagering

Quote:

Originally Posted by vmguide

It's a tricky question which I think should be investigated further by advertisers since it would be in their interest that their banners are responsive.
It is posible to scale iframes responsively, but in most cases the content in the iframe have fixed widths with unique css classes that can't be modified in a dynamic way.
My solution so far, has been to replace the banners as the viewport gets smaller. In our case I use 3 different sizes (three different code snippets) that will display on different screen sizes. This required a fair bit of coding to achieve but works pretty good. We are not using any automated service though.

Hi @vmguide - are you using different sized GIF banners, or HTML5 banners?

I've been considering using `srcset` (aka Responsive Images) but obviously these will still only work with images, not HTML5 banners.

With more HTML5 banners becoming available, and some programmes not providing GIF banners, i'm sure there must be some benefits in HTML5 banners (somewhere)!
30 May 2018, 11:12 am
allfreechips

I just make the operators generate a gif.. was coding for HTML5 but its a disaster to start including outside code into any site, I store all images locally on all sites.
30 May 2018, 5:26 pm
Cash Bonus

It would be much easier to just use gifs over HTML5 banners. Those people who are not very good at coding will prefer to go with gifs over HTML5 banners instead.
31 May 2018, 8:02 am
Former Member 14

You could use Base64 encoding ;)

As an example, if I was to use my logo at SpinCitySlots.com

The Base64 coding would be:

Code:

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

Want proof...sure... copy the above code to a Base64 decoder, such as: https://codebeautify.org/base64-to-image-converter

Will convert it back to the (logo) *.png

Edit:
You can either add Base64 inline, or use it in CSS. Either way, it's far quicker/faster than pulling multiple images. Hence, page load speeds are greatly increased ;)
2 July 2018, 9:05 am
nowagering

Quote:

Originally Posted by AussieDave

You could use Base64 encoding ;)

Edit:
You can either add Base64 inline, or use it in CSS. Either way, it's far quicker/faster than pulling multiple images. Hence, page load speeds are greatly increased ;)

Are you sure about that? Inlining base64 images will bloat the size of the page, which can't be cached, whereas images can. I think you'll find that subsequent requests will be much much slower as all the base64 is downloaded again. With images, after the first request, all images will be cached in the browser and so subsequent requests will be much smaller & faster.
2 July 2018, 9:51 am
Former Member 14

Quote:

Originally Posted by nowagering

Are you sure about that? Inlining base64 images will bloat the size of the page, which can't be cached, whereas images can. I think you'll find that subsequent requests will be much much slower as all the base64 is downloaded again. With images, after the first request, all images will be cached in the browser and so subsequent requests will be much smaller & faster.

You were concerned about iframes and scripts being used to serve html5 images.

Sure, any additional coding will increase the size of said page. However, compared to serving multiple images (and lets face it most programs don't optimize their images), so it's not uncommon for each image to 70Kb+. The code for a single base64 image ain't going to be 70Kb. But for argument sake if it was, it would be processed a damn side quicker, on the 1'st page load.

IDK about your site(s), I can only say what happens on mine. Generally, I see (mobile) punters landing on a page, clicking the call to actions on that page, and visiting the casinos. While I get people visiting other pages, the general modus operandi I see from mobile traffic is the aforementioned. While all my sites are mobile optimized, I find PC user are more likely to visit multiple pages, than their mobile counterparts, who, and reiterating seem to visit 1 page and either visit a casino(s) on that page, or leave.

Hence, subsequent pages loads and cached images are a moot point.

Maybe you could look at using AMP (Accelerated Mobile Pages) if that's not being used already.
2 July 2018, 11:35 am
nowagering

Quote:

Originally Posted by AussieDave

You were concerned about iframes and scripts being used to serve html5 images.

Sure, any additional coding will increase the size of said page. However, compared to serving multiple images (and lets face it most programs don't optimize their images), so it's not uncommon for each image to 70Kb+. The code for a single base64 image ain't going to be 70Kb. But for argument sake if it was, it would be processed a damn side quicker, on the 1'st page load.

Yeh fair enough, it will render quicker, but are you really seeing base64 smaller than the original image? Every time i've converted an image to base64 its ended up larger (saving the resulting base64 to a txt file then viewing the size of the txt file).

Quote:

Originally Posted by AussieDave

You were concerned about iframes and scripts being used to serve html5 images.

IDK about your site(s), I can only say what happens on mine. Generally, I see (mobile) punters landing on a page, clicking the call to actions on that page, and visiting the casinos. While I get people visiting other pages, the general modus operandi I see from mobile traffic is the aforementioned. While all my sites are mobile optimized, I find PC user are more likely to visit multiple pages, than their mobile counterparts, who, and reiterating seem to visit 1 page and either visit a casino(s) on that page, or leave.

Hence, subsequent pages loads and cached images are a moot point.

Interesting, I guess it makes sense for you then.

Have briefly looked into AMP before, but parked it for some reason. Thanks for reminding me :)