In genere, la maggior parte dei distributori di giochi organizza i propri giochi in un formato facilmente riproducibile a schermo intero o in un'altra pagina web o in un WebView all'interno di un'app.
La pagina che ospita il gioco (ovvero il canvas del gioco demo) contiene il codice AdSense ('the tag'), carica la logica JavaScript per il gioco e in genere contiene un elemento del canvas in cui viene visualizzato il gioco.
Il nostro obiettivo con l'API Ad Placement è quello di ridurre al minimo il codice che devi aggiungere al tuo gioco. Potrai controllare gli annunci senza dover cambiare continuamente il gioco e rilasciarne le nuove versioni.
Esistono molti modi in cui è possibile creare giochi H5, utilizzando direttamente JavaScript o librerie di terze parti per la grafica 2D e 3D, che vengono visualizzate in un widget di Canvas, motori di gioco e, in alcuni casi, processi di compilazione incrociata abbastanza complessi da altri linguaggi.
L'API Ad Placement è progettata per essere eseguita nello stesso documento della tela
di gioco e del tag adsbygoogle. Ad esempio, se aggiungi un gioco come iframe in una pagina più grande, il tag e tutte le chiamate all'API devono essere effettuate all'interno di tale iframe.
Esempio di struttura del gioco H5
Il seguente esempio più dettagliato mostra le parti principali di una pagina di gioco tipica.
Esistono molti modi in cui è possibile creare giochi H5, utilizzando direttamente JavaScript o librerie di terze parti per la grafica 2D e 3D, che vengono visualizzate in un widget di Canvas, motori di gioco e, in alcuni casi, processi di compilazione incrociata abbastanza complessi da altri linguaggi. I dettagli esatti del gioco possono essere diversi da questo esempio.
<head>
## The Ad Placement tag ##
# Configure your monetisation settings here and place the standard
# boilerplate code for initialising the API functions. This code may change
# depending on where the game is being distributed (eg. a website, a super
# app, different publishers).
<script async
data-ad-frequency-hint="30s"
src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-123456789" # your publisher ID
crossorigin="anonymous">
</script>
<script>
window.adsbygoogle = window.adsbygoogle || [];
var adBreak = adConfig = function(o) {adsbygoogle.push(o);}
</script>
[...]
</head>
<body>
[...]
## Your game code ##
# This is your game logic that renders the playable canvas. Once you've
# integrated your game with the Ad Placement API, this code won't change due
# to ad configuration updates.
<canvas id="game_canvas" width="100%" height="100%"></canvas>
<script src="game.js"></script>
[...]
</body>
L'API Ad Placement è progettata per essere eseguita nello stesso documento della tela
di gioco e del tag adsbygoogle. Ad esempio, se aggiungi un gioco come iframe in una pagina più grande, il tag e tutte le chiamate all'API devono essere effettuate all'interno di tale iframe.
<head>
<!-- The adsbygoogle tag is not here -->
</head>
<body>
<iframe src="https://www.my-game.com" title="My game" allow="autoplay">
<!-- The game is loaded here and contains the adsbygoogle tag -->
</iframe>
</body>
Come vengono distribuiti i giochi H5
I giochi H5 possono essere distribuiti in molti modi diversi e su diverse piattaforme. Spesso possono esserci diverse entità coinvolte nella creazione e distribuzione dei giochi, tra cui:
- Sviluppatori: le persone che creano i giochi
- Motori: aziende che forniscono gli strumenti per crearli
- Provider di hosting: chi organizza i giochi.
- Distributori: che collaborano con gli sviluppatori per creare tanti cataloghi di giochi.
- Publisher, che sono proprietari della sorgente di traffico e vogliono pubblicare giochi sui propri siti o nelle proprie app
In molti casi, le entità possono ricoprire questi ruoli: puoi sviluppare, ospitare e pubblicare i tuoi giochi.
I giochi possono essere usati in vari modi, ad esempio:
- A schermo intero, dove occupano l'intero schermo per un'esperienza coinvolgente
- iframe/WebView, in cui vengono pubblicati in una parte di un documento più grande.
- Incorporati: posizioni in cui vengono inseriti direttamente nelle pagine con altri contenuti
Le esperienze a schermo intero e iframe si applicano sia all'app web che all'app (⁢iFrame" in questo caso possono anche fare riferimento a un componente WebView incorporato in un'app). Ci aspettiamo che la maggior parte dei giochi venga distribuita in questi modi. I giochi incorporati sono esperienze solo web.
Da ricordare
- Il documento HTML che contiene il tag consente di visualizzare l'annuncio.
- L'annuncio deve sempre coprire completamente il documento che lo contiene.
- Il tag e il gioco devono essere sempre all'interno dello stesso documento.