Ce tutoriel vise à expliquer pourquoi et comment générer différents types de QR-Codes : QR-Codes avec des URL, QR-Codes avec des cartes de visites ou numéros de téléphone, QR-Code avec coordonnées GPS, etc.

1. Créer ses QR-Codes TUTORIEL © Nicolas Monseigne

2. TUTORIEL Un QR-Code, c'est quoi ? C'est une évolution du code-barres. Cela sert principalement à faciliter la vie d'un utilisateur de téléphone mobile, à qui on va éviter : - d'écrire caractère par caractère une adresse web (pas toujours facile sur certains modèles de téléphones, surtout quand on est atteint du syndrome des gros doigts !) - de devoir configurer des coordonnées pour son GPS Cela permet aussi de faciliter certaines actions (par ex "aimer une page Facebook") Un QR-Code, comment ça marche ? Vous allez utiliser un outil pour coder votre information, et le mobinaute va lui utiliser un outil de décodage (qui utilise l'appareil photo de son téléphone), qui va lui indiquer ce qu'il peut faire avec ce QR-Code. Pour encoder ou décoder, on trouve de nombreux outils gratuits. © Nicolas Monseigne

3. TUTORIEL Le QR-Code doit donc être très lisible ! Un QR-Code est composé de carrés, qui représentent les caractères de la donnée codée. En gros, plus il y a de caractères, plus le QR-Code est complexe, donc moins il est lisible ! C'est pour cela qu'il est recommandé d'utiliser des "raccourcisseurs d'URL" quand on veut coder une adresse web. Deux exemples ci-dessous : © Nicolas Monseigne J'accède à la page Facebook "Destination Médoc" en codant l'adresse "http://www.facebook.com/Destination.Medoc " J'accède à cette même page Facebook "Destination Médoc" en codant l'adresse "http://bit.ly/fOKLpq": moins de caractères, QR-Code plus simple ! De plus, un contraste fort entre le fond du QR-Code et le QR-Code lui-même est indispensable (pas de QR noir sur fond bleu marine par ex)

5. Quels QR-Codes ? TUTORIEL © Nicolas Monseigne

6. TUTORIEL Rendez-vous sur http://www.qrstuff.com/ Sur ce site, vous pourrez coder plusieurs types de données… voyons les plus intéressantes… © Nicolas Monseigne

9. QR-Code n°1 Coder une URL TUTORIEL © Nicolas Monseigne

10. Etape 1, sélectionner le type de données : l'URL  Etape 2, vous indiquez l'adresse web à coder  . Comme vu précédemment, préférez la version raccourcie en cochant "Rewrite URL to qrs.ly short format"  A noter que vous pouvez effectuer un suivi statistique du nombre de fois où votre code a été flashé (cliquez sur "subscribe now") Etape 3, sélectionnez la couleur  , soit en cliquant directement dans le carré, soit en renseignant le code hexa (utile si vous devez utiliser une charte graphique) Etape 4, téléchargez le QR-Code  , pour l'intégrer sur vos supports papier ou web, ou le transmettre à votre graphiste/imprimeur © Nicolas Monseigne      TUTORIEL

11. Cette utilisation est intéressante, particulièrement dans le cas de sites internet adaptés pour la consultation sur téléphones mobiles. Une autre utilisation est de faciliter le recueil d'avis des touristes en mobilité (ex. ici avec un QR-Code dirigeant le mobinaute vers une page du site TripAdvisor où il pourra donner son avis. A noter que ce genre de démarche peut nécessiter au préalable de renseigner une fiche sur son établissement sur le site d'avis en question… © Nicolas Monseigne TUTORIEL Nous espérons vous avoir donné pleinement satisfaction. N'hésitez pas à donner votre avis !

12. QR-Code n°2 Coder un numéro de téléphone TUTORIEL © Nicolas Monseigne

14. QR-Code n°3 Coder une carte de visite TUTORIEL © Nicolas Monseigne

15. Toujours la même logique… Le conseil évident, en bas de la colonne de données à coder : choisissez l'option "Link to VCF file for download". Le mobinaute pourra alors télécharger votre carte de visite, qui est hébergée sur le site qrstuff.com © Nicolas Monseigne TUTORIEL     Les données de la carte de visite codées "brutes" => QR-Code illisible ! On a donc ici un simple lien de téléchargement de votre carte de visite

16. QR-Code n°4 Coder des coordonnées GPS TUTORIEL © Nicolas Monseigne

17. Toujours la même logique… D'abord choisissez le bouton "Google Maps Location"  Puis cliquez sur la carte  à l'endroit que vous souhaitez coder, ou entrez directement les coordonnées GPS si vous les connaissez. Le téléphone situera alors le point GPS sur le navigateur du téléphone ou sur une application GPS dédiée (ex. Google Maps mobile) © Nicolas Monseigne TUTORIEL  

18. QR-Code n°5 Des liens dynamiques vers les réseaux sociaux TUTORIEL © Nicolas Monseigne

19. Etape 1, sélectionnez le type de données : social media  Etape 2. Parmi les possibilités, nous allons rester sur le plus typique, celui d'une page Facebook que l'on veut voir aimée par le mobinaute. Dans la rubrique "Facebook like", vous indiquez l'adresse web de cette page  . Comme vu précédemment, préférez la version raccourcie en cochant "Rewrite URL to qrs.ly short format"  En flashant ce Qr-Code, le mobinaute verra une page web s'ouvrir, et se verra proposé de simplement "cliquer" sur le bouton "J'aime", avec le nom de la page rappelé à côté (d'où l'intérêt de le renseigner  ) © Nicolas Monseigne    TUTORIEL 

20. QR-Code n°6 Un QR-Code avec un lien internet et un logo ! TUTORIEL © Nicolas Monseigne

21. Prérequis… Pour réaliser ce QR-Code, il vous faut que votre logo ait des dimensions comprises entre 100 et 400 px, de format .JPG ou .PNG, et que l'image ne pèse pas plus de 1 Mo. Pour connaître les dimensions de son image, faire un clic droit sur le fichier puis "Propriétés"  , et dans la boîte de dialogue qui s'ouvre, les dimensions apparaissent dans l'onglet "Résumé"  . Si vous avez besoin de redimensionner votre logo, vous pouvez utiliser un logiciel gratuit, (ex : VSO Image Resizer). © Nicolas Monseigne   TUTORIEL

22. On peut donc maintenant réaliser son QR-Code… Direction cette fois le site http:// soqr.fr/generateur-qr-code/logo-image-qrcode-generator.php © Nicolas Monseigne TUTORIEL       Vous commencez par charger votre logo  , puis vous mentionnez l'URL à coder  . Comme précédemment, utilisez la fonction de raccourcisseur d'URL  . En bonus, vous avez le choix  entre un QR-Code "carré" ou "arrondi" (l'exemple ici). Il vous suffit enfin de valider  . Notez que l'URL raccourcie vous est donnée  . N'hésitez pas à l'ajouter en complément de votre QR-Code : si votre mobinaute n'a pas d'application de lecture de QR-Code sous la main, il pourra toujours taper cette adresse courte directement dans son navigateur mobile !

23. D'autres infos etourisme sur Twitter : @mon_etourisme TUTORIEL © Nicolas Monseigne Fin du tutoriel