Guide de marquage Rich media

Transcription

Guide de marquage
Rich media
AT INTERNET
www.atinternet.com/support
Head office: Parc d’Activités La Devèze - 8 Impasse RUDOLF DIESEL – France – RCS Bordeaux B 403 261 258
DE.S.3-000000533 – v3.3 (updated 04/01/2011)
Table des matières
Avant propos ..................................................................................................................................................................... 1
Rich media ........................................................................................................................................................................ 2
Principes généraux ........................................................................................................................................................ 2
Personnalisation du marquage ................................................................................................................................... 2
Tag de rafraîchissement ............................................................................................................................................. 2
Publicités post-roll ...................................................................................................................................................... 2
Le cas des podcasts ................................................................................................................................................... 2
Implémentation JavaScript ............................................................................................................................................. 3
Marquer les contenus vidéo, audio et animations ....................................................................................................... 3
Marquer les podcasts ................................................................................................................................................. 4
Implémentation ActionScript .......................................................................................................................................... 6
Etape 1 : insertion des appels dans les fichiers AS existants ..................................................................................... 7
Etape 2 : implémentation du fichier "xititag.xml" ......................................................................................................... 9
Exemple d’implémentation ....................................................................................................................................... 10
Annexes .......................................................................................................................................................................... 11
Annexe : identifiants Rich media .................................................................................................................................. 11
Identifiants des actions prédéfinies ........................................................................................................................... 11
Identifiants de définition de la qualité du contenu ..................................................................................................... 11
Identifiants des flux de lecture .................................................................................................................................. 11
Identifiants des extensions de contenus ................................................................................................................... 12
Annexe : Plug-ins Rich media ...................................................................................................................................... 13
Plug-in pour balises audio et video HTML5 .............................................................................................................. 13
Plug-in pour player YouTube .................................................................................................................................... 14
Plug-in pour JW FLV Media Player v4.x ................................................................................................................... 16
Plug-in pour FlowPlayer ........................................................................................................................................... 18
ii
Avant propos
Les marques et logos figurant dans ce document sont des marques enregistrées ou non appartenant à la société AT
Internet ou à des tiers.
Toute utilisation, non autorisée explicitement par les titulaires des marques précitées, est strictement interdite.
Toute reproduction partielle ou totale de ce document, sans autorisation expresse d’AT Internet est interdite.
AT Internet se réserve le droit de mettre à jour le présent document à tout moment et sans préavis.
Document et informations non contractuels.
www.atinternet.com/support
© AT Internet - 2011 - All rights reserved
1
Rich media
Grâce à la fonctionnalité Rich media, vous disposez d’une mesure précise et détaillée de tous les types de contenus
(audio, vidéo, podcast...), mais également d’informations complémentaires sur lieux de diffusion des contenus (internes
ou externes à votre site), les modes de diffusion (Clip ou Live) ainsi que sur les actions précises effectuées par les
internautes (play, stop, pause, backward, forward, partage, envoi par email, mise en favoris...).
Ce document de marquage décrit une marche à suivre générale en fonction de la technologie utilisée pour
l’implémentation de la mesure Rich media :


Implémentation en code JavaScript (lecteurs standards)


la zone Configuration > Marqueurs XiTi > Marqueurs de contenus (version 7.5)
Implémentation en code ActionScript (lecteurs Flash AS3)
Les informations et exemples fournis sont donc valables pour la mesure de tous les types de contenus mesurés (audio,
vidéo, etc.).
Toutes les informations décrites dans ce document sont conditionnées par le téléchargement préalable (et par vos
soins) du fichier xtcore.js version 3.4.002 ou ultérieure. Ce dernier est disponible dans votre interface depuis :
le bouton Outils > Marqueurs (version NX)
Principes généraux
Quel que soit votre type de lecteur (JavaScript ou Flash), AT Internet vous propose de mesurer les types de contenus
suivants :




Vidéo
Audio
Animation
Podcast
IMPORTANT
Un contenu ne peut pas appartenir à 2 types différents. Le fait de renseigner le même libellé lors du marquage (ou le
même identifiant) ne permet pas de les regrouper.
Personnalisation du marquage
En fonction du type de contenu mesuré, vous avez la possibilité de nommer tous les éléments, puis de les classer
(avec pour séparateur "::") sur 3 niveaux de thèmes maximum.
AT Internet vous propose de mesurer un grand nombre d’éléments Rich media en vous proposant des valeurs
prédéfinies, mais vous permet également d’intégrer des informations personnalisées au moment du marquage.
IMPORTANT
Retrouvez toutes les valeurs prédéfinies des variables dans les annexes de ce document.
Tag de rafraîchissement
Pour garantir la parfaite intégrité de la mesure, AT Internet a prévu un envoi (à fréquence régulière) de hits
indépendants de rafraîchissement (Refresh) afin de s’assurer que le media est toujours lu par l’internaute.
Vous obtenez ainsi des durées de lecture plus précises qu’avec une simple mesure basée sur la différence de temps
entre l’action "Stop" et l’action "Play".
Publicités post-roll
Les publicités post-roll sont des publicités présentées en fin de diffusion d’un contenu précis Rich media. La mesure de
ce type de contenu doit passer par la méthode xt_rm() décrite plus bas.
Le cas des podcasts
2
Rich media
La méthode d’implémentation du marqueur Podcast est sensiblement différente des autres types de contenus.
La procédure de marquage est évoquée en détail dans ce document.
Implémentation JavaScript
La méthode de mesure des éléments Rich media consiste à appeler une fonction JavaScript (xt_rm()) au moment du
clic de l’internaute sur un élément du player (diffusant le contenu du média).
Marquer les contenus vidéo, audio et animations
La page Web qui contient le lecteur Rich media doit contenir un code du marqueur avec le fichier xtcore.js.
Ce fichier xtcore.js contient la fonction xt_rm() qui doit être appelée sur chaque action réalisée sur le lecteur (action
JavaScript).
IMPORTANT
Vous devez donc faire appel à la fonction xt_rm() pour mesurer tous les événements sur les types de contenus audio,
vidéo et animation.
Appel en JavaScript via la fonction xt_rm()
La fonction xt_rm(), commune à tous les types de contenus, permet de passer plusieurs variables. Ces dernières ont
une signification différente en fonction du type de contenu mesuré.
La fonction xt_rm() doit prendre la forme suivante (ordre à respecter) :
Onclick=xt_rm(A,B,C,D,E,F,G,H,I,J,K,L,M,N)
Liste des variables à renseigner
Variables Description
A
Obligatoire - Type de contenu ("video", "audio", "animation" ou "vpost" pour la
mesure des vidéos post-roll). Le type de contenu doit être concaténé à la variable
"&plyr=" contenant l’identifiant du lecteur en cours d’utilisation (voir exemple plus bas).
Cette variable "&plyr=", non obligatoire, doit être ajoutée dans le cas de l’utilisation de
plusieurs lecteurs, afin d’assurer le distinguo entre les hits.
B
Site de niveau 2 dans lequel est rangé le contenu.
C
Obligatoire - Libellé du contenu (utilisez les "::" si besoin) ou d'une publicité post-roll
(dans ce cas, ne pas utiliser les "::"). Le libellé d'une publicité post-roll doit être
concaténé à la variable "&clnk=". Celle-ci doit reprendre le libellé du contenu de la
vidéo à laquelle la publicité est liée (voir exemple plus bas).
D
Obligatoire - Action (identifiant prédéfini). Retrouvez la liste des identifiants dans les
annexes de ce document.
E
Valeur de l’action personnalisée (si la variable D="perso"). Vous pouvez ajouter
jusqu’à 5 actions personnalisées. DISPONIBLE PROCHAINEMENT
F
Durée de rafraichissement (optionnel en seconde). La durée de rafraîchissement est
blindée. Il est impossible de saisir une durée inférieure à 5 secondes.
G
Obligatoire (sauf si D est différent de "play" ou si L est égal à "Live") : durée totale du
contenu en seconde (laisser vide si L= "Live")
H
Informations de position de lecture ("rmp", "rmpf" et "rmpbufp") en seconde. Vous
devez renseigner ces 3 variables à concaténer comme suit :
"rmp=0&rmpf=0&rmbufp=0" (0 est la valeur par défaut).
- rmp (rich media position) : position de la tête de lecture. Cette valeur doit être mise à
jour pour chaque action (variable D).
- rmpf (rich Media position from) : position de départ de la tête de lecture lors d’un
déplacement sur la barre de lecture. Cette valeur doit être mise à jour pour chaque
action (si variable D est égale à "move").
- rmbufp (rich media buffer cache position) : position de la barre d'avancement du
3
Guide de marquage | Rich media
cache dans le contenu. Cette valeur doit être mise à jour pour chaque action (variable
D).
I
Identifiant de qualité OU numéro du slide si type="animation".
J
Identifiant de flux OU information si passage automatique ou pas si type="animation".
K
Localisation ("int" ou "ext").
L
Diffusion ("live" ou "clip"). Si A="Animation", renseigner L="Live" permet d’avoir la
durée absolue de lecture (et non relative par rapport à G). Si L est vide, le mode de
diffusion pris en compte est "clip".
M
Taille du contenu (entier en Ko, laisser vide si L="live"))
N
Format du contenu (identifiant prédéfini par nos soins. Voir annexes)
NOTE
Toutes les caractéristiques doivent être transmises à chaque appel.
IMPORTANT
Retrouvez toutes les valeurs prédéfinies des variables dans les annexes.
Exemple 1 :
Ci-dessous l’exemple de la fonction xt_rm qualifiant une action "play" sur un lecteur vidéo se mettant à buffériser.
xt_rm('video&plyr=1','3', 'mychapter::mycontent', '
play&buf=1','0','0','3600','rmp=0&rmpf=0&rmbufp=0','1','1','int','clip','300','1')
Exemple 2 :
Ci-dessous l’exemple de la fonction xt_rm qualifiant une action "move" sur un lecteur vidéo.
xt_rm('video&plyr=1','3','mychapter::mycontent','move','0','0','3600','rmp=15&rmpf=10&rm
bufp=15','1','1','int','clip','300','1');
- la position de la tête de lecture avant déplacement (rmpf) : ‘10’
- la position de la tête de lecture après déplacement (rmp) : ‘15’
Exemple 3 :
Ci-dessous l'exemple de la lecture d’une vidéo suivie d'une publicité post-roll. Précisons que le marquage de la vidéo
précédant la publicité n'est pas obligatoire.
- Action "play" sur la vidéo "videos::video1" (lancement de la vidéo) :
xt_rm('video&plyr=1','1','videos::video1','play','0','5','15','rmp=0&rmpf=0&rmbufp=0','1
','1','int','clip','300','1');
- Action "refresh" sur la vidéo (2 hits sont générés de façon automatique).
- Action "stop" sur la vidéo "videos::video1" (fin de lecture) :
xt_rm('video&plyr=1','1','videos::video1','stop','0','5','15','rmp=15&rmpf=0&rmbufp=15',
'1','1','int','clip','300','1');
- Action "play" sur vidéo post-roll "post1" (lecture de la publicité suivant la vidéo) :
xt_rm('vpost&plyr=1','1','post1&clnk=video1','play','0','5','10','rmp=0&rmpf=0&rmbufp=0'
,'1','1','int','clip','200','1');
Marquer les podcasts
4
Rich media
Pour l’analyse de la performance des podcasts d’un site, nous proposons plusieurs types de mesure :


Le chargement du flux XML sur le logiciel de lecteur de podcast (iTunes ou autres).
Le téléchargement d'un des éléments podcast proposés dans le flux.
Mesure du flux XML
La mesure du flux XML est permise par une redirection du flux vers l’un de nos serveurs afin que nous puissions
mesurer chacun des chargements du flux.
Afin d’installer cette redirection, vous devez procéder de la façon suivante :

Si votre site possède un flux de type podcast sur l'URL http://www.mysite.fr/feed.xml, les internautes ont noté
cette URL dans leur lecteur de podcast.


Copiez le contenu de ce fichier dans un autre fichier XML inconnu des internautes (par exemple, feed2.xml).
Remplacez son contenu par une redirection dynamique (côté serveur) vers :
http://logxxxx.xiti.com/get/feed?xts=xxxx&type=Podcast&feed=feed_name&url=http://www.mys
ite.com/feed2.xml
Dans cette URL, les modifications suivantes doivent être apportées :



logxxxx est à remplacer par le serveur indiqué dans la variable xtsd de votre code du marqueur général

url contient l’URL vers laquelle la redirection doit se faire (celle qui héberge votre flux). Cette variable doit être
placée en dernier et commencer par http://
xts=xxxx est à renseigner avec l’identifiant de votre site (variable xtsite du code du marqueur général)
feed_name est à remplacer par le nom que vous voulez donner à votre flux (celui qui apparaitra dans votre
rapport)
NOTE
Cette méthode permet de mesurer les flux XML déjà enregistrés par les internautes dans leur lecteur de flux (iTunes ou
autres). Pour toute nouvelle inscription, il est recommandé de proposer aux internautes le même fichier XML avec en
paramètre la date de l’inscription : la redirection vers logxxxx.xiti.com/…. ne se fait alors que si la date de diffusion est
supérieure à celle de l’inscription (pas de mesure le 1 er jour).
* Date de la mesure (variable "xtdate") :
Pour éviter que les lecteurs de flux podcast enregistrent directement l'URL redirigée, vous devez vous baser sur la date
d'inscription au flux. Si la date récupérée est la date du jour, la redirection ne se fait pas, si la date est différente de la
date du jour, la redirection s'effectue.
Si votre site propose un flux Podcast sur l'URL suivante :
http://www.mysite.com/feed.xml
Vous devez suivre les étapes suivantes :
1. A tous les appels à ce flux, ajoutez la date du jour dans une variable "xtdate".
Par exemple en ASP :
http://www.mysite.com/feed.xml?xtdate=<% = date %>
Cette date sera récupérée comme la date d'inscription au flux.
2. Copiez le contenu de ce fichier flux.xml dans un autre fichier (par exemple feed2.xml) qui servira au point 3.
3. Remplacez le contenu du fichier flux.xml par une redirection dynamique (côté serveur) vers nos serveurs :
http://logxxxx.xiti.com/get/feed?xts=xxxx&type=podcast&feed=feed_name&xtinsc={value_xtda
te}&url=http://www.mysite.com/feed2.xml
où feed_name est à remplacer par votre propre libellé de flux.
IMPORTANT
Vous devez réaliser cette opération UNIQUEMENT si la variable xtdate n'est pas la date du jour.
Par exemple, en ASP, vous auriez :
5
<% xtdate = request.querystring("xtdate")
if date = xtdate then %>

<% else
response.redirect "http://logxxxx.xiti.com/get/feed?xts=xxxx&type=podcast&feed=feed_name
&xtinsc=" & xtdate & "&url=http://www.mysite.com/feed2.xml"
end if
%>
Au final :

Si la date que vous avez placée dans l'URL est celle du jour, feed.xml ne contient alors que feed2.xml en
"include"

Sinon l'URL logp.xiti.com effectuera une redirection vers feed2.xml (permettant ainsi la mesure)
Mesure des articles podcast
Les articles podcast peuvent être des fichiers audio, vidéo ou autres, que le flux XML propose en téléchargement.
Là aussi, il est nécessaire de passer par une redirection, en procédant de la façon suivante :

Repérez les balises <enclosure> à l’intérieur de votre fichier XML. Par exemple, la ligne suivante :
<enclosure url="http://mysite.com/video.mov" length="34524" type="video/quicktime" />

Remplacez l’URL appelée par le fichier, par une URL de redirection comme celle-ci :
<enclosure
url="http://logxxxx.xiti.com/get/my_video.mov?xts=xxxx&type=Podcast&feed=feed_na
me&pod=video_name&url=http://www.mysite.com/video.mov" length="34524"
type="video/quicktime" />
NOTE
Pour des raisons de compatibilité avec iTunes, il est impératif d’ajouter "amp ;" derrière le caractère "&".
Dans cette URL, les modifications suivantes doivent être apportées :




logxxxx est à remplacer par le serveur indiqué dans la variable xtsd de votre code du marqueur général

video_name à remplacer par le nom que vous voulez donner au fichier téléchargé (libellé que vous
retrouverez dans votre interface)

url contient l’URL vers laquelle la redirection doit se faire (celle qui héberge votre flux). Cette variable doit être
placée en dernier et commencer par http://
xts=xxxx est à renseigner avec l’identifiant de votre site (variable xtsite du code du marqueur général)
feed_name reprend le libellé du flux global XML
my_video.mov est un libellé que vous pouvez renseigner librement (avec extension .mp3, .mov ou autre) et
qui est repris par certains lecteurs de flux (IE7 entre autre)
IMPORTANT
L'URL placée derrière dans la variable url= doit commencer par ‘http://’ et doit être placée à la fin.
La variable "pod" doit être utilisée uniquement pour les articles téléchargés (sans cette variable, une actualisation du
flux est mesurée et non un téléchargement d’élément).
NOTE
Les analyses seront disponibles dans Rich media > Podcasts.
Implémentation ActionScript
Nous décrivons ici la méthode d’implémentation Rich media dans un lecteur de type Flash AS3.
IMPORTANT
Pour l'implémentation Rich media, nous mettons à votre disposition un dossier "XiTiFlash". Ce dossier est disponible
UNIQUEMENT SUR DEMANDE à formuler depuis le Centre Support dans l’interface. Il contient :
- Des fichiers sources AS3 : ils ne doivent pas être modifiés et doivent être placés dans le même dossier que votre film
6
Rich media
flash source.
- Un fichier "xititag.xml" qui doit contenir toutes les informations reliant les flags aux variables.
L’implémentation du marqueur Rich media nécessite plusieurs étapes :
1. Placer les bons fichiers contenus dans le dossier "XiTiFlash" dans votre espace de travail Flash.
2. Modifier votre film Flash pour insérer des flags qui caractérisent les endroits que vous souhaitez mesurer tout au
long de votre film.
3. Implémenter un fichier XML (exemple proposé dans le dossier "XiTiFlash") qui reprend tous les flags créés pour leur
attacher des variables.
Etape 1 : insertion des appels dans les fichiers AS existants
En fonction de vos besoins de mesure, vous devez insérer la ligne :
XiTiTag.loadXml("Flag_Name");
Dans cette ligne de code "Flag_Name" est un libellé qui relie l’événement Flash à mesurer au code contenu dans le
fichier xititag.xml.
XiTiTag est une fonction créée dans un des fichiers ".as" du dossier "XiTiFlash".
Nous vous recommandons de donner des noms suffisamment explicites aux flags, tout en sachant que vous devez
configurer leurs propriétés à mesurer dans le fichier "xititag.xml" (voir étape 2).
IMPORTANT
Si le film Flash fait appel ("XiTiTag.loadXml()") à un flag non déclaré dans le fichier XML, la mesure ne se fait pas.
Exemple :
L’image ci-dessus présente un code ".as" existant dans lequel ont été ajoutés 2 appels XiTiTag.loadXml() avec un nom
de flag "Play_video1" et "stop_video1".
L’objectif de ces appels est de générer une mesure Rich media avec une action "play" et "stop". Ces actions sont
renseignées dans le fichier xititag.xml, via la fonction xt_rm().
Variables dynamiques
Pour des raisons pratiques, si vous souhaitez passer les valeurs de certaines variables (à passer dans la fonction
xt_rm() du fichier xititag.xml) directement dans le code source du fichier .as, vous devez regrouper ces variables
(concaténées avec des séparateurs "&") dans une chaine à passer comme seconde variable de XiTiTag.loadXml().
Exemple :
7
//Start play
private function doPlay (e:MouseEvent) :void
{
var nameflv:String="&richname=theme::myvideo1";
flv=video1.flv";
if (nextP){
flv="video2.flv";
nameflv="&richname=thme::myvideo2";
}
XiTiTag.loadXml ("Play", nameflv) ;
vidtest.stopPlay (ns) ;
vid.clear () ;
vidTest.startPlay (ns, flv) ;
vid.attachNetStream (ns) ;
}
Cet exemple montre comment une variable dynamique ("nameflv") est construite pour changer un nom de contenu
("myvideo1" ou "myvideo2") selon un certain contexte.
L’appel suivant :
XiTiTag.loadXml("Play",nameflv);
Permet ainsi de se reposer sur les caractéristiques du flag "Play" (passées dans xt_rm() de xititag.xml) tout en
modifiant le libellé du contenu.
Toutes les variables passées en seconde variable de cet appel sont prioritaires sur les informations renseignées dans
le fichier XML (étape 2).
Structure des variables
Pour contrôler dynamiquement chaque variable de xt_rm(), il suffit donc de les renseigner dans les noms suivants :
Variables
Description
type
Obligatoire - Type de contenu ("audio", "video", "animation" ou "vpost" pour la
mesure des publicités post-roll).
plyr
Identifiant de lecteur.
clnk
Libellé du contenu lié à une publicité post-roll (type vpost).
xtn2
Site de niveau 2 dans lequel ranger le contenu.
richname
Obligatoire - Libellé du contenu (avec utilisation de "::" si besoin pour établir une
arborescence thématique).
action
Obligatoire - Identifiant texte caractérisant une action parmi les actions prédéfinies
(voir annexes).
custom
Contenu des variables personnalisées (à utiliser uniquement si action="perso").
DISPONIBLE PROCHAINEMENT
refresh
Durée de rafraîchissement (optionnel, en seconde). Pour les contenus de longue
durée, cette variable permet de générer des hits intermédiaires automatiques (entre
le hit de "play" et celui de "stop") apportant ainsi une mesure plus fine de la durée.
duration
Durée totale du contenu en seconde (laisser vide si mode="live"). Cette variable est
obligatoire si action="play" et mode="clip".
buf
Buffering en cours (buf=1).
8
Rich media
rmp
Position de la tête de lecture.
rmpf
Position d'origine lors d’un déplacement sur la barre de lecture.
quality
Identifiant de qualité OU numéro de slide si type="animation".
stream
Identifiant de flux OU booléen pour indiquer si le changement de slide est
automatique ou pas (si type="animation")
location
Localisation du contenu ("int" pour interne au site ou "ext" pour externe).
mode
Diffusion ("live" pour les contenus diffusés en continu et sans durée, ou "clip" pour
les contenus à durée finie). Si "type=Animation", renseigner "mode=Live" permet
d’avoir la durée absolue de lecture (et non relative par rapport à "duration"). Si mode
est vide, le mode de diffusion pris en compte est "clip".
size
Taille/poids du contenu (entier en Ko, laisser vide si mode="live").
extension Format du contenu (identifiant prédéfini. Voir annexes).
Pour contrôler dynamiquement les variables de pages et de niveau 2 contenant le media, vous devez les renseigner
dans les noms suivants :
xtprich : libellé de la page avec contenu media.
xts2rich : niveau 2 de la page avec contenu media.
Etape 2 : implémentation du fichier "xititag.xml"
Ce fichier contient :


une balise <xiti> contenant elle-même 2 balises.
une balise <tags> contenant toutes les balises <tag> définissant les flags présents dans les fichiers ".as"
sources. Elle doit contenir le sous-domaine du marqueur et le numéro de site.
NOTE
Les variables définies dans la balise <tags> sont les valeurs globales par défaut à attribuer à toutes les balises <tag> :
cela évite d’avoir à répéter dans chaque balise le sous-domaine et l’identifiant du site. Ces variables peuvent être
redéfinies de façon dynamique.

une balise <settings> qui contient elle-même une balise <url> caractérisant le domaine du collecteur (ne pas
modifier).
Exemple :
Ci-dessous un exemple de fichier "xititag.xml" donné dans le dossier "XiTiFlash" :
<?xml version="1.0" encoding="iso-8859-1"?>
<xiti>
<tags xtsd="http://log" xtsite="32" xtn2="17">
<! -- video launch -->
<tag key="Play_video1" xtprich="page_with_video" xts2rich="3"
xtrm="video,4,video1,play,0,2,3000,4,1,1,int,clip,1000,8" />
<tag key="Stop_video1" xtprich="page_with_video" xts2rich="3"
xtrm="video,4,video1,stop" />
</tags>
<! -- General parameters defintion -->
<settings>
<url>.xiti.com/hit.xiti</url>
</settings>
</xiti>
9
Exemple d’implémentation
Avec le tag XML suivant :
<tag key="Play_video1"
xt_rm="video&plyr=1,4,chap::myvideo,play,0,6,10,rmp=0&rmpf=0&rmbufp=0
,1,1,int,clip,1000,8" xtprich="video_page" xts2rich="3" />
Tout appel :
XiTiTag.loadXml("Play_video1");
envoie un hit contenant les informations suivantes :








o
o
o






Type : "video" et Identifiant du lecteur : "1"
Site de niveau 2 : "4"
Libellé du contenu : "chap::myvideo"
Action : "play"
Actions personnalisées : "0" (pas d’action personnalisée / Disponible prochainement).
Durée de rafraîchissement : "6" (secondes)
Durée totale du contenu : "10" (secondes)
Positions Rich media
rmp= : "0"
&rmpf= : "0"
&rmbufp= : "0"
Identifiant de qualité : "1" (22khz)
Identifiant de flux : "1" (64 kbps)
Localisation du contenu : "int" (interne au site)
Mode de diffusion : "clip" (contenu avec durée finie)
Taille/poids du contenu : "1000" (Ko)
Format du contenu : "8" (swf)
Par contre, l’appel suivant :
XiTiTag.loadXml("Play_video1", "&richname=theme::myvideo&duration=20&rmp=10");
envoie un hit avec exactement les mêmes informations, à l’exception :



10
du nom du contenu : "theme::myvideo"
de la durée du contenu : "20" (secondes)
de la position de la tête de lecture : "10" (secondes)
Annexes
Annexe : identifiants Rich media
Identifiants des actions prédéfinies
En fonction de la signification à donner à l’appel d’un tag, les actions Rich media doivent contenir un des identifiants
textes suivants :




"play" : action de lancement de lecture

"pause" : action de mise en pause

"stop" : action d’arrêt de lecture (et donc de retour au début)

"forward" : action de se déplacer vers l’avant (valable uniquement pour les contenus avec des séquences
prédéfinies)

"backward" : action de se déplacer vers l’arrière (valable uniquement pour les contenus avec des séquences
prédéfinies)

"share" : action de partager la vidéo (utilisé surtout dans les blogosphères)

"email" : action d’envoyer le contenu par mail

"favor" : action de mise en favoris

"download" : action de télécharger un contenu

"perso" : DISPONIBLE PROCHAINEMENT - action non prédéfinie. Cet identifiant permet de passer jusqu’à 5
actions personnalisées. Elles doivent être définies dans votre interface et les valeurs sont à transmettre dans
les variables rm1, rm2, rm3, rm4 ou rm5.

"move" : action de déplacement de la tête de lecture
"play&buf=1" : action de lancement de lecture qui déclenche directement une mise en buffering
"info&buf=1" : action de mise en buffering automatique en cours de lecture
"info&buf=0" : action d'arrêt du buffering qui déclenche la reprise de la lecture
Identifiants de définition de la qualité du contenu
La qualité est une mesure qui s’exprime en Hz. Les identifiants prédéfinis sont les suivants :

1 : 22 kHz

2 : 44 kHz

3 : 32 kHz

4 : 70 kHz
Identifiants des flux de lecture
Les flux de lecture sont des mesures qui s’expriment en kbps. Les identifiants prédéfinis sont les suivants :

1 : 64 kbps

2 : 128 kbps

3 : 160 kbps

4 : 192 kbps

5 : 224 kbps

6 : 256 kbps

7 : 320 kbps

8 : 22 kbps

9 : 96 kbps
11

10 : 112 kbps

11 : 300 kbps








12 : 500 kbps
13 : 1000 kbps
14 : 800 kbps
15 : 900 kbps
16 : 1200 kbps
17 : 1500 kbps
18 : 200 kbps
19 : 2030 kbps
Identifiants des extensions de contenus
Les extensions de contenu se renseignent dans le tag par des identifiants textes dont voici la liste :
12

1 : mp3

2 : wma

3 : wav

4 : aiff

5 : aac

6: mpeg

7 : flv

8 : swf

9 : mp4

10 : avi

11 : mkv

12 : wmv





13 : mp3+G
14 : rm
15 : rmvb
16 : mov
17 : ogg
Annexes
Annexe : Plug-ins Rich media
Plug-in pour balises audio et video HTML5
Dans les recommandations HTML5 du W3C, vous avez noté l'apparition de nouvelles balises vidéo et audio. Ces
éléments permettent une intégration simplifiée de contenus multimédias dans des documents HTML ou XHTML. AT
Internet vous propose un plug-in Rich media pour marquer facilement ce type de balises. Le principe est de collecter
des données relatives à toutes les actions des utilisateurs sur les lecteurs associés à chaque balise, puis de générer
des hits pour la mesure Rich media.
L'objectif est ici de renseigner la plupart des valeurs utilisées pour le marquage Rich media classique directement dans
les balises HTML5.
ETAPE 1 : IMPLEMENTATION DU FICHIER XTVARM.JS
Le plug-in Rich media est composé d’un fichier JavaScript xtvarm.js. Vous devez récupérer ce fichier puis le placer
dans l’arborescence de votre site.
ETAPE 2 : CREATION D'UN APPEL AU FICHIER XTVARM.JS
Ajouter l’appel au fichier xtvarm.js dans le code source de vos pages contenant des balises audio et/ou video, juste en
dessous de l’appel au script xtcore.js :
<script language="javascript" src="xtvarm.js"></script>
ETAPE 3 : INTEGRATION DES VARIABLES RICH MEDIA
Les variables Rich media ont été renommées comme indiqué dans le tableau ci-dessous. Une fois renseignées, elles
doivent être ajoutées dans les balises audio et/ou video concernées.
Variables
standards
Variable à
insérer
Description
A
xttype
xtplayer
Type de contenu ("video", "audio", "animation" ou "vpost")
Identifiant du lecteur (variable non obligatoire).
B
xtn2
Site de niveau 2 dans lequel est rangé le contenu
C
xtrichname
xtclink
Libellé du contenu (utilisez les "::" si besoin) ou d’une publicité post-roll (dans
ce cas, ne pas utiliser les "::")
Libellé du contenu lié à une publicité (si utilisé).
F
xtrefresh
Durée de rafraîchissement (optionnel en seconde).
G
xtduration
Durée totale du contenu en seconde (laisser vide si L="live").
I
xtquality
Identifiant de qualité OU numéro du slide si type="animation"
J
xtstream
Identifiant de flux OU information si passage automatique ou pas si
type="animation"
K
xtlocation
Localisation ("int" ou "ext")
L
xtmode
Diffusion ("live" ou "clip"). Si A="Animation", renseigner L="Live" permet d’avoir
la durée absolue de lecture (et non relative par rapport à G)
M
xtsize
Taille du contenu (entier en Ko, laisser vide si L="live")
N
xtextension
Format du contenu (identifiant prédéfini par nos soins).
Pour obtenir plus d'informations sur les identifiants Rich media, consultez la section Annexes > Marquage Rich media >
Identifiants Rich media.
13
IMPORTANT
Le lancement du processus de traitement est conditionné par la présence des variables du Rich media dans les
différentes balises.
Exemples d'intégration de variables
*Marquage d'une vidéo classique :
<video xttype="video" xtplayer="1" xtrichname="Test::Video" xtrefresh="5"
xtduration="41" xtquality="1" xtstream="1" xtlocation="ext" xtmode="clip" xtsize="5603"
xtextension="17" src="video.ogg" width="150" height="150" controls></video>
*Marquage d’une vidéo publicitaire type "post-roll":
<video xttype="vpost" xtplayer="2" xtrichname="Post_Roll" xtclink="Video" xtrefresh="10"
xtduration="15" xtquality="1" xtstream="1" xtlocation="int" xtmode="clip" xtsize="3000"
xtextension="17" src="pub.ogg" width="150" height="150" controls></video>
*Marquage d’une piste audio :
<audio xttype="audio" xtplayer="1" xtrichname="Test::Audio" xtrefresh="5"
xtduration="180" xtquality="1" xtstream="1" xtlocation="int" xtmode="clip" xtsize="5000"
xtextension="3" width="150" height="150" controls src="audio.wav"></audio>
Plug-in pour player YouTube
Le player de "YouTube" est un lecteur de media Internet développé en Flash et accessible en ligne. Il possède une
interface permettant son contrôle via le langage JavaScript. Le plug-in que nous proposons permet la récupération de
données Rich media fournies par ce lecteur. Concrètement, ce plug-in permet de collecter des données relatives aux
actions des utilisateurs sur le lecteur et de générer des hits pour la mesure Rich media.
En appelant une animation Flash depuis un navigateur web, il est possible de lui associer quelques variables à l’aide
du paramètre appelé "flashvars". L'objectif est ici de renseigner la plupart des valeurs nécessaires à la fonction
"xt_rm(A,B,C,D,E,F,G,H,I,J,K,L,M,N)" utilisée pour le marquage Rich media classique.
ETAPE 1 : IMPLEMENTATION DU FICHIER XTYTRM.JS
Le plug-in Rich media est composé d’un fichier JavaScript xtytrm.js. Vous devez récupérer ce fichier puis le placer
ETAPE 2 : CREATION D'UN APPEL AU FICHIER XTYTRM.JS
Ajouter l’appel au fichier xtytrm.js dans le code source de vos pages contenant un player YouTube, juste en dessous
de l’appel au script xtcore.js :
<script language="javascript" src="xtytrm.js"></script>
Les variables Rich media standard ont été renommées. Pour voir le détail des variables consultez le tableau disponible
dans la section précédente Plug-in pour balises audio et video HTML5 (Etape 3).
Une fois renseignées, elles doivent être ajoutées au paramètre "flashvars" de l’animation.
NOTE
Les actions de type "move" liées au déplacement de la tête de lecture ne sont pas détectées par le plug-in.
ETAPE 4 : ACTIVATION DE L'API "YOUTUBE"
Le contrôle de la lecture en JavaScript passe par l’ajout de variables spécifiques au lecteur de "YouTube".

Pour activer l’interface JavaScript de "YouTube" (API), il est indispensable de passer le paramètre suivant
dans l’URL du player :
"enablejsapi = 1"
14
Annexes

Vous devez également ajouter un paramètre permettant l’identification du player en cours d’utilisation dans
cette même URL :
"playerapiid=idplayer"
IMPORTANT
Le fonctionnement de l’API JavaScript du player de "YouTube" est conditionné par l’installation d’une version 8 ou
supérieure de "Flash Player".
EXEMPLES D'IMPLEMENTATION
Cas n°1 : utilisation d’un constructeur JavaScript pour le déploiement d’un player.
Il s'agit de déclarer une variable JavaScript appelée "flashvarsAT" qui va contenir les valeurs du Rich media.
<script type="text/javascript" src="swfobject.js"></script>
<div id="ytapiplayer">
You need Flash player 8+ and JavaScript enabled to view this video.
</div>
<script type="text/javascript">
//Déclaration des variables utiles au Rich media
var flashvarsAT= {
xttype: "video", //A
xtplayer: "1", //A
xtn2: "1", //B
xtrichname: "Video::YouTube", //C
xtclink:"",//C
xtrefresh: "10", //F
xtduration: "195", //G
xtquality: "1", //I
xtstream: "1", //J
xtlocation: "int", //K
xtmode: "clip", //L
xtsize: "10215", //M
xtextension: "7" //N
};
var params = { allowScriptAccess: "always" };
var atts = { id: "ytplayer" };
swfobject.embedSWF("http://www.youtube.com/v/ma9I9VBKPiw?border=0&enablejsapi=1&
playerapiid=ytplayer",
"ytapiplayer", "425", "344", "8", null, flashvarsAT, params, atts);
</script>
Cas n°2 : insertion directe du player dans le code source de la page (version HTML).
Le paramètre "flashvars" doit être ajouté à la fois dans une balise "PARAM" et dans la balise "EMBED".
<object
codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=
9,0,18,0" id="ytplayer" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="425"
height="344">
<param name="movie"
value="http://www.youtube.com/v/ma9I9VBKPiw?border=0&enablejsapi=1&playerapiid=y
tplayer"/>
<param name="allowScriptAccess" value="always" />
<param name="flashvars"
value="xttype=video&xtplayer=1&xtn2=1&xtrichname=Video::YouTube&xtclink=
&xtrefresh=10
&xtduration=195&xtquality=1&xtstream=1&xtlocation=int&xtmode=clip&am
p;xtsize=10215
&xtextension=7"/>
<embed allowScriptAccess="always" height="344" width="425" type="application/xshockwave-flash" name="ytplayer" id="ytplayer"
src="http://www.youtube.com/v/ma9I9VBKPiw?border=0&enablejsapi=1&playerapiid=ytp
layer"
flashvars="xttype=video&xtplayer=1&xtn2=1&xtrichname=Video::YouTube&xtcl
ink=&xtrefresh=10
&xtduration=195&xtquality=1&xtstream=1&xtlocation=int&xtmode=clip&am
p;xtsize=10215
&xtextension=7">
</embed>
</object>
15
Plug-in pour JW FLV Media Player v4.x
Le "JW FLV Player" est un lecteur de media Internet développé en Flash. Il supporte la lecture de plusieurs formats
(FLV, MP4, MP3, AAC, JPG, PNG et GIF). Il supporte également les protocoles RTMP, HTTP, le streaming en live,
divers formats de playlists,... et propose un large éventail de paramètres. Il est également possible de contrôler le
lecteur via le langage JavaScript. Le plug-in que nous proposons permet la récupération de données Rich media
fournies par ce lecteur. Concrètement, ce plug-in permet de collecter des données relatives aux actions des utilisateurs
sur le lecteur et de générer des hits pour la mesure Rich media.
En appelant une animation Flash depuis un navigateur web, il est possible de lui associer quelques variables à l’aide
du paramètre appelé "flashvars". L'objectif est ici de renseigner la plupart des valeurs nécessaires à la fonction
"xt_rm(A,B,C,D,E,F,G,H,I,J,K,L,M,N)" utilisée pour le marquage Rich media classique.
IMPORTANT
Le plug-in ne fonctionne que pour les versions 4.x du player JW.
ETAPE 1 : IMPLEMENTATION DU FICHIER XTJWRM.JS
Le plug-in Rich media est composé d’un fichier JavaScript xtjwrm.js. Vous devez récupérer ce fichier puis le placer
ETAPE 2 : CREATION D'UN APPEL AU FICHIER XTJWRM.JS
Ajouter l’appel au fichier xtjwrm.js dans le code source de vos pages contenant un Player JW (à télécharger sur le site
officiel), juste en dessous de l’appel au script xtcore.js :
<script language="javascript" src="xtjwrm.js"></script>
Les variables Rich media standards ont été renommées. Pour voir le détail des variables consultez le tableau
disponible dans la section Plug-in pour balises audio et video HTML5 (Etape 3).
Une fois renseignées, elles doivent être ajoutées au paramètre "flashvars" de l’animation.
ETAPE 4 : ACTIVATION DE LA MESURE
Ajout de la fonction "tracecall"
Une fonction nommée "tracecall" et permettant de "tracer" l’activité du Player est disponible pour les versions 4.x.
Cette fonction a été ajoutée par les concepteurs pour permettre aux utilisateurs de récupérer facilement des données
en JavaScript concernant les changements d’état du lecteur ("Lecture", "Stop", etc.).

Pour activer le plug-in, il est indispensable d’ajouter la variable "tracecall" dans le paramètre "flashvars" de
l’animation :
flashvars="&tracecall=xtTrace"
Ajout de la méthode "xtTrace"
"xtTrace" est le nom de la méthode principale du plug-in. A chaque action d’un utilisateur sur le lecteur, la fonction
"tracecall" réagit et appelle notre méthode "xtTrace" permettant la génération de hits de type Rich media.

Il est nécessaire d’ajouter un bloc de code JavaScript contenant la fonction "xtTrace" au dessus de chaque
animation à « tracer ».
function xtTrace(str){ xtHitjw ('player', null , str);}
</script>
player : identifiant du player (doit correspondre au paramètre ID de l’animation)
null : ne doit pas être modifier
str : ne doit pas être modifier
IMPORTANT
Vous devez ajouter autant de fonctions "xtTracex" qu’il y a de lecteurs JW à mesurer (avec x correspondant au numéro
de lecteur).
16
Annexes
Exemple n°1 : votre code source contient un lecteur dont l’identifiant est "player1". Dans ce cas, il faut ajouter le bloc
suivant au dessus du code de l’objet FLASH concerné :
function xtTrace(str){ xtHitjw ('player1', null , str);}
</script>
Puis insérer la ligne suivante dans le paramètre "flashvars" de l’animation :
&tracecall=xtTrace
Exemple n°2 : votre code source contient deux lecteurs dont le premier identifiant est "player1" et le deuxième "player2
".
Dans ce cas, il faut ajouter le bloc suivant au dessus du premier objet FLASH :
</script>
Puis insérer la ligne suivante dans le paramètre "flashvars" de la première animation :
&tracecall=xtTrace
Puis ajouter le bloc suivant au dessus du deuxième objet FLASH :
function xtTrace2(str){ xtHitjw ('player2', null , str);}
</script>
Puis insérer la ligne suivante dans le paramètre "flashvars" de la deuxième animation :
&tracecall=xtTrace2
EXEMPLES D’IMPLEMENTATION
Cas n°1 : utilisation d’un constructeur JavaScript pour le déploiement d’un player. Il s'agit de déclarer une variable
JavaScript appelée "flashvarsAT" qui va contenir les valeurs du Rich media.
</script>
<script language="javascript">
var flashvarsAT="";
flashvarsAT +="&xttype="; //A
flashvarsAT +="&xtplayer="; //A
flashvarsAT +="&xtn2="; //B
flashvarsAT +="&xtrichname="; //C
flashvarsAT +="&xtclink="; //C
flashvarsAT +="&xtrefresh="; //F
flashvarsAT +="&xtduration="; //G
flashvarsAT +="&xtquality="; //I
flashvarsAT +="&xtstream="; //J
flashvarsAT +="&xtlocation="; //K
flashvarsAT +="&xtmode="; //L
flashvarsAT +="&xtsize="; //M
flashvarsAT +="&xtextension="; //N
flashvarsAT +="&tracecall=xtTrace"; //Call to xtTracex method
//Construction of the animation
var so = new SWFObject("PathPlayer/player.swf", "player1", "460", "120", "7",
"#FFFFFF");
//Addition of the « flashvarsAT » variable to the animation’s « flashvar » parameter
so.addParam("flashvars", "file=PathFile/file.extension" +flashvarsAT);
so.write("flashcontent");
</script>
Cas n°2 : insertion directe du player dans le code source de la page (version HTML). Le paramètre "flashvars" doit être
ajouté à la fois dans une balise "PARAM" et dans la balise "EMBED".
17
</script>
<object
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,
0,0,0" id="player1" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="460"
height="120">
<param name="movie" value="PathPlayer/player.swf"/>
<param name="flashvars"
value="file=PathFile/file.extension&xttype=&xtn2=&xtrichname=&xtclink=&a
mp;xtrefresh=&xtduration=&xtplayer=&xtquality=&xtstream=&xtlocation=
&xtmode=&xtsize=&xtextension=
&tracecall=xtTrace"/>
<embed height="120" width="460" type="application/x-shockwave-flash" id="player1"
src="PathPlayer/player.swf"
flashvars="file=PathFile/file.extension&xttype=&xtn2=&xtrichname=&
&xtclink=&xtrefresh=&xtduration=&xtplayer=&xtquality=&xtstream=&
amp;xtlocation=
&xtmode=&xtsize=&xtextension=&tracecall=xtTrace">
</embed>
</object>
Plug-in pour FlowPlayer
FlowPlayer est un lecteur vidéo Flash. Ce player est facilement personnalisable et paramétrable via JavaScript ou un
autre Flash. Voir le site officiel pour plus de détails : http://flowplayer.org/.
Le plug-in Rich media permet de collecter des données concernant les actions des utilisateurs sur le lecteur et de
générer des hits pour le Rich media. Le plug-in Rich media est composé d’un fichier SWF :
flowplayer.ATRichmedia.swf
ETAPE 1 : INSERTION DU LECTEUR FLASH FLOWPLAYER
Placez le fichier Flash dans l’arborescence de votre site.
ETAPE 2 : AJOUT DU FICHIER FLOWPLAYER.ATRICHMEDIA.SWF
Ajoutez ensuite le plug-in au lecteur.
Le but est ici de renseigner la plupart des valeurs nécessaires à la fonction "xt_rm(A,B,C,D,E,F,G,H,I,J,K,L,M,N)"
utilisée pour le marquage Rich media classique.
Les variables Rich media standards ont été renommées. Pour voir le détail des variables consultez le tableau
disponible dans la section Plug-in pour balises audio et video HTML5 (Etape 3).
Ajout d'une playlist
Il existe différentes méthodes d’insertion de clip dans le lecteur. Pour des raisons techniques liées à la collecte
d’informations, les médias doivent être ajoutés sous forme de « playlist ».
Une « playlist » FlowPlayer se construit en JavaScript ; des exemples d’implémentation sont disponibles à cette
adresse : http://flowplayer.org/documentation/configuration/index.html
Cet objet permet de passer des propiétés personnalisées pour chaque media, qui seront ensuite récupérées par le
plug-in AT lors de la lecture.
Ajout du plug-in
Un lecteur FlowPlayer se déploie facilement grâce, entre autre, à un constructeur JavaScript :
<script>
$f("player", "Player/flowplayer-3.2.5.swf", {});
</script>
Une « playlist » doit être déclarée en tant qu’objet puis passée dans le troisième paramètre du constructeur :
$f("player", "Player/flowplayer-3.2.5.swf", {
playlist:[{
url: 'Videos/my_video.flv',
xttype: 'video',
xtn2: '',
xtrichname: 'Video::Label',
xtclink: '',
xtrefresh: '5',
18
Annexes
xtduration: '20',
xtquality: '1',
xtstream: '1',
xtlocation: 'int',
xtmode: 'clip',
xtsize: '1701',
xtextension: '7'
}
]}
);
Le plug-in Rich media doit également être ajouté en tant qu’objet, à la suite de l’objet « playlist » :
plugins: {
ATRichmedia: {
url: 'Plugin_Richmedia/flowplayer.ATRichmedia.swf',
xtplayer: '1'
}
}
La variable « xtplayer » correspond à l’identifiant du lecteur. Elle est utile dans le cas d’une utilisation de plusieurs
lecteurs sur la même page.
EXEMPLE D'IMPLEMENTATION

<a
style="display:block;width:520px;height:330px"
id="player"
></a>
<script>
$f("player", "Player/flowplayer-3.2.5.swf", {
playlist:[
{
url: 'Videos/my_video.flv',
xttype: 'video',
xtn2: '',
xtrichname: 'Video::Label',
xtclink: '',
xtrefresh: '5',
xtduration: '20',
xtquality: '1',
xtstream: '1',
xtlocation: 'int',
xtmode: 'clip',
xtsize: '1701',
xtextension: '7'
}],
plugins: {
ATRichmedia: {
url: 'Plugin_Richmedia/flowplayer.ATRichmedia.swf',
xtplayer:'1'
},
controls: {
url: 'Player/flowplayer.controls.swf',
stop: true
}
}
});
</script>
...
<!-xtnv = document;
//parent.document or top.document or document
xtsd = "http://logxxxx";
xtsite = "xxxx";
xtn2 = "";
// level 2 site ID
xtpage = "content_page";
//page name (with the use of :: to create chapters)
xtdi = "";
//implication degree
//-->
</script>
<script type="text/javascript" src="Scripts/xtcore.js"></script>
19
20

Guide de marquage Rich media

Transcription

Documents pareils

ralentir la lecture des documents avec Windows Media Player

Post Production Conversion de fichiers numériques Création de

1. Ouvrir le lecteur Windows Media Player 11 2. Selectionner menu

OFFRE DE STAGE ASSISTANT CHEF DE PROJET PLUMERIDIA

Organigramme Agence Media.graffle

Lire des vidéos Media Player Classic

Installer Windows Media Player 11 si vous avez des

1.4- Pourquoi et comment communiquer en PME

La publicité transport continue d`afficher une