Comment intégrer un bouton « J’aime » et partage Facebook

Le bouton « j’aime » Facebook, ou like, ne se trouve plus uni­que­ment sur le réseau social ou il est né. Le fameux bouton orne également dif­fé­rents sites Web, blogs et ap­pli­ca­tions Web afin que les visiteurs puissent montrer qu’ils aiment une en­tre­prise, une célébrité ou un contenu. En utilisant le bouton « partage » de Facebook, le contenu in­té­res­sant ou di­ver­tis­sant peut ensuite être partagé avec vos amis : il est encore plus facile de diffuser des marques et des in­for­ma­tions sur le Web. Mais qu’est-ce qui se cache derrière les boutons des médias sociaux, dont l’in­té­gra­tion est devenue in­con­tour­nable pour les opé­ra­teurs de sites Web ? Nous donnons des in­for­ma­tions et vous montrons comment créer vos propres boutons Facebook. Dans ce guide, nous ex­pli­quons également pourquoi l’im­plé­men­ta­tion standard de tels boutons peut être ju­ri­di­que­ment pro­blé­ma­tique, et quelles al­ter­na­tives vous pouvez proposer à leur place.

Les boutons like et share sont devenus des éléments centraux de Facebook. Ces boutons, qui ont fait l’objet de nombreux chan­ge­ments gra­phiques au fil des années, sont le moteur de la diffusion de contenu. Les réseaux sociaux plus récents ont dès le départ adopté le concept et intégré des boutons si­mi­laires. Depuis 2010, il est possible d’intégrer les deux boutons dans des sites Web ex­té­rieurs à Facebook. A cet effet, le géant du Web propose ses propres plug-ins, dont la mise en œuvre ne pose aucun problème : grâce à un con­fi­gu­ra­teur interne, ceux-ci sont adaptés à votre site Web et dis­po­nibles aussi bien en iFrame qu’en ap­pli­ca­tion Ja­vaS­cript. Pour de nombreux systèmes de gestion de contenu, comme WordPress par exemple, il existe également des ex­ten­sions adaptées qui vous aident à intégrer ces éléments.

Les réseaux sociaux sont les canaux idéaux pour diffuser vos propres contenus et maintenir un contact direct avec vos clients, lecteurs ou fans. Facebook offre la base parfaite pour ce faire avec les fonctions « j’aime » et « partager » men­tion­nées ci-dessus ainsi que l’option « com­men­taires ». Ces actions de la part des uti­li­sa­teurs, également appelés social signals ou signaux sociaux, jouent un rôle majeur dans le succès du Web moderne pour plusieurs raisons :  

• Plus vos contenus génèrent de réponses, plus la pro­ba­bi­lité est grande pour que d’autres auteurs, blogueurs ou uti­li­sa­teurs privés les re­mar­quent et se visitent votre site. Vous pouvez ainsi récolter des backlinks utiles et per­ti­nents qui in­fluen­cent po­si­ti­ve­ment votre clas­se­ment dans les moteurs de recherche.

• Les backlinks, mentions « j’aime » et partages aug­men­tent votre portée et votre lé­gi­ti­mité sur les mots-clés per­ti­nents. D’une part, c’est un avantage lorsqu’il s’agit de générer de nouveaux clients, lecteurs ou fans. Enfin, ils ont pro­ba­ble­ment aussi un effet général positif sur la position de votre site Web dans les pages de résultats des moteurs de recherche.

• À long terme, les social signals positifs se tra­dui­sent également par une crois­sance du trafic, un autre élément qui vous aide à obtenir un meilleur clas­se­ment dans les résultats de recherche.

Même si les signaux des uti­li­sa­teurs ne comptent pas comme des facteurs de ré­fé­ren­ce­ment chez Google et consort, vous pouvez constater une influence positive sur les moteurs de recherche. La condition préalable de base est un contenu in­for­ma­tif de haute qualité qui encourage le partage, les mentions « j’aime » et les com­men­taires, grâce à des boutons reliés à Facebook intégrés en dehors du réseau, et qui con­tri­buent à diffuser le contenu.

Il n’est pas toujours né­ces­saire de créer de bouton de partage Facebook dans le paquet de création de bouton « j’aime ». Sé­lec­tion­nez sim­ple­ment l’élément de menu « bouton partager » et générez un bouton social de la même manière que le bouton « j’aime » à l’aide du con­fi­gu­ra­teur.

Il y a une dif­fé­rence entre intégrer des boutons Facebook sous forme d’iFrame ou d’ap­pli­ca­tion Ja­vaS­cript sur votre site Internet, même si les deux versions sont très si­mi­laires dans leur fonction de base : puisque les deux plug-ins sociaux sont hébergés par Facebook, le réseau social détecte au­to­ma­ti­que­ment si l’uti­li­sa­teur est connecté et, le cas échéant, met en œuvre une forme per­son­na­li­sée des boutons. Dans le cas d’iFrame, il s’agit d’une liste de tous les amis du visiteur (y compris les photos de profil) qui ont également aimé le site Web ou la con­tri­bu­tion. S’il n’est pas connecté ou s’il n’a pas de compte, une demande ou une in­vi­ta­tion à se connecter ou à s’inscrire apparaît au­to­ma­ti­que­ment. Le plug-in Ja­vaS­cript permet également à l’uti­li­sa­teur d’ajouter un com­men­taire en cliquant sur le bouton « j’aime ». Con­trai­re­ment à iFrame, qui est un élément HTML unique, la variante Ja­vaS­cript nécessite l’in­té­gra­tion du SDK Facebook en plus de la ligne de code. Dans ce cas, vous pouvez également intégrer la demande de connexion au réseau social à l’aide du puissant kit de dé­ve­lop­pe­ment. Afin que Facebook puisse lire les boutons per­son­na­li­sés, le na­vi­ga­teur de l’uti­li­sa­teur contacte au­to­ma­ti­que­ment les serveurs de ce géant du Web. S’il/elle est connecté(e) au réseau social ou s’il/elle a déjà été connecté(e) et charge une page avec un plug-in social intégré, il/elle peut même être identifié€ de manière unique. Toutefois,  cela signifie également que Facebook reçoit des in­for­ma­tions dif­fé­rentes : comme le moment de l’accès, l’ID uti­li­sa­teur ou des in­for­ma­tions sur le na­vi­ga­teur utilisé et même l’adresse IP. La société amé­ri­caine se réserve le droit de stocker et d’utiliser ces données col­lec­tées pour l’amé­lio­ra­tion de ses propres produits et services ainsi que pour l’op­ti­mi­sa­tion des pu­bli­ci­tés diffusées.

En Allemagne, Facebook s’est heurté à un problème juridique car l’in­té­gra­tion d‘bouton « j’aime » de Facebook sur un site Web serait opposé à la lé­gis­la­tion allemande en matière de pro­tec­tion des données per­son­nelles. Ce bouton trans­met­tait alors les données uti­li­sa­teurs à Facebook sans demande de con­sen­te­ment, même si l’uti­li­sa­teur ne cliquait pas dessus.

Facebook a également été mis en demeure par la CNIL en France pour son bouton de partage qui per­met­tait de générer un cookie et récolter l’adresse IP de l’in­ter­naute (membre de Facebook ou non, avec ou sans con­sen­te­ment). La Belgique a également initié une démarche similaire, pour les mêmes raisons.

Fin 2014, Heise a introduit avec Shariff une solution ga­ran­tis­sant la caractère privé de vos données. Le projet open source est développé sur la pla­te­forme publique GitHub, où vous pouvez également té­lé­char­ger le code source. Un bouton de partage Shariff n’est, pour sim­pli­fier, rien de plus qu’un simple lien statique qui a été per­son­na­lisé à l’aide du langage CSS (fichier shariff.min.css), afin de res­sem­bler aux boutons de partage typiques des pla­te­formes de médias sociaux po­pu­laires comme Facebook, Twitter et Google+. L’équipe de dé­ve­lop­pe­ment d’Heise ne s’est pas appuyée sur des gra­phismes or­di­naires, mais sur des icônes vec­to­rielles flexibles, qui restent précises sur les écrans haute ré­so­lu­tion, et peuvent être placées sur leur propre serveur ou intégrées via le réseau de diffusion de contenu MaxCDN. Afin que vous n’ayez pas à saisir ma­nuel­le­ment l’URL du lien statique à chaque fois, Shariff l’écrit au­to­ma­ti­que­ment dans le code source via Ja­vaS­cript (fichier shariff.min.js). L’im­plé­men­ta­tion du bouton se fait à l’aide d’un conteneur <div> et de la classe shariff, que vous po­si­tion­nez sim­ple­ment sur la position désirée dans l’espace <body> de votre site Web. Dans sa forme la plus simple, le coude source d’une page ressemble donc à ceci :

Avec un composant serveur optionnel, il est même possible de dé­ter­mi­ner et d’afficher le nombre de personnes qui ont utilisé le bouton de partage. Heise a développé trois modules backend et ex­ter­na­li­sés pour Facebook, Google+ et Twitter : une version Perl et une version Node.js. Le backend envoie une requête aux serveurs des réseaux via l’API res­pec­tive, reçoit une série de mé­ta­don­nées comme réponse et en extrait les in­for­ma­tions, combien de fois l’URL res­pec­tive a été partagée.

Lier son propre site Web à des réseaux sociaux via un bouton peut con­si­dé­ra­ble­ment faciliter l’expansion d’un contenu. Ceci s’applique non seulement à Facebook, mais aussi à toutes les autres pla­te­formes sur les­quelles vous êtes actif. Si vous maîtrisez le dialogue avec les uti­li­sa­teurs et que vous publiez ré­gu­liè­re­ment des contenus de haute qualité, vous avez de fortes chances de trans­for­mer les signaux sociaux en trafic pour votre site Web à long-terme. Vous devriez cependant ab­so­lu­ment éviter les plug-ins sociaux tels que ceux de Facebook et d’autres réseaux pour inclure des boutons de partage : bien que ces ex­ten­sions s’intègrent ra­pi­de­ment et fa­ci­le­ment, elles sont alar­mantes en termes de pro­tec­tion des données.

Les solutions al­ter­na­tives avec des liaisons statiques telles que le projet Shariff présenté ne trans­met­tent aucune donnée aux serveurs des réseaux sociaux avant que vos visiteurs n’acceptent une telle trans­mis­sion. Si vous utilisez ces liens avec l’aspect des boutons bien connu, vous rem­plis­sez en tant que webmaster votre obli­ga­tion d’in­for­ma­tion et profitez toujours des avantages du lien vers le site Web et du profil sur les médias sociaux.