Comment créer un site Web in­te­rac­tif avec du contenu per­for­mant ?

Le contenu in­te­rac­tif constitue un levier essentiel pour informer les visiteurs d’un site Web, mais aussi les divertir et les impliquer ac­ti­ve­ment. Aujourd’hui plus que jamais, il est important de proposer des contenus et des éléments uniques et de qualité afin de se démarquer du­ra­ble­ment.

Résumé ⓘ

• Les formats in­te­rac­tifs trans­for­ment la con­sul­ta­tion en par­ti­ci­pa­tion.
• Choi­sis­sez vos outils selon le format, le budget et les fonc­tion­na­li­tés né­ces­saires.
• Le RGPD encadre le trai­te­ment des données per­son­nelles.
• Préservez l’équilibre entre in­for­ma­tion et di­ver­tis­se­ment.

Pourquoi un site Web in­te­rac­tif est-il important ?

Le principe est simple : le contenu in­te­rac­tif sollicite les uti­li­sa­teurs à plusieurs niveaux. Les visiteurs ne se con­ten­tent plus de lire un texte ou de regarder une image. Par leurs actions, ils peuvent in­fluen­cer di­rec­te­ment un élément, accéder à des in­for­ma­tions sup­plé­men­taires ou exprimer leurs propres idées. De cette manière, le contenu devient une ex­pé­rience et s’ancre plus du­ra­ble­ment dans la mémoire.

L’in­te­rac­tion avec un tel site Web, et donc avec les marques ou les services qui le composent, est nettement plus intense qu’une simple con­sul­ta­tion passive. La pro­ba­bi­lité que l’uti­li­sa­teur soit satisfait et réalise l’action souhaitée augmente, tout comme le temps passé sur le site.

Quels formats de contenu in­te­rac­tif existent ?

Il existe de nom­breuses façons de concevoir un site Web in­te­rac­tif, avec des niveaux d’effort variables pour l’intégrer à votre propre projet Web. Selon le format choisi, des outils très dif­fé­rents ou des com­pé­tences en pro­gram­ma­tion spé­ci­fiques sont né­ces­saires. Cela signifie que les coûts peuvent varier fortement d’un type de contenu à l’autre. Le tableau suivant présente quelques solutions courantes pour intégrer des contenus in­te­rac­tifs sur un site Web :

Quel est le rôle du RGPD dans la création de contenu in­te­rac­tif ?

Lors de l’uti­li­sa­tion d’outils in­te­rac­tifs col­lec­tant ou traitant des données uti­li­sa­teur, il est in­dis­pen­sable de respecter les exigences du Règlement général sur la pro­tec­tion des données (RGPD). Le contenu in­te­rac­tif, comme les sondages, les quiz, les for­mu­laires ou l’in­té­gra­tion d’API externes et d’iFrames, peut impliquer le trai­te­ment de données à caractère personnel. Les en­tre­prises doivent informer les uti­li­sa­teurs de la nature du trai­te­ment, disposer d’une base juridique au titre de l’article 6 — le con­sen­te­ment étant l’une des bases possibles — et assurer la sécurité des données.

Les uti­li­sa­teurs disposent de droits d’accès, de rec­ti­fi­ca­tion et d’ef­fa­ce­ment dans les con­di­tions prévues aux articles 15 à 17 du RGPD. Selon l’article 3, le règlement s’applique notamment aux trai­te­ments effectués dans le cadre des activités d’un éta­blis­se­ment dans l’UE et, sous certaines con­di­tions, à l’offre de biens ou de services aux personnes se trouvant dans l’UE ou au suivi de leur com­por­te­ment dans l’UE. Le respect du RGPD contribue aussi à instaurer la confiance et à protéger la vie privée des uti­li­sa­teurs.

Quels sont les meilleurs outils pour créer du contenu in­te­rac­tif ?

Tous les types de contenus présentés né­ces­si­tent un effort nettement plus important que du contenu texte et image classique. Les coûts sont également plus élevés, notamment en raison des outils ou des services requis pour créer des éléments in­te­rac­tifs. Si vous ne disposez pas d’une expertise en pro­gram­ma­tion de jeux, mais souhaitez intégrer un jeu à votre site Web, il est souvent né­ces­saire de faire appel à une agence externe.

Il en va de même pour les vidéos 360° pro­fes­sion­nelles, qui demandent bien plus de travail qu’il n’y paraît au premier abord. Le besoin en équi­pe­ment de haute qualité et le temps consacré à la post­pro­duc­tion des images brutes en­traî­nent ra­pi­de­ment des coûts à cinq chiffres, et ce pour seulement quelques minutes de film.

En revanche, certains types de contenu in­te­rac­tif, comme les gra­phiques in­te­rac­tifs, les quiz ou les dia­po­ra­mas, peuvent souvent être réalisés sans recourir à des pres­ta­taires externes. Dans ce cas, il suffit de disposer d’un bon concept et de l’outil adapté. Nous pré­sen­tons donc ci-dessous une sélection d’outils par­ti­cu­liè­re­ment in­té­res­sants.

ThingLink

En 2011, l’en­tre­prise fin­lan­daise ThingLink a lancé le logiciel Rich Media Tags, qui per­met­tait d’enrichir des images sur des sites Web et des pla­te­formes de réseaux sociaux. Depuis, l’équipe de dé­ve­lop­pe­ment a con­ti­nuel­le­ment fait évoluer l’ap­pli­ca­tion Web, qui porte désormais elle aussi le nom de l’en­tre­prise, ThingLink. Il est aujourd’hui possible d’enrichir des images et des gra­phiques avec des éléments sup­plé­men­taires tels que des zones de texte, des images, de la musique, des vidéos ou des liens.

Pour cela, l’uti­li­sa­teur dispose d’un éditeur Web intuitif, assisté par IA, dans lequel l’image d’origine peut être importée sim­ple­ment par glisser-déposer. Les boutons per­son­na­li­sables ajoutés indiquent ensuite au visiteur où se trouvent les éléments de contenu in­te­rac­tif.

L’éditeur d’images peut être utilisé dans le cadre d’un essai gratuit. La version de base propose des boutons standard de dif­fé­rentes couleurs pour signaler les éléments in­te­rac­tifs. Le nombre de vues au­to­ri­sées dépend de la formule choisie et des con­di­tions en vigueur du four­nis­seur.

Les offres pro­fes­sion­nelles de ThingLink com­pren­nent Team à partir de 425 € par mois et Business à partir de 1 300 € par mois, dans les deux cas avec fac­tu­ra­tion annuelle. L’offre En­ter­prise fait l’objet d’un devis. Les fonc­tion­na­li­tés et les quotas dépendent de la formule choisie.

Infogram

Pour présenter des données de manière visuelle et at­trayante tout en intégrant des éléments in­te­rac­tifs, Infogram constitue une solution par­ti­cu­liè­re­ment adaptée. Ce service Web ap­par­tient aujourd’hui à l’en­tre­prise Prezi, connue notamment pour son logiciel de pré­sen­ta­tion du même nom.

L’ap­pli­ca­tion Infogram met à dis­po­si­tion de nombreux modèles et com­po­sants per­met­tant de créer des in­fo­gra­phies, cartes ou dia­grammes in­te­rac­tifs. Ceux-ci peuvent être enrichis avec vos propres jeux de données, soit ma­nuel­le­ment, soit via des fonctions d’import. Des in­ter­faces avec Google Drive, Google Sheets, Dropbox et OneDrive sont dis­po­nibles. Une fois finalisés, les gra­phiques peuvent être intégrés à un projet Web à l’aide d’un code d’in­té­gra­tion ou té­lé­char­gés au format JPG ou PNG, cette dernière option étant réservée aux offres payantes.

La version Basic d’Infogram est gratuite et destinée à un usage personnel, selon la FAQ du four­nis­seur. Les en­tre­prises doivent souscrire une offre payante. Son périmètre reste toutefois limité : seules quelques cartes, notamment les États-Unis, l’Europe et l’Afrique, ainsi qu’un nombre restreint d’icônes et d’images sont ac­ces­sibles. Les projets doivent être en­re­gis­trés de manière publique.

Pour créer des projets privés et bé­né­fi­cier de l’accès à plus d’un million d’images et d’icônes, Infogram propose des formules payantes : Pro (jusqu’à 100 projets, 19 $ par mois), Business (jusqu’à 1 000 projets, 67 $ par mois) et Team (149 $ par mois). Ces montants sont facturés an­nuel­le­ment et s’entendent hors taxes. En­ter­prise permet de créer 10 000 projets ou plus, avec un prix sur demande. Les formules Business, Team et En­ter­prise per­met­tent d’utiliser votre propre logo.

Qzzr

Qzzr est un outil puissant pour créer des quiz, des sondages et des tops per­son­na­li­sés. Cette solution permet de concevoir en très peu de temps des questions, des choix de réponses, des des­crip­tions ex­pli­ca­tives et des conseils. L’ajout d’images, de vidéos ou de fichiers audio enrichit encore le contenu in­te­rac­tif. Les contenus finalisés peuvent être mis en lien, intégrés di­rec­te­ment au projet Web via un code d’in­té­gra­tion ou, à défaut, partagés en un clic sur dif­fé­rents réseaux sociaux. De plus, ils sont au­to­ma­ti­que­ment optimisés pour les appareils mobiles.

Qzzr permet non seulement de créer du contenu in­te­rac­tif, mais fournit aussi des sta­tis­tiques dé­tail­lées sur les activités des uti­li­sa­teurs. Il est ainsi possible de savoir combien d’uti­li­sa­teurs ont terminé un quiz ou participé à un sondage, le temps moyen né­ces­saire et si le contenu a été complété jusqu’au bout, via le taux de com­plé­tion. Si un Call-To-Action (CTA) est associé au contenu, le taux de con­ver­sion est également mesuré.

Qzzr propose 300 com­plé­tions gratuites sans limite de temps. L’abon­ne­ment coûte ensuite 9 € par mois, avec 1 000 com­plé­tions incluses. Chaque tranche de 1 000 com­plé­tions sup­plé­men­taires coûte 5 €.

Cincopa

Le four­nis­seur de pla­te­forme mul­ti­mé­dia Cincopa, fondé en 2006, propose des solutions pour intégrer et gérer des contenus médias dans des projets Web. Les uti­li­sa­teurs peuvent ainsi enrichir leur site Web avec des portails vidéo, des podcasts ou des dia­po­ra­mas per­son­na­li­sés. À cette fin, Cincopa met à dis­po­si­tion, d’une part, des éditeurs Web dédiés per­met­tant de créer le contenu in­te­rac­tif souhaité. D’autre part, l’en­tre­prise fournit les res­sources d’hé­ber­ge­ment né­ces­saires pour les fichiers médias utilisés, ma­jo­ri­tai­re­ment hébergés sur des serveurs situés hors de l’UE, notamment aux États-Unis, ce qui peut avoir des im­pli­ca­tions en matière de con­for­mité RGPD.

Plusieurs options d’in­té­gra­tion sont proposées pour les contenus finalisés, par exemple via un code HTML, une landing page, un lien direct ou un plugin spé­ci­fique au CMS utilisé, dont WordPress, Joomla, Blogger, Drupal ou Wix.

Pour concevoir le contenu in­te­rac­tif média souhaité, il est possible de choisir parmi divers templates, notamment pour des collages, des dia­po­ra­mas, des lecteurs vidéo, des playlists ou des timelines. Cincopa propose un essai gratuit de 14 jours.

Les offres de Cincopa com­pren­nent Starter à 99 $ par mois, Growth à 350 $ par mois et En­ter­prise sur devis.

Adobe Express (an­cien­ne­ment Adobe Spark)

Adobe est notamment connu pour sa Creative Cloud, an­cien­ne­ment Creative Suite. Avec Adobe Express, l’éditeur de logiciels propose une solution per­for­mante pour le sto­ry­tel­ling visuel et la création de contenus sur le Web. Qu’il s’agisse d’optimiser une photo avec du texte et des filtres de design, de créer des clips pu­bli­ci­taires ou in­for­ma­tifs, ou de présenter des contenus sous une forme at­trayante basée sur des pages, les pos­si­bi­li­tés sont nom­breuses. Adobe Express s’intègre en outre de manière fluide à la Creative Cloud ainsi qu’à Adobe Stock.

Pour enrichir vos projets, vous pouvez importer et utiliser vos propres images. Il est également possible de créer des titres, des blocs de texte et des boutons, puis de les po­si­tion­ner librement. Le choix d’un thème permet en outre d’in­fluen­cer l’apparence générale. Les clips peuvent être intégrés en indiquant l’URL cor­res­pon­dante. Les contenus finalisés peuvent être partagés via un lien généré au­to­ma­ti­que­ment, envoyés par email ou intégrés à votre site Web à l’aide d’un code. L’uti­li­sa­tion d’Adobe Express est gratuite, mais certaines fonc­tion­na­li­tés, comme la sup­pres­sion du branding, sont réservées aux abon­ne­ments payants.

RacontR

RacontR est aujourd’hui une agence spé­cia­li­sée dans les ex­pé­riences in­te­rac­tives. Elle s’appuie notamment sur sa pla­te­forme pro­prié­taire Codr pour réaliser des projets sur mesure, plutôt que sur l’ancien modèle d’outil en libre-service.

L’ac­com­pag­ne­ment et les fonc­tion­na­li­tés de chaque réa­li­sa­tion sont définis avec l’agence selon les besoins du projet. Cette offre ne cor­res­pond donc pas à un abon­ne­ment en libre-service donnant au­to­ma­ti­que­ment accès à tous les éditeurs ou à une pu­bli­ca­tion illimitée.

Mapme

Avec l’éditeur Web Mapme, il est possible de créer des cartes Web de haute qualité sans con­nais­sances en pro­gram­ma­tion. Les uti­li­sa­teurs peuvent choisir entre dif­fé­rents styles, par exemple une vue satellite, un fond routier ou une carte axée sur la nature. Le nombre de lieux dépend de l’abon­ne­ment ; le forfait Expert permet d’ajouter jusqu’à 500 lieux par carte.

L’apparence des points peut être per­son­na­li­sée et, dans les formules Premium, remplacée par des icônes propres à votre marque. Il est également possible d’enrichir chaque point avec des images, des fichiers audio ou vidéo, ainsi que des boutons de réseaux sociaux. En fonction de la mise en page sé­lec­tion­née, les in­for­ma­tions s’affichent soit dans un panneau cou­lis­sant en bas de la carte (Slider Style), soit dans une liste latérale à gauche (List Style).

Mapme propose un essai de 14 jours au­to­ri­sant la pu­bli­ca­tion et l’in­té­gra­tion d’une carte, avec cinq lieux et 100 vues. Les forfaits Starter, Pro­fes­sio­nal et Expert coûtent res­pec­ti­ve­ment 30, 55 et 110 $ par mois avec fac­tu­ra­tion annuelle, ou 50, 90 et 180 $ avec paiement mensuel. En­ter­prise est proposé sur demande. Les options de per­son­na­li­sa­tion CSS, de branding et les autres fonc­tion­na­li­tés sont à vérifier dans le détail de chaque formule.

Quelles sont les bonnes pratiques à suivre ?

Les outils présentés offrent de nom­breuses pos­si­bi­li­tés pour rendre une présence Web plus dynamique, même avec des moyens tech­niques simples et un budget limité. Les en­tre­prises disposant de res­sources plus im­por­tantes peuvent confier la con­cep­tion et la main­te­nance de contenus in­te­rac­tifs à des agences spé­cia­li­sées. Dans tous les cas, le contenu in­te­rac­tif apporte une réelle valeur ajoutée à une présence Web, à condition d’être utilisé de manière ciblée et de ne pas détourner l’attention du produit ou du service proposé.

L’enjeu consiste donc à créer un cadre adapté à chaque format et à trouver le bon équilibre entre in­for­ma­tion et di­ver­tis­se­ment. Plusieurs sites Web y par­vien­nent par­ti­cu­liè­re­ment bien :

• Airbnb : à travers des in­fo­gra­phies in­te­rac­tives mêlant images, ani­ma­tions et cartes, la pla­te­forme illustre par exemple l’impact éco­no­mique de son activité sur des villes comme Paris. Airbnb mise également sur des contenus per­son­na­li­sés et pilotés par les données, comme des re­com­man­da­tions et des aperçus in­te­rac­tifs, afin de rendre l’ex­pé­rience uti­li­sa­teur plus in­di­vi­duelle.
• Nocibé : la page d’accueil de la par­fu­me­rie Nocibé montre l’ef­fi­ca­cité des dia­po­ra­mas dans l’E-commerce. Pro­mo­tions, marques et re­com­man­da­tions produits sont intégrées dans des car­rou­sels in­te­rac­tifs que les visiteurs peuvent parcourir ac­ti­ve­ment. À l’avenir, les tech­no­lo­gies de réalité augmentée devraient encore renforcer cette approche, notamment avec des essayages virtuels ou des mises en situation des produits.
• mymuesli : grâce à son outil de per­son­na­li­sa­tion en ligne, mymuesli permet aux uti­li­sa­teurs de composer leur propre mélange à partir de nombreux in­gré­dients. Une fois le muesli per­son­na­lisé, il peut être commandé, en­re­gis­tré ou partagé. Ce con­fi­gu­ra­teur reste un excellent exemple de per­son­na­li­sa­tion de produit et illustre par­fai­te­ment le potentiel du contenu in­te­rac­tif dans l’E-commerce et l’industrie ali­men­taire.