Les CTA, on vous en parlait dans l’article sur les landing pages. On vous donne aujourd’hui 4 exemples simples de CTA à mettre en place sur vos sites pour booster l’engagement de vos visiteurs.
1 • Soyez funs, osez la créativité!
Pour que vos appels à action ne soient pas que des mots, n’hésitez pas jouer sur la créativité et le décalage. Le visiteur se souvient mieux de ce qui l’a frappé, surpris, et donc se souviendra mieux de votre entreprise et de vos produits.
Ce bouton est visible sur le site Huemor, qui d’ailleurs a un nom de domaine assez original : huemor.rocks, rocks qui signifie « déchire ». On peut le rajouter à notre liste de noms de domaines intéressants commencée dans l’article à ce sujet.
Les bords des sites internet (sidebar) sont souvent soit remplis à l’excès soit laissés à l’abandon. Comme toujours, la clé est le juste milieu: n’hésitez pas à mettre en avant un contenu que vous jugez particulièrement intéressant, une offre sur vos produits par exemple, un lien vers vos profils sur les réseaux sociaux…
N’hésitez pas non plus à utiliser des visuels plus gros, selon l’espace disponible.
Bref, cet espace est idéal pour l’auto-promotion!
3 • Soyez inspirant
On a toujours apprécié les citations, et si vous naviguez un peu sur les réseaux sociaux vous avez sûrement remarqué qu’on en partage beaucoup, que ce soit pour motiver, illustrer un propos ou s’indigner.
Or vous pouvez vous aussi être source de citation! Pour cela, il suffit de faire en sorte que lorsqu’un visiteur surligne du texte de votre site, il lui soit proposer de le partager sur Facebook, Twitter ou autre, avec un petit bouton qui apparaît juste au dessus de la zone sélectionnée (par exemple!)
4 • Un dernier mot avant de partir…
Et oui! Les pop-ups qui se lancent lorsque le lecteur s’apprête à quitter votre site sont assez efficaces! Que ce soit pour proposer de s’abonner à une newsletter ou télécharger un livre blanc, ou pourquoi pas encore liker sur des réseaux sociaux?
La landing page, qui désigne la page sur laquelle arrive un internaute après avoir cliqué sur un lien, est un point important de toute stratégie digitale. Comment bien la construire?
Le chemin vers une landing page (presque) parfaite
Bien qu’il n’y ait probablement pas de formule parfaite pour construire une landing page parfaite, il est néanmoins vrai que l’on retrouve des points communs dans toutes les pages qui ont un fort taux de conversion. Si vous voulez que votre landing page soit performante, alors n’oubliez pas d’intégrer les 4 éléments suivants lors de la construction de la page:
1. Des images haute définition
En 2016, l’utilisation de visuels et images en haute définition est devenu indispensable en content marketing (marketing de contenu), Je vous invite à lire ces statistiques (ou celles là en anglais) si vous n’êtes pas convaincus 🙂
Voici un résumé des plus intéressantes:
Des recherches ont trouvé que les visuels en couleur augmentent jusqu’à 80% l’envie du lecteur de lire la suite
Si on associe une image pertinente avec les informations auditives qu’entendent les utilisateurs, les chances pour qu’ils retiennent l’information pendant au moins 3 jours passent de 10 à 65%
Le contenu avec des images pertinentes a jusqu’à 94% de vues en plus que le même contenu sans image
Le contenu visuel a 40 fois plus de chances d’être partagé sur les réseaux sociaux que tous les autres types de contenu
Comme vous pouvez le voir, avoir des visuels adaptés et des images HD est indispensable pour améliorer votre content marketing et engager votre segment cible. Ça s’applique donc également à votre landing page!
Voyons un exemple: regardez cette landing page de Luxury Estates International. La première chose que vous remarquez sont les images attirantes, vives du diaporama en haut de la page. En voyant ces images, on a tout de suite le sentiment d’être sur une page de haute qualité.
Du coup, une mauvaise landing page serait une page qui notamment manquerait d’images de qualité (quelques exemples ici, même si les images ne sont pas le seul problème). Quand on clique sur ce genre de pages, on ne ressent pas de sentiment de bien-être, une impression générale positive et agréable. Plutôt le contraire en fait, et on se sent parfois même confus, perdu, voire déçu.
La morale de l’histoire? Utilisez des images de grande qualité sur vos landing pages. Haute résolution, originales, attirantes et pertinentes.
2. Un CTA clair et précis.
Dès que vous entendez quelqu’un se plaindre que sa landing page a un mauvais taux de conversion, vous devriez tout de suite lui demander: « quel est votre CTA (Call To Action, appel ou incitation à l’action)? Et l’avez-vous testé? »
Dans la plupart des cas, le CTA a été mis après coup au hasard sur une page, et c’est ça le problème. Le CTA doit au contraire être la raison d’être d’une page, qui doit être construite autour et non le contraire!
Quelques suggestions:
Utilisez un vocabulaire d’action. Un appel à action fort utilise toujours un vocabulaire adapté. Dans l’idéal, il faudrait provoquer des réactions rapides, et donc utiliser des phrases familières que les visiteurs reconnaîtront tout de suite. Vous pouvez essayer des mots tels que commencez, arrêtez, augmentez, développez, maintenant, dépêchez-vous, découvrez, économisez, aujourd’hui, cette offre se finit dans…
Faites attention à vos visuels. Encore une fois, les visuels sont les éléments les plus importants! Votre appel à action doit être très visible et mis en avant. Dans la plupart des cas, vous pouvez utiliser des boutons colorés et des couleurs contrastées pour faire ressortir votre appel à action.
La taille compte! Un des éléments le plus oublié lors de la construction d’une page est la taille, alors que c’est un point très important de la structuration. En fait la clé est d’avoir un appel à action suffisamment gros pour ressortir, mais sans surcharger le lecteur. Il est vrai qu’il n’y a pas de règle universelle concernant la page, c’est particulier à chaque cas, il vous faudra donc faire de nombreux ajustements.
N’oubliez pas l’emplacement. Très souvent, les visiteurs parcourent une landing page en suivant un chemin en forme de F ou de Z. Ceci dit, il est généralement conseillé de mettre votre CTA en haut à gauche ou en bas à droite, cela permet d’engager votre utilisateur au tout début ou à la fin de leur parcours de consommation.
Lorsque vous concevrez le design de votre prochaine landing page, mettez cet élément en haut de vos priorités: reléguer pour plus tard est sans aucun doute l’un des meilleurs moyens de ruiner votre landing page.
3. Des témoignages de confiance
Ces témoignages sont un composant indispensable à n’importe quelle stratégie de marketing digital, et plus encore pour des landing pages. « Quand quelqu’un atterrit sur votre landing page, ils ne savent pas si votre offre vaut le coup ou pas: cela vous donne l’opportunité de les impressionner grâce à des témoignages de clients, des tweets qu’on aura intégré à la page et ainsi de suite » a écrit Lindsay Kolowich, chargée de marketing chez Hubspot.
Elle continue en disant « s’ils voient que d’autres gens qui ont profité de cette offre en parlent de manière positive, ils auront tendance à avoir une vision positive également, et sont donc plus enclins à remplir votre formulaire et devenir un lead. »
Du coup, comment utiliser ces témoignages à votre avantage?
Il vous faut regarder les différents types de témoignages que vous possédez: cela peut être des témoignages directs de clients, des citations type livre d’or mais aussi des des études de cas, des certifications ou des statistiques. Chaque page est différente, mais nous vous conseillons d’inclure au moins un type de témoignage sur chaque landing page.
4. Une mise en page et un flow clair
Bien que les points précédents soient indispensables, ils ne suffiront pas pour convertir vos visiteurs si votre site n’a pas une mise en page claire et un flow efficace. De même qu’il y a des formats d’articles de blog plus efficients que d’autres (les listes, les tests de produits, les tutoriels…), les landing pages ne sont pas en reste. Vous vous souvenez qu’on a parlé de chemin de lecture en F ou Z?
Voilà un point sur lequel vous devez vraiment prendre le temps de réfléchir, de penser stratégiquement à la manière dont vos visiteurs « consomment » votre contenu et ainsi organiser les différents éléments qui composent votre page de manière à maximiser la lecture.
Voici un bon exemple: cette page de WebDAM présente un titre clair en haut à gauche, un questionnaire rapide d’inscription à droite, le contenu clé au milieu, et divers témoignages de confiance en bas.
On apprend beaucoup de ce genre d’exemple, prenez votre temps pour déterminer ce qui sera efficace pour votre page.
Mettre tout ça ensemble
La magie des landing pages est que malgré ces points en commun, il n’en existe pas 2 semblables!
Bref, les clés du succès pour développer votre business en 2016 et après sont vos visuels, appels à action, témoignages et mise en page, ne l’oubliez pas!
Un framework d’abord, qu’est-ce que c’est? Et Symfony?
Logo du framework Symfony
Chez Kreatys, nous nous servons du framework Symfony pour développer nos projets web. Voyons ensemble ce que cela signifie concrètement.
Commençons par le commencement: le framework.
Framework se traduirait de l’anglais par « cadre de travail« , et désigne « un ensemble cohérent de composants logiciels structurels, qui sert à créer les fondations ainsi que les grandes lignes de tout ou d’une partie d’un logiciel (architecture) » comme le dit si bien Wikipédia. Cet outil a pour but d’aider les développeurs en leur fournissant par exemple des normes de programmation, des outils développés par d’autres programmeurs, et leur permet ainsi de ne pas avoir à réinventer la roue à chaque projet!
Néanmoins, utiliser un framework ne garantit pas un bon code: c’est un outil, il n’y a aucune garantie que vous l’utiliserez correctement. Un peu comme si on vous donnait un stylo: c’est quand mieux que de le refabriquer soi-même à chaque fois, mais le simple fait d’avoir un stylo ne garantit pas que vous deviendrez Victor Hugo, vous restez responsable de l’usage que vous en faites. Comme ce grand homme l’a d’ailleurs dit, « tout ce qui augmente la liberté augmente la responsabilité ».
Ensuite, tous les développeurs ne servent pas de framework: certains trouvent en effet le cadre trop contraignant, limitant l’apprentissage et l’innovation. Il est vrai que lorsqu’on a un cadre, on ne va pas forcément chercher à en sortir. J’ai un stylo, pourquoi m’embêter à essayer d’en réinventer un? C’est tout à fait compréhensible, mais si on se limitait à cet encadrement cela risquerait de brider toute créativité de la part de nos codeurs et les langages de programmation n’évolueraient plus.
Bien évidemment, nous n’en sommes pas là du tout 😉
L’avis de Victor Hugo sur les frameworks
Donc voilà pour les frameworks. Et Symfony du coup?
D’après eux-mêmes , « Symfony est un ensemble de composants PHP, un framework pour application web, une philosophie, ainsi qu’une communauté — le tout fonctionnant en harmonie. ».
Donc vous l’aurez compris, Symfony est utilisé par les développeurs web qui codent en PHP. Et ça tombe bien, nous en avons 2 avec nous à Kreatys! Nous leur avons brièvement demandé leur avis sur la question: – Olivier : « Symfony, c’est très structuré, très cadré, ce qui est pratique quand on travaille à plusieurs sur un même projet car on comprend plus facilement le code de chacun. » – Rémi : « Avant je travaillais sous CakePHP, et justement d’un côté j’aimais bien la souplesse qu’il offrait. En plus je trouve que c’est plus abordable, tu peux rapidement arriver à sortir des pages pour ton site en étant débutant, alors que Symfony est plus long à prendre en main. Par contre c’est vrai que Cake pouvait devenir vite une usine à gaz, et fallait vraiment mettre les mains dans le cambouis.» – Olivier : « Oui, alors que là avec Symfony et leur bundles, c’est assez clair et efficace. En plus ils sont libres*, donc on trouve pas mal de ressources, de données partagées par les autres développeurs. »
En conclusion, Symfony est pour nos développeurs un moyen efficace de travailler en équipe sans problème, et de part son appartenance aux logiciels libres il prône des valeurs de collaboration et de partage qui nous sont importantes.
*logiciel libre: désigne un programme sous une licence permettant son utilisation, sa modification et sa distribution par tout le monde. Par exemple, Firefox, Ubuntu, VLC, OpenOffice ou encore Gimp, sont tous des logiciels libres.
UI et UX design sont 2 termes que l’on croise beaucoup ces temps-ci.
Ça parle de quoi?
Keep calm and call a designer
Prenons donc la situation suivante: vous voulez développer un site internet pour votre nouveau projet de, disons, découverte de nouveaux artistes et mise en vente de leur œuvres sous forme de posters, tasses à café etc.
Vous décidez donc de faire appel à une entreprise de création de sites internet, et on vous parle d’UX, d’UI…
Déjà, expliquons ces acronymes pas forcément évident. UX vient de l’anglais User eXperience, et UI, User Interface, user signifiant utilisateur, ces termes étant utilisés dans le cadre de création de logiciels, ou de sites internet par exemple.
UI/UX par Userexperiencerocks.com
L’UX désigne donc l’expérience générale que l’utilisateur a en se servant de votre logiciel/en visitant votre site, et il faut y réfléchir presque dès le début du projet.
En définissant l’UX, vous décidez des différentes stratégies concernant le contenu, comment suivre les axes de communication et l’image de marque que vous avez défini en amont, le chemin que vous voulez que le visiteur suive dans votre site.
Concrètement, établissez l’architecture et les fonctionnalités, notamment en fonction de tous les types de visiteurs qui vont utiliser ce site: les artistes, les clients… Pour ces derniers, comment les utilisateurs ont accès aux produits, doit-on leur faire créer un profil? Pour les artistes, désirez-vous que les créateurs puissent avoir un profil personnel? Qu’ils puissent vous soumettre des oeuvres directement depuis leur compte?
Sans oublier de faire la même chose pour vos produits: quels produits mettre en ligne? Quelle description devriez-vous inclure pour chaque produit?
Bien sûr, vous devez également définir l’ambiance de votre site: comment trouver le bon compromis entre l’ambiance un peu galerie d’art et une boutique en ligne? Comment organiser mon site, quelles catégories, quelle page d’accueil? Vous pouvez choisir de commencer par un diaporama (slider) de photos haute qualité des œuvres ayant eu le plus de succès; ou choisir d’exposer directement des produits mis en scène avec des prix très attractifs… En fonction de ce que vous souhaitez montrer à vos visiteurs.
Cela inclut également les prototypes de votre site, à tester sur les tous les différents terminaux que vous aurez choisi (n’oubliez pas qu’aujourd’hui, un site non responsive, c’est à dire qui s’adapte à tout appareil et taille d’écran, sera moins bien classé par Google!), ainsi que les tests utilisateurs, pour vérifier l’utilisabilité du site.
Bref tout cela est à étudier et à définir tôt dans le projet.
L’UI quant à elle est en fait une partie de l’UX. Bien que l’interface soit souvent la première chose à laquelle on pense, particulièrement quand on conçoit un site, cela vient après une définition de l’expérience que l’on veut proposer à nos futurs utilisateurs.
L’UI est la partie visuelle, créative: cela inclut la définition du design visuel du site, comme par exemple les couleurs, la typographie…
Si vous avez décidé d’opter pour un slider photo sur la page d’accueil, vous pouvez ensuite décider de quelles photos choisir; à quelle taille elles apparaîtront et quelle transition il y aura entre chaque.
Faire son design sans penser à l’UX
En conclusion, l’UX désigne l’expérience générale que vous voulez offrir à vos visiteurs/utilisateurs, et l’UI est la partie visuelle de la réalisation de l’UI.
Les 2 sont importantes, mais attention à ne pas se focaliser trop sur l’UI, qui est plus concrète mais n’intervient qu’assez tard dans le projet, sous peine de se retrouver avec des pelouses complètement piétinées!
