You are currently viewing Site mobile : garder les détails utiles sur les bus et trolleybus lyonnais

Site mobile : garder les détails utiles sur les bus et trolleybus lyonnais

Sur ordinateur, un numéro de parc tient dans une ligne. Sur téléphone, il peut être tronqué. Pour qui cherche à identifier un trolleybus aperçu sur la ligne C3, ce n’est pas qu’un défaut d’affichage : le détail qui permet de distinguer deux véhicules a disparu. Adapter un site au mobile, c’est d’abord veiller à ce que ces informations restent accessibles sur un écran étroit.

Les lecteurs d’un site consacré aux bus et trolleybus lyonnais n’y viennent pas tous pour la même raison. Un passager cherche le contexte d’une modification de ligne ; un amateur compare sa photo à une fiche de parc ; un autre veut retrouver une brève sur une livraison. Aucun n’a besoin d’une version appauvrie du site. En revanche, l’ordre et la présentation des informations doivent tenir compte de leur façon de consulter la page.

Le téléphone change les conditions de lecture

Sur un écran étroit, une photographie, un tableau, un titre long et une navigation latérale ne peuvent pas se partager l’espace comme sur ordinateur. La lecture change aussi : on fait défiler au doigt, on touche un lien plutôt que de le viser à la souris, parfois en plein soleil, debout ou avec une connexion irrégulière.

Ces contraintes peuvent brouiller une information pourtant exacte. Dans une brève annonçant l’arrivée d’un modèle, le lecteur doit pouvoir repérer ce qui est confirmé, la période concernée et ce qui reste inconnu. Si un titre très long et une grande image repoussent les premiers faits plusieurs écrans plus bas, il risque de repartir avec une idée incomplète. Il ne s’agit pas forcément de raccourcir le texte, mais de rendre sa hiérarchie plus nette.

Consultation d’une page de transport sur téléphone à l’arrêt

Faire apparaître le contexte avant les détails secondaires

Une fiche de véhicule peut présenter d’emblée le modèle, la motorisation et le statut de l’information, puis les observations, les photographies et l’historique. Cela n’autorise pas à confondre une observation avec une affectation officielle. La mention « observation photographique », placée à côté de la donnée concernée, évite qu’une présence ponctuelle sur une ligne passe pour une affectation durable. Sur téléphone, une précision reléguée dans une note éloignée perd facilement son utilité.

Un site mobile ne doit pas effacer les données de parc

Les tableaux sont souvent les premiers sacrifiés. Retirer des colonnes pour les faire tenir à l’écran peut rendre une liste plus propre, mais aussi faire disparaître l’année, le modèle ou la nuance indispensable à la lecture d’un mouvement de parc. Selon le contenu, on peut proposer un défilement horizontal bien signalé, présenter chaque ligne sous forme de fiche verticale ou distinguer une vue synthétique du tableau détaillé. L’essentiel est que chaque valeur reste associée à son libellé.

Dans une liste de véhicules, la fiche verticale peut afficher d’abord « modèle », « série », « état connu » et « dernière mise à jour », puis les renseignements complémentaires. Pour comparer plusieurs séries, mieux vaut parfois conserver les colonnes et indiquer clairement qu’elles se parcourent horizontalement. Identifier un bus n’appelle pas la même présentation que comparer plusieurs générations d’Urbanway, de GX ou de trolleybus.

Les incertitudes méritent la même attention que les faits établis. Si le dépôt d’attache n’est pas confirmé, un tiret isolé ressemble à un oubli. La mention « non confirmé » reste claire sur tous les écrans et limite le risque qu’une capture sortie de son contexte fasse passer une hypothèse pour un fait.

Photographies et cartes : montrer sans gêner la lecture

Une galerie peut être la raison principale d’une visite. Sur téléphone, les clichés doivent rester assez grands pour distinguer une face avant ou un détail de livrée, sans obliger à télécharger d’emblée toute une série. Des fichiers adaptés à l’affichage, plusieurs tailles d’image et le chargement différé des vues situées plus bas dans la page réduisent l’attente. Le document original peut rester disponible séparément lorsqu’il est proposé à la consultation.

Une légende accessible seulement au survol de la souris ne sert à rien sur un écran tactile. Elle peut préciser le modèle, le lieu s’il est connu et ce que montre réellement le cliché. Il faut aussi contrôler les vignettes sur plusieurs formats : un recadrage automatique peut couper un numéro de parc situé au bord de la carrosserie. La photo paraît alors réussie, mais perd l’indice qui justifiait sa présence dans la fiche.

Même vigilance pour les cartes. Si un plan capte tous les gestes de défilement, il devient difficile de poursuivre la lecture. Des commandes adaptées au toucher et, lorsque c’est pertinent, une liste textuelle des lignes ou des lieux représentés permettent de retrouver l’information même quand la carte se charge mal.

Navigation tactile : retrouver une information sans fausse manipulation

Un menu mobile n’est pas la réduction à l’identique d’un menu d’ordinateur. Ses intitulés doivent permettre de distinguer les actualités du parc, les fiches de modèles, les lignes, les archives et les reportages photographiques. Le bouton qui l’ouvre doit indiquer s’il est déployé et rester utilisable au clavier. Dans une liste de numéros de parc, il faut aussi espacer suffisamment les liens pour qu’un doigt n’ouvre pas la fiche voisine.

La recherche interne doit répondre aussi bien à « Cristalis » qu’à un numéro précis ou à une ligne. Avec des titres de résultats trop génériques, une ancienne observation se confond vite avec une fiche actualisée. La date de publication, celle de mise à jour quand elle est pertinente et un court extrait aident à faire le tri. L’organisation de ces accès est abordée dans l’article consacré à l’accueil d’un site sur les bus et trolleybus lyonnais ; sur téléphone, il faut encore vérifier qu’ils restent visibles sans masquer le contenu.

Quelques contrôles sur un vrai téléphone

  • Ouvrir une fiche depuis le menu, puis revenir à la liste : la position de lecture est-elle conservée ?
  • Toucher deux liens proches sans zoomer : chacun mène-t-il à la bonne page ?
  • Faire défiler un tableau et une carte : peut-on continuer à parcourir la page sans difficulté ?
  • Agrandir le texte dans les réglages du téléphone : les libellés, les dates et les boutons restent-ils lisibles ?
  • Consulter une page avec une connexion lente : le texte apparaît-il avant les éléments les plus lourds ?

Ces essais complètent les aperçus des outils de développement. Une simulation donne la largeur disponible ; elle reproduit moins bien un doigt face à deux liens serrés, les reflets sur une photo ou l’attente pendant le chargement.

Performance et accessibilité servent la même lecture

Un site rapide sur ordinateur peut rester pénible à consulter sur téléphone. Une grande bannière qui se charge avant le titre retarde l’accès au texte ; des blocs qui bougent pendant la lecture font perdre le fil. Réserver l’espace des images limite ces déplacements. Alléger les fichiers et éviter de charger les ressources inutiles aide aussi lorsque le réseau est faible.

La taille des caractères ne suffit pas à garantir une lecture confortable. Le contraste, l’espacement des paragraphes et des intitulés explicites comptent dehors comme avec un texte agrandi. La couleur ne doit pas être le seul indice permettant de distinguer un véhicule en service d’un véhicule retiré : il faut un libellé. Quant au texte de remplacement d’une photo, il doit décrire l’information visuelle utile sans recopier la légende. Voir la perche d’un trolleybus sous la ligne aérienne n’apporte pas le même renseignement qu’une simple vue de la carrosserie.

Même fiche de véhicule adaptée à deux écrans

Mesurer les problèmes avant de modifier tout le site

Une amélioration du site mobile ne passe pas nécessairement par un nouveau thème graphique. Les pages les plus consultées peuvent faire apparaître des défauts précis : résultats de recherche difficiles à départager, galerie trop lente, tableau coupé ou menu qui cache le début d’un article. Les statistiques montrent où regarder, pas pourquoi un lecteur quitte la page. Il faut les compléter par des essais sur des parcours concrets.

Par exemple : retrouver une observation photographique, ouvrir la fiche du modèle, puis vérifier la date de l’information. Si ce parcours impose plusieurs retours en arrière ou si la date se cache dans une section repliée, changer les couleurs du site ne résoudra rien. Mieux vaut corriger ce trajet, puis le refaire sur un téléphone étroit et sur un écran plus large.

Avant de publier la prochaine fiche de trolleybus, ouvrez-la sur un téléphone. Sans zoomer, cherchez le modèle, le statut de l’information et la légende de la première photo. Si l’un des trois échappe à cette première lecture, c’est cette fiche qu’il faut ajuster.