Intranet mobile-first : faciliter le travail quotidien sur smartphone

Un collaborateur ne devrait pas avoir à retourner à son bureau pour lire une actualité, trouver une politique interne ou contacter un collègue. La conception d’un intranet mobile doit rendre ces tâches quotidiennes simples partout où les collaborateurs sont autorisés et en mesure de travailler.

Pour les équipes de terrain et de première ligne, le smartphone peut être le principal accès aux informations de l’entreprise. Pour d’autres, c’est une commodité occasionnelle entre deux réunions ou loin de leur poste. Dans tous les cas, faire tenir une page de bureau sur un écran plus petit n’est qu’un début. La connexion, la navigation, la lecture, les formulaires et les téléchargements méritent tous une attention particulière.

Partez des tâches que les collaborateurs doivent accomplir, puis concevez et testez l’ensemble du parcours.

Dans cet article :

• Pourquoi l’expérience sur smartphone mérite-t-elle une attention propre ?
• Pourquoi une page de bureau réduite ne suffit-elle pas ?
• Comment rendre les tâches quotidiennes confortables sur smartphone ?
• Comment garder un intranet léger en données mobiles ?
• Comment garder l’accès mobile inclusif ?
• Comment tester avec les collaborateurs et continuer à s’améliorer ?

Pourquoi l’expérience sur smartphone mérite-t-elle une attention propre ?

Un technicien itinérant a besoin du numéro de téléphone d’un collègue. Une employée postée veut consulter une information opérationnelle avant sa prise de poste. Une personne en visite dans un autre site doit ouvrir la politique de déplacements.

Ce sont de petites tâches, mais un intranet peu pratique les transforme en retards. Si la réponse est « trouvez un ordinateur », l’accès pratique a déjà échoué.

Lors du recueil des besoins, interrogez les collaborateurs sur leurs conditions de travail réelles :

• Quelles tâches doivent-ils accomplir sur smartphone ?
• Qui dépend de l’accès mobile, et qui l’utilise occasionnellement ?
• Quels appareils professionnels, personnels ou partagés sont autorisés ?
• De quelles connexions disposent-ils sur leur lieu de travail ?
• Les pauses courtes, une forte luminosité ou des interruptions fréquentes affectent-elles l’usage ?

Ne supposez pas que tout le monde travaille dans les mêmes conditions. Un employé d’entrepôt utilisant un appareil partagé sur le Wi-Fi de l’entreprise n’a pas les mêmes besoins qu’une collaboratrice de terrain équipée d’un téléphone attribué.

Mettez-vous d’accord sur les tâches mobiles prioritaires et les modes d’accès autorisés avant de concevoir la page d’accueil. Les RH et l’IT doivent également préciser si les téléphones personnels sont autorisés et quelles alternatives existent pour les collaborateurs. L’accès aux informations essentielles ne doit pas dépendre d’une attente implicite selon laquelle les collaborateurs fourniraient leur propre appareil ou paieraient leurs données.

Pourquoi une page de bureau réduite ne suffit-elle pas ?

Une mise en page responsive adapte le contenu à l’écran. Une expérience mobile utile va plus loin : elle permet d’accomplir une tâche confortablement au toucher.

Une page peut tenir sur un smartphone et rester difficile à utiliser. Par exemple :

• Un menu de bureau replié masque le lien que les collaborateurs utilisent le plus.
• De petites icônes sont si proches que l’on touche la mauvaise.
• Une grande bannière repousse la réponse utile tout en bas de la page.
• Un tableau large impose de faire défiler l’écran latéralement à plusieurs reprises.
• Une politique n’est disponible que sous forme de document conçu pour l’impression.

Les collaborateurs ne devraient pas avoir à demander la version ordinateur du navigateur, à zoomer avec deux doigts ou à fouiller une page pour accomplir des tâches ordinaires. Les informations essentielles ne devraient pas non plus disparaître simplement parce que l’écran est plus petit.

Prenons l’exemple de la recherche d’une politique de congés.

Avant : Une collaboratrice ouvre le menu, devine quel service est responsable de la politique, parcourt plusieurs pages et télécharge un PDF pour trouver les instructions de demande.

Après : Une recherche visible mène à une page de politique lisible. La page explique les conditions d’éligibilité et les étapes de demande dès le début, renvoie vers l’outil de gestion des congés et conserve le document officiel sous forme de téléchargement clairement identifié.

Le second parcours réduit les recherches et les téléchargements inutiles sans supprimer d’informations.

Il faut aussi distinguer la mise en page de la consommation de données. Demander la version ordinateur n’augmente pas nécessairement les téléchargements en soi. Ce sont les ressources demandées par une page qui déterminent la quantité de données transférées. Une page responsive peut tout de même télécharger une grande image prévue pour ordinateur et se contenter de l’afficher en plus petit.

Comment rendre les tâches quotidiennes confortables sur smartphone ?

Commencez par une courte liste de priorités des collaborateurs, comme lire les actualités, trouver des contacts, consulter des politiques et soumettre des demandes. Donnez à ces tâches un chemin clair plutôt que de réduire uniformément chaque composant de la version ordinateur.

Rendez la navigation prévisible. Gardez la recherche facile à trouver et utilisez des libellés de destination familiers comme « Personnes », « Politiques » et « Aide ». Un menu compact peut regrouper les destinations moins utilisées, tandis qu’un petit ensemble d’actions fréquentes reste visible. Gardez ces libellés et leurs positions cohérents d’une page à l’autre.

Les commandes tactiles ont besoin d’assez d’espace pour distinguer une action d’une autre. Évitez les interactions qui dépendent du survol, et ne comptez pas sur une icône inexpliquée lorsqu’un court libellé lèverait le doute.

Placez la réponse avant la décoration. Sur une page de politique, commencez par ce que les collaborateurs doivent savoir et ce qu’ils doivent faire ensuite. Utilisez un texte lisible, des titres explicites et des sections courtes. Une grande image d’introduction ne doit pas s’interposer entre une personne et une réponse urgente.

Publiez les consignes du quotidien sous forme de pages web lorsque c’est possible. Gardez les documents originaux requis disponibles, mais identifiez-les clairement afin que les collaborateurs puissent décider s’ils ont besoin du téléchargement.

Rendez les formulaires tolérants. Un smartphone n’est pas un endroit confortable pour remplir des champs inutiles. Pour chaque formulaire :

• Ne demandez que les informations nécessaires au traitement de la demande.
• Utilisez des types de saisie adaptés, comme un champ e-mail pour une adresse e-mail.
• Conservez des libellés visibles plutôt que de vous appuyer sur un texte indicatif.
• Expliquez les erreurs à côté du champ concerné et indiquez comment les corriger.
• Conservez les saisies valides après une erreur.
• Le cas échéant, proposez un moyen sécurisé d’enregistrer la progression en cas d’interruption.

Toute donnée de formulaire enregistrée doit être soumise à des règles de traitement adaptées à sa sensibilité, en particulier sur les appareils partagés.

Considérez la connexion comme une partie de la tâche. Testez la connexion d’entreprise, les demandes d’authentification, les redirections et le retour vers la page visée. Un collaborateur qui ouvre le lien d’une politique ne doit pas atterrir sur la page d’accueil et devoir recommencer sa recherche. Corrigez les parcours interrompus sans affaiblir l’authentification.

Suivez aussi la tâche au-delà de l’intranet. Une page de demande utilisable n’apporte pas grand-chose si son bouton ouvre un service RH connecté difficile à utiliser sur smartphone.

Intégrez ces modèles dans un design system réutilisable. Des champs de recherche, une navigation, des boutons, des messages d’erreur de formulaire, des libellés de téléchargement et des modèles de politique partagés réduisent le travail répété de conception et de test. Documentez le comportement de chaque composant sur petit écran et avec les technologies d’assistance. Désignez un responsable du design system afin que les nouvelles pages réutilisent des modèles testés au lieu d’introduire une interaction différente à chaque fois.

Comment garder un intranet léger en données mobiles ?

Des téléchargements plus légers aident les collaborateurs à accéder plus vite à l’information lorsqu’ils utilisent des données mobiles ou une connexion plus lente. Il s’agit de respecter leur temps et leur connectivité, pas de courir après un score technique.

Commencez par les images. Un smartphone ne devrait pas recevoir une grande image prévue pour ordinateur lorsqu’une version plus petite peut l’afficher correctement. Demandez à l’équipe de réalisation de vérifier la sélection des images en fonction de la taille de l’écran et de la densité de pixels. Le guide web.dev sur les images responsives explique comment les navigateurs peuvent choisir les ressources d’image adaptées.

Passez ensuite en revue ce que charge chaque page :

• Compressez les images et choisissez des formats adaptés sans rendre illisibles les détails importants.
• Supprimez les scripts et widgets tiers qui ne servent pas la tâche.
• Évitez la lecture automatique des vidéos et laissez les collaborateurs choisir quand charger les médias.
• Donnez la priorité au contenu nécessaire pour lire ou agir au lieu d’attendre chaque élément facultatif.
• Indiquez le type et la taille des documents avant le téléchargement lorsque c’est possible.

Pour une pièce jointe volumineuse, demandez-vous si un court résumé sur une page web peut répondre à la question immédiate. Une personne qui vérifie une échéance de note de frais ne devrait pas avoir à télécharger un manuel entier. Gardez le document complet disponible lorsque les détails comptent.

Testez à la fois une première visite et une visite répétée. Les ressources mises en cache peuvent accélérer une nouvelle visite tout en masquant le coût supporté par quelqu’un qui ouvre la page pour la première fois. Vérifiez des connexions plus lentes représentatives ainsi que le Wi-Fi du bureau.

Demandez à l’équipe technique d’examiner les données transférées et les requêtes lentes dans les outils de développement du navigateur. Les éditeurs peuvent choisir des médias adaptés et rédiger des résumés utiles ; on ne devrait pas attendre d’eux qu’ils mettent en œuvre la diffusion d’images responsives, le chargement des scripts ou la mise en cache.

Fixez les attentes en matière de performance autour des tâches convenues et des conditions de travail réelles. « Un collaborateur peut lire l’information de poste sans attendre le chargement des médias facultatifs » est un point de départ plus utile qu’un score inexpliqué.

Comment garder l’accès mobile inclusif ?

L’accessibilité est une exigence pour un outil destiné aux collaborateurs, pas une finition facultative. Les collaborateurs ayant un handicap visuel, auditif, moteur ou cognitif peuvent avoir besoin de différentes façons de lire, de naviguer et d’interagir.

Intégrez ces éléments essentiels dans les modèles de page et les composants :

• Un contraste lisible et un texte qui peut être agrandi sans masquer le contenu ou les actions.
• Des titres explicites et des libellés de formulaire clairs.
• Des sous-titres pour les vidéos contenant des informations orales.
• Des commandes aux noms compréhensibles qui fonctionnent avec les technologies d’assistance.
• Un focus clavier visible et un ordre de navigation logique.

Certains choix aident aussi dans des conditions quotidiennes, comme une forte luminosité ou une utilisation à une main. Ces bénéfices ne remplacent pas les besoins des collaborateurs en situation de handicap.

Un design responsive ne rend pas automatiquement un intranet accessible. Ajoutez des vérifications au clavier et avec un lecteur d’écran mobile aux tests tactiles. Utilisez les WCAG comme référence pour les critères d’acceptation, le guide du W3C sur l’accessibilité mobile apportant des orientations complémentaires.

Comment tester avec les collaborateurs et continuer à s’améliorer ?

Testez des tâches réelles sur des smartphones représentatifs avant un déploiement à grande échelle. Réduire une fenêtre de navigateur sur ordinateur aide pendant la conception, mais ne peut pas reproduire chaque interaction tactile, clavier à l’écran, redirection de connexion ou comportement d’un lecteur d’écran mobile.

Recrutez des collaborateurs parmi les groupes identifiés lors de la phase de recherche. Incluez leurs appareils, navigateurs, conditions de réseau et besoins d’accessibilité. Organisez les sessions dans un cadre sûr, jamais pendant que quelqu’un conduit ou utilise un équipement.

Utilisez un plan de test compact :

Tâche	Condition de test	Ce qu’il faut observer
Se connecter depuis le lien d’une actualité	Téléphone autorisé avec authentification d’entreprise	Le collaborateur peut-il terminer la connexion et atteindre l’actualité visée ?
Trouver une politique de congés	Téléphone en mode portrait, sans accompagnement	La recherche et les libellés sont-ils compréhensibles ? La réponse est-elle lisible sans zoomer à répétition ?
Ouvrir un fichier	Connexion plus lente représentative	Le type et la taille du fichier sont-ils clairs ? Le fichier s’ouvre-t-il dans une visionneuse utilisable ?
Trouver un collègue	Utilisation tactile et vérification avec un lecteur d’écran mobile	Le collaborateur peut-il identifier la bonne personne et utiliser l’action de contact ?
Remplir un court formulaire	Clavier à l’écran, une erreur volontaire et une interruption	Les erreurs sont-elles claires ? Les saisies valides sont-elles conservées ? Le collaborateur peut-il reprendre en toute sécurité ?

Demandez aux participants d’accomplir les tâches sans accompagnement. Repérez les appuis manqués, les menus déroutants, les défilements latéraux répétés, les téléchargements lents et les saisies de formulaire perdues. Si quelqu’un se retrouve bloqué, notez où et pourquoi avant de lui montrer le chemin prévu.

Convenez d’attentes au niveau des tâches avant le pilote. Par exemple, un collaborateur devrait pouvoir trouver une politique avec le vocabulaire courant de son environnement de travail et suivre son lien de demande sans passer sur un ordinateur. Utilisez les observations du pilote pour définir des attentes réalistes sur le temps de réalisation plutôt que de choisir des objectifs arbitraires.

Combinez ces constats avec les données agrégées d’usage mobile disponibles et les retours des collaborateurs. Le trafic seul ne prouve pas le succès : une visite courte peut signifier une réponse rapide ou une tâche abandonnée. Cherchez-en la cause.

Attribuez les corrections aux responsables concernés, notamment l’UX, l’IT, les responsables de contenu et les équipes des services connectés. Levez les obstacles aux tâches prioritaires avant un déploiement plus large, puis répétez les tests clés après toute modification des menus, modèles, formulaires ou intégrations.

Maintenez un canal de retour qui fonctionne sur smartphone. Les collaborateurs ne devraient pas avoir besoin d’un ordinateur pour signaler que l’accès mobile leur fait défaut.

Prêt à rendre votre intranet plus pratique sur smartphone ?

Choisissez une tâche courante des collaborateurs et testez-la sur les appareils et les connexions que vos collègues utilisent réellement. Commencez par la connexion, suivez chaque lien et vérifiez si la tâche peut être accomplie sans contournement.

Si vous préparez un nouvel intranet, échangez avec l’équipe Open Intranet sur la configuration et les tests de l’expérience mobile autour de ces tâches. Construit sur Drupal, Open Intranet est un point de départ Open Source ; l’ergonomie, la performance et l’accessibilité exigent malgré tout une conception et des tests réfléchis. Partez du travail que les collaborateurs doivent accomplir, puis construisez l’expérience autour.