Refontes adaptatives pour les centres de plongée

· 6 min de lecture

Points clés

  • Un formulaire qui ne peut pas être rempli avec un seul pouce doit être corrigé.
  • Affichez vos prix ou au moins une fourchette, car les utilisateurs de téléphone quittent le site lorsqu'ils ne les trouvent pas.
  • Testez tout le parcours de réservation à partir d'une recherche Google, sur un téléphone d'entrée de gamme, sans Wi-Fi.

La majeure partie du travail Web que nous réalisons cette année pour des centres de plongée poursuit le même objectif : faire en sorte que le site fonctionne correctement sur un téléphone, et non seulement qu'il y soit esthétique.

Les clients d'un centre de plongée sont des voyageurs. Ils utilisent leur téléphone dans les aéroports, sur les bateaux et dans des guesthouses où le signal est faible et où le ventilateur ne tourne pas. Les sites qu'ils consultent ont surtout été conçus pour un grand écran de bureau; les clients doivent donc pincer et agrandir l'affichage sur un écran de quatre pouces jusqu'à ce qu'ils abandonnent. En juin dernier, Google a indiqué que le design adaptatif est la configuration qu'il recommande pour les sites destinés aux téléphones intelligents. Bon nombre de propriétaires n'en sont pas encore informés.

Nous refaisons donc ces sites sous forme de thèmes WordPress adaptatifs. La mise en page est la partie la plus simple du travail. C'est le formulaire de réservation qui continue de nous apporter le plus d'enseignements.

Pourquoi un site Web adaptatif est-il préférable à un site mobile distinct ?

Bien des entreprises ici exploitent encore deux sites : le site principal et une version « m. » qui contient la moitié du contenu, un menu différent et aucun moyen d'atteindre la page vers laquelle le visiteur a été dirigé. Lorsqu'une personne partage un lien vers votre cours Open Water et qu'un ami l'ouvre sur son téléphone, celui-ci aboutit plutôt sur la page d'accueil mobile et doit chercher la page. La plupart ne le feront pas.

Le design adaptatif, l'approche décrite par Ethan Marcotte en 2010, règle ce problème : un seul site, une seule adresse par page et un seul contenu, avec une mise en page qui s'adapte à l'écran. Pour une petite entreprise sans équipe Web, cela signifie aussi un seul site à mettre à jour au lieu de deux, ce qui constitue souvent l'argument décisif pour les propriétaires avec qui nous travaillons.

WordPress rend cette approche accessible. Les thèmes adaptatifs de qualité deviennent la norme, et une petite entreprise peut se doter d'un site qui fonctionne sur téléphone sans payer pour une application sur mesure. De telles applications sont actuellement proposées à de nombreuses petites entreprises de Bali, à un coût considérable. Un centre de plongée n'a pas besoin d'une application, puisque les clients n'en installeront pas une pour réserver une seule plongée de loisir.

Pourquoi le formulaire de réservation est-il la page la plus importante ?

La page d'accueil d'un centre de plongée sert à la consultation. C'est le formulaire de demande ou de réservation qui génère les revenus, et sur un téléphone, c'est presque toujours la page la plus faible du site.

Les problèmes courants comprennent des champs minuscules, un menu déroulant de deux cents pays, un sélecteur de date qui ouvre un calendrier d'ordinateur de la taille d'un timbre, et un CAPTCHA aux lettres déformées impossible à lire sur un petit écran, surtout en plein soleil. Chacun de ces éléments représente un point où une personne debout sur un bateau abandonne le formulaire et réserve chez un concurrent voisin.

Comment rendre un formulaire utilisable avec un seul pouce ?

Notre norme est qu'un formulaire doit pouvoir être rempli entièrement avec un seul pouce, debout. En pratique, cela signifie :

  • Moins de champs : nom, courriel, dates, cours ou sortie, nombre de personnes. Les autres renseignements peuvent être obtenus dans votre réponse.
  • Des champs et des boutons de grande taille, faciles à toucher du doigt.
  • Le clavier approprié pour chaque champ : un champ courriel qui affiche la touche @, un champ téléphone qui affiche les chiffres. Les types de champs HTML5 le permettent, et la plupart des téléphones actuels les prennent en charge.
  • Aucun casse-tête CAPTCHA. Des méthodes plus discrètes permettent de bloquer le pourriel.
  • Un seul bouton clair au bas du formulaire, dont le libellé indique l'étape suivante. « Envoyer ma demande » est plus clair que « Soumettre ».

Aucune de ces mesures n'est complexe, et pourtant elles sont absentes de presque tous les sites de plongée que nous examinons.

Faut-il afficher ses prix sur son site Web ?

Nous recommandons d'afficher les prix, ou au moins une fourchette. Cette recommandation suscite plus de réticence que toute autre, et les propriétaires choisissent souvent de ne pas la suivre.

Bien des centres de plongée préfèrent ne pas publier leurs prix en ligne. Les concurrents pourraient les consulter, les prix varient selon la saison, et les propriétaires préfèrent recevoir un courriel et préparer une soumission personnalisée. Ces préoccupations sont compréhensibles. Selon notre évaluation, toutefois, ne pas afficher les prix nuit à la plupart des petites entreprises.

Sur un téléphone, une personne qui ne trouve pas le prix en quelques secondes n'envoie pas de courriel pour le demander. Elle retourne aux résultats de recherche et choisit une entreprise qui affiche ses prix. L'entreprise ne sait jamais qu'elle a perdu ce client, ce qui constitue le coût le plus important de cette pratique.

Si les prix exacts ne peuvent pas être publiés, une fourchette est efficace : « Cours Open Water à partir de… », suivi d'un montant. Les clients veulent vérifier que l'offre correspond à leur budget avant d'y consacrer du temps. Taire le prix ne donne pas une image haut de gamme; cela ajoute un effort pour le client.

Comment tester le parcours de réservation ?

Les designers testent généralement sur leur propre téléphone, souvent le plus récent iPhone, branché sur le Wi-Fi fiable du bureau. Le client, lui, utilise un ancien téléphone Android avec une connexion cellulaire instable, quelque part entre Sanur et les îles Gili.

Nous recommandons de tester dans les mêmes conditions que le client. Utilisez un téléphone d'entrée de gamme, désactivez le Wi-Fi et essayez de réserver un cours à partir d'une recherche Google plutôt que de la page d'accueil, puisque c'est ainsi que les gens arrivent sur le site. Comptez les touchers, notez les points de frustration et corrigez-les en priorité.

Répétez le test après chaque modification du site, car les extensions se mettent à jour et les formulaires peuvent cesser de fonctionner sans avertissement. Le formulaire le plus problématique est celui qui semble fonctionner normalement, mais qui n'envoie rien.

Quelles tendances les entreprises doivent-elles anticiper ?

Nous nous attendons à ce que Google devienne nettement plus exigeant envers l'expérience mobile au cours des prochaines années. Il exprime déjà ses préférences et pourrait éventuellement considérer une mauvaise expérience sur téléphone comme un motif de mieux classer un autre site. Le cas échéant, les sites refaits aujourd'hui bénéficieront de s'être adaptés tôt. Les notes de Google pour les développeurs sur la conception de sites pour mobile (en anglais) sont techniques, mais le message essentiel y est déjà clair : offrir le même contenu à tous et ne pas masquer l'information importante sur le petit écran.

Quelles que soient les prochaines décisions de Google, les revenus dépendent du même élément. Une page d'accueil soignée accompagnée d'un formulaire difficile à remplir fait perdre des réservations chaque semaine. Un site simple doté d'un formulaire utilisable avec un seul pouce en génère. C'est le premier élément que nous examinons sur les sites Web de petites entreprises que l'on nous demande d'évaluer. Repérer la plupart des problèmes prend une dizaine de minutes; les corriger demande un peu plus de temps.

Votre entreprise mérite d'être trouvée.

Parlez-nous de votre projet. Nous vous répondons en français ou en anglais, et nous nous déplaçons partout dans la MRC de Papineau.

Affichage

Vos choix restent dans ce navigateur. Rien n'est envoyé.

Taille du texte
100 %
Couleurs
Lecture
Autres aides
Accessibilité du site