Blogger
Viti-Vino - Les outils Google pour Blogger

Les trucs et astuces pour Blogger. Pour personnaliser son Blog. Un complément de l'aide en ligne.




2010/03/07

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

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éphoneLecteur
iPhoneI-nigma
SmartphoneQuickmark
AutresKaywa


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 :

Encépagement : vins rouges 2008


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

QR code - Texte Blog de Prac



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

QR code - Wine label



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" />



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



Rechercher sur le Blog de Prac avec Google CSE