{"id":7841,"date":"2021-03-02T20:41:45","date_gmt":"2021-03-02T19:41:45","guid":{"rendered":"https:\/\/stephaniewalter.design\/fr\/?p=7841"},"modified":"2021-03-03T09:25:47","modified_gmt":"2021-03-03T08:25:47","slug":"design-et-performance-ces-cas-oublies","status":"publish","type":"post","link":"https:\/\/stephaniewalter.design\/fr\/blog\/design-et-performance-ces-cas-oublies\/","title":{"rendered":"Design et performance : ces cas oubli\u00e9s"},"content":{"rendered":"
Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 5 ans. Il se peut qu'il ne soit plus \u00e0 jour.<\/div>

En g\u00e9n\u00e9ral, les \u00e9quipes de design livrent l\u2019\u00e9cran dans un \u00ab\u202f\u00e9tat parfait\u202f\u00bb. C\u2019est l\u2019\u00e9cran final, une fois que tout est bien charg\u00e9, avec toutes les bonnes donn\u00e9es, les bonnes images, rien ne manque, tout s\u2019est bien d\u00e9roul\u00e9. Youpi. Et ce qu\u2019il se passe avant, durant ces quelques millisecondes (ou parfois secondes) de chargement est souvent laiss\u00e9 \u00e0 l\u2019appr\u00e9ciation de l\u2019\u00e9quipe de d\u00e9veloppement. Tout comme ce qui se passe s\u2019il manque une donn\u00e9e, qu\u2019une serveur met du temps \u00e0 r\u00e9pondre, r\u00e9pond une erreur, une ressource manquante, etc. Designer ces cas oubli\u00e9s\u202fpermet grandement d\u2019am\u00e9liorer la collaboration designer \/ d\u00e9veloppeurs sur des th\u00e9matiques et d\u2019am\u00e9liorer l\u2019exp\u00e9rience utilisateur.<\/p>\n

Voici le transcript de ma conf\u00e9rence sur ce sujet \u00e0 We Love Speed 2021<\/a><\/span>. Vous pouvez aller directement \u00e0 la partie \u00ab slides<\/span><\/a> \u00bb et \u00e0 la partie \u00ab vid\u00e9o en Replay<\/a> \u00bb si vous le souhaitez.<\/p>\n

Designer ce qu\u2019il se passe durant le chargement.<\/h2>\n

Tout commence… par une page vide<\/strong>. Et ensuite, quoi ?<\/p>\n

Eh bien, en g\u00e9n\u00e9ral, vous ne voulez pas attendre que la page enti\u00e8re soit charg\u00e9e pour afficher quelque chose<\/strong>. C\u2019est l\u00e0 que mon travail de designeuse va g\u00e9n\u00e9ralement vous aider.<\/strong><\/p>\n

Car souvent, la premi\u00e8re chose \u00e0 laquelle on pense quand on dit performance, c\u2019est ce qu\u2019il se passe pendant le chargement du contenu.<\/p>\n

Si vous vous int\u00e9ressez un peu \u00e0 la performance, l’une des premi\u00e8res consignes dont vous avez d\u00fb entendre parler est l\u2019optimisation du \u201ccritical rendering path<\/span><\/strong>\u201d. Cela signifie que lorsqu’une page se charge, on veut en g\u00e9n\u00e9ral afficher aux utilisatrices et utilisateurs en priorit\u00e9 \u00ab\u00a0le contenu qui leur permettra de rester suffisamment longtemps pour que le reste de la page ait le temps de se charger.<\/p>\n

\"un

Priorit\u00e9 de contenu : faites votre recherche utilisateur<\/p><\/div>\n

Mon travail est donc de designer une solide architecture d’information<\/strong> pour ces pages pour que ce qui s\u2019affiche en haut soit suffisamment int\u00e9ressant pour que les personnes restent le temps que le reste de la page se charge.<\/p>\n

Il n’y a pas de recette \u00ab\u00a0magique\u00a0\u00bb pour y parvenir : vous devez comprendre leurs besoins <\/strong>et d\u00e9finir des priorit\u00e9s d’affichage<\/strong> de votre page : pourquoi visitent-elles cette page, que veulent-elles accomplir ?<\/p>\n

Par exemple : s’il s’agit d’un article<\/strong>, le titre<\/strong> et l’introduction<\/strong> doivent \u00eatre affich\u00e9s le plus rapidement possible afin que les visiteuses et visiteurs puissent \u00ab\u00a0au moins\u00a0\u00bb se faire une premi\u00e8re id\u00e9e de \u00ab\u00a0est-ce que je veux continuer \u00e0 lire ceci ou est-ce que je retourne d’o\u00f9 je viens ?<\/p>\n

Il existe des m\u00e9thodes d\u2019UX design qui peuvent vous aider \u00e0 \u00ab\u00a0hi\u00e9rarchiser\u00a0\u00bb ce contenu :<\/p>\n