Un code QR sur ses pages - Créer des liens pour son téléphone mobile

Le QR-Code (Quick Response) est un code-barres à 2 dimensions permettant d'accéder à un contenu numérique sur son mobile, simplement en le photographiant. Pour que cela fonctionne, il faut que le téléphone mobile soit équipé de l'application qui scanne le code.

Le QR-Code (Quick Response) est un code-barres à 2 dimensions permettant d'accéder à un contenu numérique sur son mobile, simplement en le photographiant. Pour que cela fonctionne, il faut que le téléphone mobile soit équipé de l'application qui scanne le code. Le tableau suivant indique les lecteurs à télécharger selon le type de téléphone mobile :

Téléphone	Lecteur
iPhone	I-nigma
Smartphone	Quickmark
Autres	Kaywa

Une fois le logiciel téléchargé et installé, on peut photographier le QR-Code. Celui-ci est traduit s'il s'agit d'un texte, ou ouvre la page Internet s'il s'agit d'une adresse URL.

Utiliser Google Chart API

Google Chart API met à disposition les outils nécessaires à la création d'objets graphiques.
Le principe de fonctionnement de ces outils est de créer une URL avec les paramètres du graphique. Cette adresse génère une image qu'il suffit d'afficher sur le Blog. Prenons l'exemple d'un graphique en gâteau :



source : Site Salvagnin, Encépagement Canton de Vaud, 2008

L'url du graphique

http://chart.apis.google.com/chart?
cht=p3
&chs=520x208
&chd=t:43.0,37.0,10.0,8.0,2.0
&chl=43%%7C37%%7C10%%7C8%%7C2%
&chdl=Pinot+Noir%7CGamay%7CGamaret%7CGaranoir%7CAutres
&chtt=Enc%C3%A9pagement+:+Vins+rouges+2008
&chco=4f81bd,c0504d,9bbb59,8064a2,4bacc6

Les paramètres

cht=p3 : Le type de graphique (Pie Chart - 3D)
chs=520x208 : la taille du graphique
chd=t:43.0,37.0,10.0,8.0,2.0 : les valeurs à représenter (43, 37, 10, 8 et 2)
chl=43%%7C37%%7C10%%7C8%%7C2% : les étiquettes du graphique séparées par le caractère pipe (%7C)
chdl=Pinot+Noir%7CGamay%7CGamaret%7CGaranoir%7CAutres : les légendes séparées par le caractère pipe (%7C)
chtt=Enc%C3%A9pagement+:+Vins+rouges+2008 : la légende du graphique (URL encodée)
chco=4f81bd,c0504d,9bbb59,8064a2,4bacc6 : les couleurs du graphique (selon le code rrggbb)

Le QR Code avec Google Chart API

Pour créer un QR-Code il suffit d'utiliser un graphique de type qr


Les paramètres du QR-Code

cht=qr : le type du graphique
chs=150x150 : la taille du QR-Code
chl=le contenu du QR-Code
choe=UTF-8 : l'encodage utilisé
chld=Q : niveau de la correction d'erreurs (Q permet de traduire un QR-Code dont 25% de la surface est illisible)

Un QR-Code avec du texte

Le QR-Code suivant encode la description du Blog : Viti-Vino. Le Blog de Prac - Les Outils Google. Pour personnaliser son blog. Un complément de l'aide en ligne. Les trucs et astuces pour Blogger. Les exemples du Forum d'Aide pour Blogger




Le code html du QR-Code avec du texte

<img src="http://chart.apis.google.com/chart?chs=150x150&amp;cht=qr&amp;chl=Viti-Vino. Le Blog de Prac - Les Outils Google. Pour personnaliser son blog. Un complément de l'aide en ligne. Les trucs et astuces pour Blogger. Les exemples du Forum d'Aide pour Blogger&amp;choe=UTF-8&amp;chld=Q" style="border: 1px solid #000; padding: 5px;" alt="QR code - Texte Blog de Prac" title="QR code - Texte Blog de Prac" />

Un QR-Code avec une adresse URL

Le QR-Code suivant encode l'adresse Internet du gadget Etiquettes de Vin




Le code html du QR-Code avec une adresse URL

<img src="http://chart.apis.google.com/chart?chs=150x150&amp;cht=qr&amp;chl=http://www.liens-du-vin.ch/_wine-pictures/wine-label-iphone.htm&amp;choe=UTF-8&amp;chld=Q" style="border: 1px solid #000; padding: 5px;" alt="QR code - Wine label" title="QR code - Wine label"/>

Un QR Code avec Google URL Shortener

Depuis le 1er octobre 2010, le service de raccourcissement d'URL de Google, goo.gl (gl est l'extension du Groenland) permet de créer une URL courte, de la forme http://goo.gl/vBqG.

Une fois connecté sous son compte Google, le service information donne accès aux statistiques d'utilisation de l'URL abrégée, ainsi qu'au code QR de l'URL raccourcie.

En pratique, Google URL Shortener permet de raccourcir l'URL suivante : 

maps.google.ch/maps/ms?hl=fr
&ie=UTF8
&t=h
&msa=0
&msid=102376698569738400439.00049087972194c5318f2
&ll=46.325831,6.962242&
spn=0.082979,0.145912
&z=12
&output=embed

Nous obtenons l'abrégé :

goo.gl/0hvD

la page d'information de cet abrégé, sous Google Shortener, affiche un QR Code, disponible à cette adresse :

goo.gl/0hvD.qr

C'est l'image du QR code qu'il suffit d'afficher à l'aide d'un tag img :

<img src="http://goo.gl/0hvD.qr" style="border: 1px solid #000; padding: 5px;" alt="QR code - Google Maps - Badouxthèque" title="QR code - Google Maps - Badouxthèque" />

Plus d'informations

Le Code QR sur Wikipédia

Les outils graphiques de Google

Raccourcir ses URL avec Google URL Shortener