Aller au contenu principal
Comment ajouter des liens et des vidéos à votre flipbook

Tutoriel, Flipbooks, InteractivitéComment ajouter des liens et des vidéos à votre flipbook
Robert Soares Par : Robert Soares     |    

Un flipbook sans liens n’est qu’un PDF avec une animation qui tourne les pages. C’est plus joli, certes, mais le lecteur ne peut toujours rien faire. Il ne peut pas cliquer sur votre numéro de téléphone pour vous appeler. Il ne peut pas regarder la démonstration de votre produit sans changer d’onglet. Il ne peut pas toucher une zone de votre plan pour en connaître la superficie.

L’interactivité change toute la dynamique. L’équipe de The Modern Muse le résume bien : « Issuu permet à notre magazine de devenir interactif ; les lecteurs peuvent cliquer sur des liens pour approfondir certains sujets et acheter les marques que nous présentons. » Ce passage de la lecture au clic distingue un document que l’on parcourt rapidement d’un document que l’on utilise vraiment.

Les chiffres d’engagement le confirment. Linearity a compilé plusieurs études selon lesquelles les contenus interactifs génèrent 52,6 % d’engagement de plus que les formats statiques, avec 13 minutes de consultation en moyenne contre 8,5 minutes pour les contenus statiques. La raison est intéressante : chaque élément cliquable impose une microdécision, et les décisions maintiennent l’attention. Faire défiler est passif. Cliquer est actif.

L’ensemble de l’opération prend environ cinq minutes, dont la majeure partie sert à décider où placer les éléments plutôt qu’à comprendre le fonctionnement des outils.

Le fonctionnement concret des liens dans l’éditeur

Ouvrez votre projet dans l’éditeur Flipbooker, sélectionnez l’outil de lien dans la barre d’outils — l’icône en forme de chaîne à gauche — puis tracez un rectangle sur l’élément à rendre cliquable. Il peut s’agir d’un bouton créé dans votre PDF, d’un numéro de téléphone, d’une adresse e-mail ou d’une photo de votre boutique. Peu importe ce qui se trouve en dessous pour l’éditeur : vous définissez simplement une zone cliquable.

Une fois la zone tracée, une fenêtre vous demande où doit mener le clic. Quatre options s’offrent à vous : une URL web, une adresse e-mail (mailto:), un numéro de téléphone (tel:) ou une autre page du flipbook. Choisissez l’option, collez ou saisissez la destination, enregistrez, et c’est terminé.

L’erreur vient souvent de la destination. Certains relient leur bouton « Nous contacter » à la page d’accueil plutôt qu’au véritable formulaire de contact. D’autres relient l’image d’un produit à la page principale du catalogue plutôt qu’à la fiche correspondante. Chaque lien doit conduire le lecteur exactement là où il pensait arriver en cliquant. S’il doit chercher après le clic, l’interaction est gâchée. Cela paraît évident, mais ouvrez n’importe quelle brochure numérique : vous trouverez presque toujours au moins un lien qui débouche sur une page trop vague.

L’autre erreur fréquente concerne la visibilité. Sur ordinateur, vous pouvez ajouter un effet de survol pour que le curseur change lorsqu’il passe sur une zone cliquable. Cela fonctionne bien. Mais le survol n’existe pas sur téléphone. Si vos lecteurs sont sur mobile — et c’est probablement le cas de plus de la moitié d’entre eux —, ils ont besoin d’un repère visuel directement intégré à la mise en page. Une petite icône superposée, une bordure colorée, la mention « touchez ici ». N’importe quoi de suffisamment clair. Sinon, les liens que vous avez soigneusement placés restent invisibles.

Et les vidéos ?

Les vidéos sont encore plus simples que les liens. Sélectionnez l’outil vidéo, cliquez à l’endroit voulu sur la page, collez une URL YouTube ou Vimeo, puis redimensionnez l’emplacement pour l’adapter à votre mise en page. C’est tout.

La vraie décision porte sur la lecture automatique. La plupart des navigateurs bloquent la lecture automatique avec le son. Même si vous l’activez, elle ne fonctionnera donc pas comme vous l’imaginez. La lecture automatique sans son est techniquement possible, mais souvent agaçante. Une courte boucle silencieuse sur une couverture peut fonctionner comme arrière-plan d’ambiance. Dans tous les autres cas, laissez le lecteur appuyer sur Lecture lorsqu’il le souhaite.

Bon à savoir : intégrer une vidéo depuis YouTube ou Vimeo n’augmente pas la taille du fichier de votre flipbook, car la vidéo est diffusée depuis leurs serveurs. Si vous importez directement un fichier vidéo dans Flipbooker, son poids est comptabilisé. Gardez ces vidéos courtes, idéalement 30 secondes ou moins.

Les zones interactives ouvrent davantage de possibilités

Les liens et les vidéos sont des outils simples. Les zones interactives sont plus créatives et, à mon avis, sous-utilisées parce que leur intérêt n’est pas toujours évident au premier regard.

Une zone interactive est une surface cliquable invisible qui déclenche une action lorsqu’on la touche. Elle peut afficher une fenêtre avec davantage de détails, ouvrir un lien, lancer une vidéo en surimpression, accéder à une autre page ou afficher une infobulle.

Imaginez une brochure immobilière avec un plan. Sans zones interactives, c’est un joli dessin. Avec elles, le lecteur touche la suite parentale et découvre ses dimensions, ses finitions et une galerie de photos. Il touche la cuisine et consulte les caractéristiques de l’électroménager. Le plan entier devient une carte interactive qui remplace six pages de texte supplémentaires.

Prenons aussi le cas d’un catalogue de produits. Newell Brands, l’entreprise derrière Sharpie, Rubbermaid et une centaine d’autres marques, a remplacé ses catalogues imprimés par des versions numériques interactives. Lars Herzog, responsable du marketing numérique et en ligne pour la région EMEA, explique leur raisonnement : « Grâce aux catalogues interactifs, nos produits attirent davantage les destinataires et, à terme, nous en vendons plus. » Des zones interactives placées sur les images de produits peuvent afficher le prix, les caractéristiques ou un lien direct de commande. Voilà une utilité qui justifie les dix minutes de configuration supplémentaires.

Le principal piège : ces zones doivent être assez grandes pour être touchées avec le pouce sur l’écran d’un téléphone. C’est là que beaucoup se trompent. Une zone de 20 pixels de large peut sembler correcte sur l’écran d’ordinateur utilisé pour la mise en page. Sur un iPhone, elle est presque impossible à toucher. Voyez plus grand que nécessaire et prévisualisez toujours le résultat sur votre téléphone avant de publier. Si vous devez zoomer pour toucher un élément, il est trop petit.

Les erreurs les plus fréquentes

Le problème le plus courant n’est pas technique, mais éditorial. Parce que l’option existe, certains ajoutent de l’interactivité partout, et le résultat devient encombré. Avec dix liens sur une même page, personne ne sait où cliquer en premier. Trois vidéos empilées sur une même double page : aucune ne sera regardée.

Limitez-vous à deux ou trois interactions par page. Demandez-vous ce que le lecteur doit faire sur cette page précise. Vous appeler ? Rendez le numéro cliquable. Regarder une démonstration ? Intégrez une vidéo, pas trois. En savoir plus sur un produit ? Ajoutez une zone interactive avec une fenêtre de détails. Tout le reste est superflu.

L’autre erreur consiste à ignorer totalement le mobile : effets de survol, cibles minuscules, vidéos affichées aux dimensions prévues pour un ordinateur. Plus de la moitié de votre audience consultera le document sur un téléphone ou une tablette, et tout doit fonctionner sans souris. Les cibles tactiles doivent mesurer au moins 44 × 44 pixels et respecter les recommandations WCAG relatives à leur taille. Testez aussi le résultat sur un vrai téléphone, pas uniquement dans le mode adaptatif du navigateur.

En cas de problème

Les liens ne mènent nulle part. Il s’agit presque toujours d’un problème de format d’URL. Vérifiez que les liens web commencent bien par https://. Testez également la destination dans un navigateur. Un lien vers une page introuvable est pire que l’absence de lien : le lecteur a essayé d’interagir et n’a rien obtenu.

Le lecteur vidéo reste vide. Vérifiez que l’URL YouTube ou Vimeo est un lien de lecture standard, et non une URL raccourcie ou d’intégration. Pour les vidéos privées ou non répertoriées, il peut aussi être nécessaire de modifier les paramètres de partage afin qu’elles puissent être lues dans un flipbook.

Les zones interactives n’enregistrent aucun clic. Si vos données analytiques montrent qu’une zone existe mais que personne ne la touche, elle manque de visibilité. Ajoutez une animation pulsée, une icône ou simplement le texte « touchez pour afficher les détails ». Les zones interactives invisibles ne fonctionnent que dans les jeux vidéo, pas dans les documents professionnels.

Les éléments interactifs se superposent. Utilisez les commandes de calques de l’éditeur pour régler leur ordre d’empilement. Les liens doivent se trouver sur le calque supérieur afin d’enregistrer les clics avant les éléments placés dessous.

Un point de départ concret

Si vous n’avez encore jamais ajouté d’interactivité à un flipbook, commencez par un lien et une vidéo dans un seul document. Le lien doit mener vers la page que vous souhaitez le plus voir consultée après la lecture : votre formulaire de contact, votre page de tarifs ou votre outil de prise de rendez-vous. La vidéo doit remplacer une section difficile à expliquer par écrit, comme une démonstration de produit ou une présentation de l’équipe.

Une fois que tout fonctionne et que vous avez vérifié le résultat sur ordinateur comme sur mobile, ajoutez progressivement d’autres éléments. Les meilleurs flipbooks interactifs ne sont pas ceux qui contiennent le plus d’éléments cliquables. Ce sont ceux dans lesquels chaque interaction a une raison d’être.

Pour en savoir plus sur la création de flipbooks, consultez le guide complet du flipbook ou découvrez toutes les possibilités offertes par l’éditeur.

FAQs

Combien de liens faut-il ajouter par page ?

Il n’y a pas de limite stricte, mais 3 à 5 est un bon équilibre. Au-delà, les lecteurs ne savent plus où cliquer en premier. Retenez les interactions les plus importantes pour chaque page.

Les vidéos intégrées augmentent-elles la taille du fichier de mon flipbook ?

Non, si vous les intégrez depuis YouTube ou Vimeo. La vidéo est diffusée depuis leurs serveurs. Les vidéos importées directement dans Flipbooker augmentent en revanche la taille du fichier : mieux vaut donc les garder courtes.

Les liens et les zones interactives fonctionnent-ils sur mobile ?

Oui. Mais testez-les. Les zones interactives doivent être assez grandes pour être touchées avec le pouce, et les effets de survol n’existent pas sur les écrans tactiles. Ajoutez des repères visuels, comme des icônes ou des animations pulsées, pour que les lecteurs sur mobile comprennent qu’un élément est tactile.

Puis-je savoir quels liens ont été cliqués ?

Oui. Les données analytiques de Flipbooker indiquent quels liens ont été cliqués et par qui. C’est utile pour les propositions commerciales, lorsque vous voulez savoir si un destinataire a consulté votre page de tarifs.

Faut-il lancer automatiquement les vidéos ?

Rarement. La plupart des navigateurs bloquent de toute façon la lecture automatique avec le son, et même sans son, elle peut paraître intrusive. Laissez les lecteurs choisir de lancer la vidéo. Seule exception possible : une courte boucle silencieuse en arrière-plan sur une page de couverture.