Share
Une bonne page de contact est essentielle pour entretenir des relations avec vos visiteurs. Qu'il s'agisse de commerce électronique, de magazines, de sites Web personnels ou de services en ligne, les utilisateurs recherchent généralement une page de contact comme premier moyen de communication avec vous. Curieusement, de nombreux concepteurs de sites Web négligent la modeste page de contact, le considérant même comme l'un des aspects les moins importants d'un site Web. Mettons ça bien.
Une page de contact est souvent négligée. Combien de fois avez-vous visité un site Web, vouliez-vous contacter pour vous plaindre d'un produit ou d'un service, ou poser une question? Et combien de fois avez-vous eu des difficultés avec un formulaire de contact?
Une bonne page de contact peut profiter à tout type d’entreprise. Il peut améliorer la satisfaction de la clientèle en aidant les utilisateurs à résoudre leurs problèmes. Il peut également aider une entreprise à améliorer ses produits et services en offrant un moyen de recueillir de précieux commentaires..
D'autres canaux peuvent être limités en ce qui concerne les commentaires des utilisateurs. La télévision, la radio, les magazines, les journaux… sont une forme de communication à sens unique. La communication en ligne devrait être une rue à double sens; un dialogue entre une entreprise et un visiteur. C’est pourquoi une bonne page de contact est essentielle..
Première étape: l'emplacement de vos informations de contact. Avoir la meilleure page de contact au monde ne sert à rien si les visiteurs ne peuvent pas la trouver. Le respect de certaines conventions de conception peut aider vos visiteurs.
De manière générale, les informations de contact se trouvent à deux endroits:
Navigation primaire est un emplacement idéal pour un lien de page de contact. Les visiteurs recherchent généralement des informations de contact sur le côté droit d'une page, car elles sont considérées comme un élément d'importance secondaire. Pour cette raison, le lien de la page de contact est généralement l'un des derniers éléments de la navigation du site..
Vous pouvez également voir une sous-navigation plus petite dans le coin supérieur droit de l'écran. C'est également un poste précieux pour la page de contact. Cela dit, il serait préférable d'éviter de placer un lien vers la page de contact dans un menu déroulant, car il pourrait facilement être négligé..
Le pied de page est également un endroit populaire pour les informations de contact. Il peut soit contenir un lien vers la page de contact:
ou l'information de contact la plus importante elle-même:
Anticiper le flux de visiteurs vers une page de contact est délicat, donc le placement d'un lien dans au moins deux endroits, comme indiqué, vous couvre assez bien..
Maintenant que nous sommes certains que les visiteurs peuvent accéder à la page de contact, il est temps de réfléchir au contenu réel. Commençons par les bases et regardons les informations qui devraient être présentes.
Une adresse électronique est le moyen le plus simple de contacter une entreprise en ligne. Vous pouvez également utiliser un formulaire de contact qui envoie un courrier électronique. Via un formulaire de contact, vous contrôlez davantage le contenu (champs obligatoires) et évitez ainsi le spam. Plus d'informations sur les formulaires de contact plus loin dans cet article.
Lea Verou affiche son adresse électronique en texte brut, mais utilise une méthode rusée pour empêcher les spambots de la récupérer… Les entreprises possédant un magasin physique ne doivent pas oublier de mentionner leur adresse. Si vous avez plusieurs magasins, il est préférable de créer une page distincte pour chaque emplacement. Remplissez cette page avec les informations de contact spécifiques au magasin, les heures d'ouverture, les directions, etc. Cela n'est pas seulement utile pour les visiteurs, mais peut également aider votre site à répondre aux requêtes de recherche locales..
L'affichage d'un numéro de téléphone crée un sentiment de confiance. Cela est souvent perçu comme un signe qu’il s’agit d’une véritable entreprise, ce qui peut être très utile pour les boutiques en ligne..
De nombreux sites Web commencent à ajouter des boutons de médias sociaux à leur page de contact. Bien que cela ne profite probablement pas à tous les sites, pour certains visiteurs, cela peut représenter une réelle valeur ajoutée. D'autant que de plus en plus d'entreprises offrent un support client via Twitter (parfois même 24h / 24 et 7j / 7).
Envato a un canal d'assistance Twitter très actif, @envato_support Il n'y a pas de solution unique pour une bonne page de contact. Chaque site Web ou entreprise nécessite certains éléments pouvant être redondants sur d'autres sites..
De nombreuses informations ou fonctionnalités supplémentaires peuvent être utiles sur une page de contact. Pour les magasins physiques, il peut être judicieux de mentionner les heures d'ouverture, par exemple. Les grandes entreprises peuvent créer un lien vers leur fonction de chat en direct et les sites de commerce électronique peuvent renforcer la confiance des utilisateurs en affichant leur numéro de TVA.
Rendre les informations de votre page de contact utilisables peut éviter beaucoup de frustration chez les visiteurs.
Inclure vos informations de contact comme HTML texte au lieu d'images. Cela peut sembler une évidence, mais de nombreux sites Web utilisent d'autres techniques. Le texte HTML peut être copié et collé, ce qui permet au visiteur de sauvegarder plus facilement vos données de contact..
Un adresse électronique devrait utiliser le mailto lien. Cela permet aux visiteurs qui cliquent dessus d'envoyer un e-mail sans devoir copier au préalable l'adresse e-mail de destination et ouvrir un client de messagerie. Un problème peut toutefois survenir avec cette technique, sous la forme de robots de spam récupérant des adresses électroniques associées à une mailto: lien. Par conséquent, vous voudrez peut-être commencer par masquer les adresses électroniques à l'aide d'un service tel que mailtoencoder.com..
Sur une note connexe: numéros de téléphone devrait également être interactif. L'année dernière, nous avons publié une astuce expliquant comment rendre un numéro de téléphone cliquable. Grâce à un petit code, les smartphones peuvent reconnaître les numéros de téléphone, ce qui les rend appelables. C'est vraiment pratique pour les utilisateurs mobiles.
Les entreprises qui comptent beaucoup sur leurs magasins physiques peuvent tirer un bénéfice considérable de carte interactive, permettant aux utilisateurs de trouver rapidement leur chemin vers le point de vente. Afficher l'adresse d'un magasin est une bonne chose, mais ajouter une carte interactive, c'est mieux.
Grâce à Google Maps, intégrer cette fonctionnalité utile n’a jamais été aussi simple. Entrez simplement votre adresse dans Google Maps et cliquez sur l'icône de lien dans la barre latérale. Vous y trouverez le code d'intégration.
Saviez-vous que vous pouvez personnaliser votre carte? Vous pouvez styliser les couleurs de la carte, ajouter des marqueurs de carte personnalisés et créer une légende. Vous trouverez plus d'informations sur developers.google.com. Vous pouvez également envisager des services alternatifs tels que le très savoureux Mapbox.
En tant que visiteur, vous reconnaîtrez instantanément une adresse sur une page de contact. Les moteurs de recherche ont toutefois besoin d’un peu plus d’aide pour reconnaître les divers éléments..
Nous pouvons résoudre ce problème en utilisant des données structurées. Les données structurées sont une forme de balisage HTML qui fournit aux moteurs de recherche plus d'informations sur la signification sous-jacente du contenu..
Comment ça marche? Supposons que nous ayons une agence de création de sites Web appelée "Fine Design" située au 3102 Highway 98, Mexico Beach, en Floride. Les microdonnées permettent aux moteurs de recherche de mieux comprendre cette adresse. Le code HTML ressemblera à ceci:
Beau design
3102 autoroute 98 Mexico Beach, FL
Vous voudrez peut-être aller un peu plus loin et envelopper ce bloc dans un élément. L'élément address ne doit être utilisé que sur des adresses pertinentes pour le contexte du site, pas simplement une ancienne adresse que vous pourriez avoir dans votre contenu. L'utilisation de cet élément a causé des maux de tête aux développeurs pendant des années, alors si vous n'êtes pas sûr, ne vous inquiétez pas trop à ce sujet.!
Voilà pour l'adresse de l'entreprise. Cependant, nous pouvons également utiliser des microdonnées pour le numéro de téléphone et l'adresse électronique:
Tel: 850-648-4200 Email: [email protected]
Grâce à ce balisage, les moteurs de recherche savent qu’il s’agit de l’adresse, du numéro de téléphone et de l’adresse électronique de la société 'Fine Design'. C'est une information implicite, ce qui signifie que les visiteurs ne peuvent pas la voir, mais c'est très utile aux moteurs de recherche..
Vous pouvez également envisager d'utiliser le microformat hCard qui permet facilement la sauvegarde des données de contact sur diverses plates-formes. En savoir plus sur les microformats sur html5doctor.com.
La plupart des sites Web utilisent un formulaire de contact sur leur page de contact. Cependant, certains formulaires de contact sont inutilement compliqués et les utilisateurs peu accueillants..
Aussi simple qu’un formulaire de contact puisse paraître, c’est en fait une combinaison de plusieurs éléments cruciaux. Chacun de ces composants doit fonctionner ensemble pour offrir la meilleure expérience utilisateur possible..
Les champs de saisie, tels que les champs de texte, les boutons radio, les cases à cocher, etc. permettent à l'utilisateur de renseigner les informations nécessaires..
Les visiteurs du site sont plus susceptibles de remplir formes plus courtes car ils nécessitent moins d'effort. Le nombre de champs de saisie constitue un équilibre entre l'expérience utilisateur et les besoins de l'entreprise. Hubspot a analysé plus de 40 000 formulaires et a examiné l'effet d'une augmentation du nombre de champs de saisie. Le résultat de leur étude est que vous devez utiliser le moins de champs possible et être particulièrement prudent avec les zones de texte plus sophistiquées et les cases à cocher..
Aidez vos visiteurs à remplir ces champs en indiquant le bon format. Les numéros de téléphone et les dates peuvent être délicats, en particulier pour les visiteurs internationaux. L'attribut d'espace réservé HTML5 vous aidera ici.
Ensuite, assurez-vous de mettre en évidence les champs obligatoires (une convention courante consiste à utiliser un astérisque *). Indiquer de manière explicite qu’un champ de saisie est requis ou que le champ est facultatif est une solution sûre..
Enfin, il peut être utile de mettre en évidence le champ actif. Cela peut être aussi subtile ou accrocheur que vous le souhaitez.
Vous trouverez ci-dessous un exemple de formulaire de contact tiré d'un didacticiel de Jim Nielsen. Il utilise un astérisque rouge pour les champs obligatoires, donne des conseils de mise en forme et met en évidence le champ actif..
La validation de formulaire en ligne peut également éviter certains maux de tête de formulaire de contact. Il est très frustrant de devoir soumettre à nouveau un formulaire à plusieurs reprises, car vous avez saisi des données erronées ou des données dans un format incorrect. Comme nous l'avons mentionné précédemment, il est préférable d'aider les visiteurs en affichant le format requis (par exemple, les dates, le numéro de téléphone, etc.)..
Vous ne pouvez pas avoir de formulaire de contact sans un bouton d'envoi. Ce bouton devrait être au bas du formulaire. Utilisez "Envoyer un message" comme texte de bouton au lieu de "Envoyer" pour rappeler aux clients ce qu'ils font..
Une norme courante d’aujourd’hui consiste à inclure un bouton «réinitialiser» ou «effacer le formulaire». Ne pas Personnes volonté cliquez dessus accidentellement. Il n'y a rien de pire que de taper un message élaboré et de le perdre à cause d'un bouton de réinitialisation..
Le visiteur a renseigné ses coordonnées, tapé un message et appuyé sur le bouton "envoyer". Maintenant quoi? Le message est-il passé ou non??
Rassurez vos visiteurs que le message a été envoyé avec succès en affichant un message de confirmation. Un email de confirmation est aussi une option.
Le même conseil s'applique pour les erreurs. Afficher une erreur lorsque le message n'a pas été envoyé est indispensable - cela peut empêcher de nombreuses discussions futures. Le message d'erreur doit être convivial, évitez donc d'afficher des codes d'erreur surprenants.
Il existe de nombreuses exigences techniques pour concevoir une meilleure page de contact, mais n'oublions pas l'un des aspects les plus importants: le style visuel..
Si vous utilisez un formulaire de contact, créez des champs de grande taille, conviviaux et attrayants à remplir. Les blancs et le rembourrage peuvent être très compliqués..
Les visiteurs du site Web suivent souvent un motif en forme de F lorsqu'ils naviguent sur une page Web, gardez cela à l'esprit lorsque vous concevez votre mise en page. Pour les formulaires de contact, il est préférable d’empiler tous les champs verticalement au lieu de les placer côte à côte. Cela réduit le nombre de mouvements oculaires que les visiteurs doivent effectuer pour remplir le formulaire..
Une page de contact doit correspondre à l'identité visuelle du reste du site. Un aspect cohérent est la clé. Jetez un coup d'œil à cette page de contact de «Let's Travel Somewhere» par exemple, conçue sous la forme d'une carte postale.
Et comme pour la plupart des tâches liées à la conception Web; la créativité porte ses fruits. Neil Patel a conçu sa page de contact sous la forme d'une infographie, triplant ses demandes de contact..
En parlant de bons formulaires de contact, jetons un coup d’œil à quelques exemples (en cliquant sur chaque image pour accéder au site Web correspondant):
Avant de concevoir votre page de contact, assurez-vous que vos visiteurs peuvent la trouver. Liez-le depuis votre navigation principale ou votre pied de page. N'oubliez pas que la plupart des gens recherchent des informations de contact sur le côté droit de l'écran..
Pensez aux informations à inclure. La possibilité d'envoyer un message, via une adresse électronique ou un formulaire de contact, est essentielle. Une adresse et un numéro de téléphone peuvent également être utiles. Des informations supplémentaires telles que des liens vers des profils de médias sociaux et des heures d'ouverture pourraient être utiles pour certaines entreprises..
L'interactivité est également importante. Utilisez le mailto attribut pour les adresses e-mail (de manière obscurcie) et le tel: attribut pour les numéros de téléphone (très utile pour les visiteurs mobiles). Une carte interactive telle que Google Maps peut également être intégrée, mais prenez en compte les conséquences que cela entraîne pour la performance..
La convivialité du formulaire de contact peut créer ou casser une page de contact. Commencez par ne demander que les informations les plus essentielles. Afficher le format approprié pour les champs de saisie et utiliser la validation en ligne peut éviter beaucoup de maux de tête. N'oubliez pas d'afficher un message de réussite lors de l'envoi du formulaire.
Accentsconagua