HTML5 - Material GENERELL INFORMATION Vi använder DFP som annonshanteringssystem (adserver) och riktlinjerna nedan är skrivna för att fungera med detta system. Vi använder oss av friendly iframes som leveranssätt. • Det är inte tillåtet att bryta sig ut från iframe (frame busting). Kontakta Adops om formatet kräver det. • Animering av element får inte överstiga 30 sekunder. • Material måste påbörja rendering av visuella element inom 0,5 sekunder. • Genomsnittlig processoranvändning ska vara maximalt 30%, med maximal topp på 60%. • Maximalt antal anrop (requests) är 15 st per annonsmaterial. • Materialets huvudfil ska döpas till index.html. • Relativa sökvägar ska användas till resurser och filer i materialet. • Referenser till externa resurser¹ ska vara absoluta och starta med https//: och måste stödja SSL/TLS. • Det är inte tillåtet förhindra scroll². • JavaScript console-metoder är inte tillåtna. • Geo Location och liknande Web API:er som kräver användares godkännande får enbart användas efter användarinteraktion. ¹ Så som CDN och externa fontbibliotek. ² Använd inte touchstart som trigger för interaktion (eftersom touchstart triggas vid scroll) FILSTORLEK Vi mäter materialens totala vikt eftersom HTML5 består av flera olika resurser och kontrollerar hur varje resurs laddas in och i vilken ordning. Filstorleken beräknas på alla resurser inklusive spårningsskripts, JavaScript-bibliotek, font-filer, stilmallar etc. Ni kan välja att använda vitlistade CDN:er, men dessa kommer att räknas in i den totala filstorleken på materialet. Viktigt: Om ert material kräver att gränsen överskrids, kontakta kampanjsupport i god tid. Notera att mätskript och skript från 3:e-part så som Google, Sizmek och Adform räknas in som en del av totalvikten. Det innebär att man som annonskreatör inte kan använda lika mycket av totalvikten till annonsmaterialet när man levererar annonser med mätskript elller levererar via 3:e-part, då mätskriptet och/eller 3:e-partskriptet kommer ta delar av totalvikten. Kom ihåg att det är fullt möjligt att ladda in extra resurser efter användarinteraktion. Dessa resurser räknas inte in i de totala initiala storleksbegränsningarna. PRESTANDA Bonnier News testar allt material genom Advalidation.com enligt specifika parametrar. Material som blir underkänt i testerna kommer ej godkännas. • Försök använda CSS för animationer så långt det går istället för JavaScript-bibliotek. • Animera aldrig gömda element. • Försök få ner antalet anrop. • Undvik att ladda in tungt material som t ex video innan användarinteraktion. STRUKTUR, PAKETERING OCH LEVERANS Eftersom HTML inte kan komprimeras och levereras till en enda fil så är det viktigt att beakta filstrukturen. Materialet bör baseras på en index-fil som ska heta index.html. Detta är huvudfilen som kommer att laddas in först och initiera andra komponenter som t ex CSS- och JavaScript-filer. Nödvändig kod för clicktracking ska också ingå i index.html-filen. Vid leverans av flera annonser ska dessa paketeras i individuella zip-filer. HTML5 – Klickmätning DFP Materialet måste vara anpassat efter annonssystemet Google DoubleClick for Publishers (DFP) som Bonnier News använder sig utav. Variabeln clickTag bör användas som definition för click-through URL i alla klickbara ytor i annonsen. Detta för att vi ska kunna mäta klick på den samt att det ska vara möjligt för AdOps att vid förfrågan kunna ändra/lägga in destinations urlen i efterhand. Vi rekommenderar alltså att använda clickTag dvs att INTE hårdkoda click-through URL:en DFP varnar om det saknas korrekt clickTag eller om det finns en URL hårdkodad i annonsen. clickTagen skall vara enkel för ad servern att läsa av, använd ingen minification eller obfuscation. (Däremot är det inga problem att använda det på resten av materialet) Scriptet för clickTag variabeln måste ligga i head-taggen. Försäkra er om att alla ytor som ska vara klickbara använder clickTag-variabeln som definition för clickthroug URL. Exempel där clickTag är implementerad i HTML koden: 
------------------------------------------------------------------------     
var clickTag = “http://www.google.com“;   [The rest of your creative code goes here.]  OBS! Försäkra er om att ytor som ska vara klickbara använder clickTag-variabeln som definition för clickthrough URL:  ????  Multipla klicktaggar räknar upp mot samma nummer. - Destinationslänkarna bör bifogas separat i mejlet som skickas till Bonnier News. - Om ni har flera destinationslänkar så specificeras dessa med vilken clickTag som används. Vid ett scenario där destinationslänken måste vara hårdkodad i annonsmaterialet t ex när länken skapas dynamiskt eller liknande. Då kan clickTag läggas till före destinationslänken som visas här: window.open(clickTag+"http://www.advertisersite.com/subpage", "_blank"); eller så här: window.open(clickTag+dynamicUrlObject, "_blank"); Om destinationslänken innehåller tecken som ? eller & bör länken kodas så här: clickTag +encodeURIComponent("http://www.advertisersite.com/subpage?var1=12&var2=34") Vid detta scenario behöver inte destinationslänken skickas till publicisten, bara en förklaring att destinationslänken är hårdkodad i annonsmaterialet och att clickTag-tracking har lagts in.