Design adapté au mobile: pourquoi votre site web d'hôtel doit fonctionner sur le téléphone

Plus de la moitié des gens visitant votre site web d'hôtel le font sur un téléphone. Sur ce petit écran un client décide en quelques secondes s'il reste ou s'en va. Un site qui a l'air bien sur ordinateur de bureau mais peine sur mobile perd exactement ce groupe.

Pourquoi le mobile en premier n'est plus un choix

Il y a cinq ans le mobile était une couche supplémentaire au-dessus de votre site de bureau. Maintenant c'est la norme. La plupart des voyageurs recherchent et réservent sur le téléphone, surtout s'ils sont en route ou décident spontanément de planifier une escapade.

Google a adapté son indexation en conséquence. Ce que Google appelle Mobile-First Indexing signifie que le moteur de recherche utilise la version mobile de votre site comme base pour votre position dans les résultats de recherche. Un site qui se charge lentement ou est difficile à utiliser sur mobile se classe plus bas. Pas seulement sur les téléphones, mais aussi sur ordinateur de bureau.

La conséquence est double: vous perdez les visiteurs qui abandonnent sur mobile, et vous vous classez moins haut sur Google pour que moins de visiteurs arrivent. Cela vous affecte directement. Mobile est ainsi une partie fixe du plus grand tableau autour de site web et conversion, pas une tâche technique séparée.

Pourtant la plupart des sites hôteliers néerlandais sont toujours construits avec le bureau comme point de départ. Vous le voyez dans les petits boutons, les tableaux larges qui sortent de l'écran, les formulaires que le téléphone n'ouvre pas correctement. Ce site vous coûte le plus de réservations, pas le moins.

Ce qui ne va pas sur mobile

Les goulots d'étranglement sur les sites hôtels mobiles sont largement les mêmes. Ils sont reconnaissables et réparables.

Temps de chargement lent. Sur une connexion mobile une grande image c'est instantanément mortel. Beaucoup de sites se chargent vite sur ordinateur de bureau, mais sur 4G ou un wifi médiocre c'est trop long. Les visiteurs abandonnent après quelques secondes d'attente. Vérifiez votre propre site via Google PageSpeed Insights. Cet outil vous donne un score pour mobile séparé du bureau, et montre ce qui pèse le plus.

Boutons trop petits. Un bouton que vous frappez facilement avec une souris est trop petit avec un pouce. La règle d'or c'est qu'un élément cliquable doit être au moins 44 par 44 pixels. Plus petit et vous le manquez, ou appuyez sur quelque chose à côté par accident. Sur beaucoup de sites hôteliers le bouton de réservation est trop petit, s'assoit trop près d'autres éléments ou disparaît sous la ligne de flottaison (tout ce que vous voyez sans faire défiler).

Formulaires qui ne coopèrent pas. Un sélecteur de date construit pour un clic de souris ne fonctionne pas sur un écran tactile. Un champ d'entrée qui n'ouvre pas automatiquement le clavier dans le bon format (chiffres pour les numéros de téléphone, e-mail pour le champ e-mail) crée de la friction. Chaque moment supplémentaire de frustration augmente la chance que le client quitte le formulaire.

Texte trop petit ou trop serré. Le texte courant en petite police ne fonctionne pas sur un écran que vous tenez à 40 centimètres de votre visage. Une taille de police de 16 pixels ou plus pour le texte courant c'est une limite dure. Les lignes trop serrées sont difficiles à lire, surtout sur un écran lumineux au soleil.

Navigation qui ne fonctionne pas sur un petit écran. Une barre de menu horizontal avec six éléments ne rentre pas sur un téléphone. Pourtant beaucoup de sites coupent juste ce menu ou le réduisent à l'illisibilité. Un menu hamburger ou un menu repliable c'est la solution standard pour mobile, à condition que le client trouve réellement le bouton de réservation dedans.

Le module de réservation lui-même. Si votre module de réservation n'est pas construit mobile-first, le flux tout entier trébuche au moment où cela importe. Les bons sélecteurs de date sur mobile rentrent le calendrier sur l'écran, ne vous demandent pas d'entrer des codes et confirment la réservation en aussi peu d'étapes que possible.

Points d'intérêt mobile en un coup d'œil

Plan étape par étape: vérifiez et améliorez votre site mobile

Vous n'avez pas besoin d'un nouveau site pour améliorer le mobile. Commencez par où il est maintenant.

Étape 1: mesurez votre situation mobile. Allez à Google Analytics et regardez sous Utilisateurs la part mobile vs. ordinateur de bureau. Notez le pourcentage. Ensuite ouvrez PageSpeed Insights, entrez votre URL et vérifiez le score mobile. Tout ce qui est au-dessous de 50 c'est urgent, tout ce qui est entre 50 et 70 c'est améliorable, au-dessus de 90 c'est bon.

Étape 2: ouvrez votre propre site sur votre téléphone. Faites-le dans une fenêtre incognito pour ne pas voir une version mise en cache. Essayez les choses suivantes: trouvez le bouton de réservation sans faire défiler, appuyez dessus, essayez de choisir une date, remplissez le formulaire et arrêtez à l'étape du paiement. Notez où vous sentez de la friction.

Étape 3: s'attaquez aux images. Les images sont dans la plupart des cas le plus grand coupable pour le temps de chargement. Comprimez toutes les images sur votre site à moins de 200 Ko chacune, de préférence au format WebP que les navigateurs modernes supportent. Les outils comme Squoosh ou TinyPNG le font gratuitement.

Étape 4: vérifiez les boutons. Est-ce que tous les boutons et liens font au moins 44 par 44 pixels? Le bouton de réservation est-il au-dessus de la ligne de flottaison sur mobile, ou le client doit-il faire défiler? Si votre bouton de réservation n'apparaît sur le téléphone qu'après le défilement, corrigez cela d'abord.

Étape 5: testez votre formulaire de réservation. Parcourez le processus de réservation complet sur votre téléphone. Est-ce que le sélecteur de date fonctionne? Le clavier s'ouvre-t-il automatiquement dans le bon format? Combien d'étapes de la sélection d'une date à la confirmation? Si vous sentez de la friction n'importe où, un client aussi.

Étape 6: réglez votre navigation. Si votre menu est difficile à lire ou utiliser sur mobile, laissez-le réduire à un menu hamburger avec le bouton de réservation comme premier élément. Assurez-vous que le bouton de réservation reste visible dans le menu même si le client a défilé vers le bas.

Erreurs courantes dans l'optimisation mobile

Seulement tester sur ordinateur de bureau. Vous faites des changements et ensuite vérifiez seulement sur l'ordinateur s'ils fonctionnent. Ouvrez votre site sur un vrai téléphone après chaque changement, pas seulement redimensionner la fenêtre du navigateur.

Oublier le module de réservation. Un site rapide et clair sur mobile mais dont le module de réservation ne coopère pas perd le client au moment décideur. L'optimisation mobile ne s'arrête pas à la page d'accueil, elle va à travers à la confirmation de réservation.

Laisser un tableau trop large. Les tableaux avec plusieurs colonnes, comme un aperçu de chambre ou un tableau de prix, sortent de l'écran sur mobile. Le client ne voit pas la colonne de droite. Corrigez cela avec une vue mobile adaptée: des cartes par type de chambre au lieu d'un tableau horizontal.

Penser qu'un score de 70 c'est suffisant. Un score PageSpeed de 70 signifie toujours des points d'amélioration qui coûtent des visiteurs. Sur mobile: chaque seconde de temps de chargement en moins apporte plus de visiteurs qui restent.

Trop de pop-ups ou de bandeaux. Sur un écran de bureau une banneau de cookie et un message de bienvenue rentrent ensemble. Sur mobile ils occupent la moitié de l'écran. Google pénalise les sites avec des pop-ups intrusifs sur mobile dans les résultats de recherche. Gardez l'écran propre.

Mesurer le mobile: regardez le mobile séparément, pas la moyenne

Beaucoup d'hôteliers regardent un pourcentage de conversion et pensent avoir le tableau complet. C'est faux. Divisez toujours vos chiffres par mobile vs. ordinateur de bureau. Dans Google Analytics faites-le sous Public, Appareils. Ce que vous voyez presque toujours: le bureau convertit plus haut, le mobile plus bas, et la plupart du trafic vient sur mobile.

Disons que vous avez 1.000 visiteurs par mois, 600 d'entre eux sur mobile. Sur ordinateur de bureau 3 pour cent réservent, sur mobile 1 pour cent. C'est 12 réservations de bureau et 6 réservations mobiles. Relevez le pourcentage mobile de 1 à 2 pour cent et vous gagnez 6 réservations par mois sans dépense publicitaire supplémentaire. C'est exactement pourquoi le mobile c'est le premier endroit à chercher quand vous voulez optimiser la conversion.

Mesurez, séparez-le, et calculez la différence en réservations. Une moyenne cache l'écart qui vous coûte le plus d'argent.

Ce que vous pouvez faire maintenant

Commencez aujourd'hui par trois choses: ouvrez votre site sur votre téléphone, notez les trois endroits où vous sentez de la friction, et vérifiez votre score PageSpeed pour mobile. Ces trois étapes prennent une demi-heure et vous donnent un point de départ concret.

Pour la plus large checklist de ce qu'un site d'hôtel doit minimalement avoir, lisez ce qu'un site web d'hôtel minimalement a besoin. La relation entre le temps de chargement et les réservations est travaillée dans vitesse de page pour votre site d'hôtel. Et si vous voulez savoir si vos boutons sont correctement placés sur mobile, vérifiez boutons d'appel à l'action qui fonctionnent pour les hôtels.

Vous voulez savoir ce qu'un chargement plus rapide et une meilleure expérience mobile livre en euros de réservations directes? Calculez-le via le calculateur d'économies. Préférez l'avoir fait? Voyez ce qu'est possible avec créer un site web pour les hôtels.