Principes du développement front-end centré sur l'utilisateur

Nœud source: 1854507

Principes du développement frontal centré sur l'utilisateur

Colin Oakley

En tant que développeur front-end, il est parfois difficile de se placer dans une entreprise ou même dans un projet. Les principes peuvent aider à encadrer ce que nous faisons et nous donner une orientation.

J'ai adoré le cadrage du front-end de 'Pourquoi devriez-vous embaucher un développeur frontendr '

Le Web que nous choisissons de créer doit refléter cela, comment ne pas créer de barrières pour les personnes qui souhaitent utiliser nos sites Web ou nos services ?

J'y ai réfléchi avec un autre développeur front-end DWP James Gordon lorsque nous parlions des principes de base.

Nous avons largement spl'a rendu accessible, agnostique, robuste, performant et sécurisé.

Cela a suivi un modèle similaire à l'excellent "Principes de conception front-end» à partir de 2013. Nous permettant de regrouper nos motivations en deux catégories : les bénéfices pour l'utilisateur, et les bénéfices pour les développeurs.

Avec chacun de ces principes, il est possible que nous créions des barrières pour les utilisateurs qui les empêcheraient d'accéder à ce que nous avons produit.

Souvent, lorsque nous avons des obstacles comme ceux ci-dessous, cela indique un manque de conception inclusive.

Ces principes s'alignent sur les Norme de service GDS et aide 'Assurez-vous que tout le monde peut utiliser le service' et s'intègre dans certains des éléments de DdaT pour les développeurs front-end.

  • Accessible — Utilisez du HTML sémantique et assurez-vous que nous respectons au minimum la norme WCAG 2.1 AA et qu'il fonctionne avec les technologies assistées Manuel d'accessibilité DWP)
  • Agnostique — Construisez d'abord mobile et faites-le fonctionner sur une gamme d'appareils et de contextes d'utilisateurs
  • Robuste — Utilisez l'amélioration progressive, assurez-vous que ce que nous construisons échoue gracieusement
  • performant — Optimiser notre code/actifs pour les meilleures performances possibles sur une gamme de réseaux et d'appareils
  • Sécurisés — Créer un service sécurisé qui protège la vie privée des utilisateurs. Utilisez des politiques de sécurité de contenu strictes et protégez-vous contre les Attaques OWASP.

Ce sont un point de départ qui sera réitéré plus loin. Ils doivent également être mis à côté des normes de conception.

Dans la pratique, lorsque nous ne pensons pas à nos utilisateurs, nous créons finalement des barrières et faisons échouer nos utilisateurs.

Accessible

L'exemple le plus poignant en est probablement le problèmes avec le site Web de recherche de vaccins Covid du gouvernement fédéral australien. Cela signale que les personnes aveugles ou malvoyantes ne peuvent pas utiliser le site Web.

Nous avons potentiellement exclu certains des plus vulnérables en créant un site Web non accessible.

Agnostique

C'est un cas similaire lorsque nous parlons d'autres parties du Web que nous construisons.

Lorsque nous construisons des sites Web non agnostiques, nous créons des barrières pour les personnes qui n'y ont pas accès, un bon exemple en est lorsque nous testons nos sites Web uniquement sur des smartphones haut de gamme à grand écran. Nous devons nous assurer que cela fonctionne sur une gamme de plates-formes et d'appareils.

Robuste

Avec des sites Web qui ne sont pas robustes, lorsque nous supprimons JavaScript ou CSS, avons-nous toujours un site Web fonctionnel ?

Que faire si un utilisateur ne peut pas se connecter ? Quelle expérience peut-on leur donner ?

« Est-ce que ça échoue ? » reste avec moi de Jérémy Keith d'une mise en œuvre technique et de conception.

performant

Du point de vue des performances, nous devons réfléchir au fonctionnement de notre service sur des connexions réseau lentes et à la quantité de données que nous envoyons à l'utilisateur et optimisées autant que possible.

25 Mo d'images peuvent ne pas sembler beaucoup, mais si je suis sous contrat de données de 500 Mo et que j'ai utilisé 10% de mon allocation de données parce que vous n'avez pas optimisé ou mis en cache vos images, cela devient plus un problème.

Sécurisés

La sécurité est probablement l'un des sujets les plus difficiles à aborder, j'ai récemment terminé un travail sur le Faire une demande de pension alimentaire pour enfants service où plus de la moitié des personnes qui postulent nous disent qu'elles ou leurs enfants ont été victimes d'abus ou de harcèlement. Un manque de sécurité pour ces personnes peut signifier une compromission d'identité.

Le 'Cacher cette page' est un parfait exemple de collaboration inter-rôles et inter-équipes pour s'assurer que nos utilisateurs se sentent en sécurité en ligne pour utiliser un service.

Avec tous ces principes, je ne suis pas l'utilisateur.

Je n'ai pas (encore) besoin d'accès ou un plan de données limité, mais grâce aux normes, à la collaboration avec les concepteurs et au sein du gouvernement, aux tests et à la recherche sur les utilisateurs, je peux obtenir un contexte et aider à rendre le Web que nous choisissons de construire plus inclusif.

Source : https://colinoakley.medium.com/the-web-we-choose-to-build-e921510e3f1b

Horodatage:

Plus de Astuces CSS