Share
Les concepteurs ont un impact considérable sur les performances du site en fonction Comment ils conçoivent pour le Web, avant qu'une seule ligne de code ne soit écrite. Cet article explique comment la performance peut être conçu et ce qu'il faut pour y arriver.
Pourtant, la plupart des concepteurs ignorent souvent les performances. Cela se produit pour plusieurs raisons, mais cela revient souvent au fait que les concepteurs prennent en compte les temps de chargement quelqu'un d'autre emploi.
De nombreux articles expliquent comment créer un site Web plus rapidement et fournissent presque toujours des astuces telles que la réduction de la taille de vos feuilles de style et l'optimisation de vos images. Ces conseils sont utiles et importants, mais ne résolvent pas le problème sous-jacent.
L'étape la plus essentielle est moins tangible - elle nécessite un changement de mentalité. Créer des sites Web rapides nécessite de la retenue et de la concentration. Peu importe le temps que vous consacrez à l'optimisation, un site Web contenant trois mille lignes de CSS, dix plugins jQuery et cinq images à fond perdu sera créé. lent. Les performances peuvent être améliorées, mais vous ne verrez pas d'excellents résultats tant que vous n'en ferez pas un principe de conception fondamental..
Concevoir en fonction des performances exige un engagement à maximiser les nécessités et à éliminer les objets de luxe superflus. Une approche plus utilitaire de la conception est nécessaire, chaque élément ayant un impact positif tangible et net sur le résultat final. Cela ne nie pas l'importance de l'esthétique, cela signifie plutôt qu'il ne faut pas donner un chèque en blanc.
Il va sans dire que les concepteurs connaissent l'importance de la simplicité. Cependant, l'efficacité est souvent négligée dans le lexique du concepteur. Simple et efficace ne sont pas nécessairement liés. De nombreux sites "bien conçus" sont beaux, clairs, intuitifs et absolument gonflé.
En tant que concepteurs, nous voulons créer quelque chose qui fasse appel à nos sens visuels. Nous voyons beaucoup de sites qui utilisent des photographies haute fidélité, des textures et des détails de finition à la broche pour atteindre cet objectif. Il est souvent difficile de contester les résultats sur une base strictement visuelle. Cependant, nous devons nous demander si ces éléments lourds travaillent pour résoudre des problèmes d’expérience réelle ou s’ils sont tout simplement bons à regarder..
Concevoir efficacement vous oblige à créer une expérience tout aussi significative avec Moins. Pouvez-vous capter l'intérêt et l'imagination de votre public sans avoir recours à une image à fond perdu? Je dirais que vous pouvez et que cela en vaut la peine.
La page d'accueil de Karma est un exemple de conception simple mais inefficace. La conception de Karma est magnifique et claire, mais pèse environ 1 Mo sur 45 demandes. Ne vous méprenez pas, j'aime beaucoup l'aspect du site Web de Karma. Il échoue simplement au test de performance et fait donc défaut en tant que conception réussie..
Un design efficace n'est pas par nature brutal et sans personnalité. L'existence de chaque élément a plutôt été vérifiée et justifiée. Les designs efficaces ne manquent pas de style, il y a juste très bonne raison pourquoi ce style a été ajouté. Il est facile de trouver quelque chose sur Dribbble et de l’ajouter à nos créations car il a bonne apparence. Une approche insensée de la conception crée de l'inefficacité.
On a beaucoup parlé de design plat. Il semble qu'un style minimaliste aiderait la vitesse, mais ce n'est pas nécessairement le cas. Design plat pouvez réduisez les empreintes de page, mais ce n’est pas une garantie. L'exemple ci-dessus du site Web de Karma est la preuve.
Il existe certes des styles visuels prédisposant à de meilleures performances, mais cela se résume à l'exécution et à la manifestation du style dans la conception finale. L'esthétique ne remplace pas la performance comme un objectif fondamental.
Maintenant que j'ai parlé dans l'abstrait, il est peut-être temps d'entrer dans quelques exemples sur la façon de l'appliquer. Voici quelques conseils:
Essayez de commencer une conception sans compter sur des solutions faciles. Je commence le processus de conception sans utiliser d'images, de typographie personnalisée et de trois grammages de police (normal, gras, italique). Voyez jusqu'où vous pouvez aller en utilisant la couleur, le contraste et la forme. Vous pouvez toujours ajouter des polices, des images et des textures différentes ultérieurement.
L'objectif principal d'un concepteur est de communiquer. Il y a peu de meilleurs moyens de communiquer une idée que le mot écrit. Les mots peuvent aller très loin - trop souvent, nous ajoutons des éléments visuels lorsqu'une phrase claire suffit. Essayez de remplacer une image visuelle par une rédaction forte et une typographie bien conçue..
Il est facile de se laisser entraîner dans les nuances du design. Je le fais tout le temps. Il est important de rappeler que le rôle du concepteur est de résoudre les problèmes et non de rendre les choses plus jolies. Je crois fermement qu'une esthétique forte crée la confiance avec un utilisateur et contribue à créer une réponse émotionnelle. Cependant, l'esthétique devrait toujours prendre en charge les problèmes que nous sommes invités à résoudre (par exemple amélioration de la convivialité, achèvement plus rapide des tâches, etc.). Regarder le design à travers cet objectif aidera à créer une approche axée sur les objectifs et à centrer notre réflexion. .
Le meilleur moyen de comprendre l’impact de votre conception sur les performances est d’avoir une idée générale du type de code nécessaire pour le créer. Les navigateurs modernes ont beaucoup d’astuces cachées qui peuvent alléger votre site. et vous faciliter la vie. En sachant comment construire un site, vous saurez quoi éviter.
Des images (à la fois raster et vectorielles) peuvent être produites pour être plus petites. Nous devrions penser à créer une image comme à un fichier CSS - faire le travail avec le plus petit encombrement possible. Ce sujet pourrait faire l'objet d'un article distinct, mais l'essentiel est d'éviter les artefacts de pixels dans vos images raster et les points vectoriels inutiles dans vos SVG. Cela aura un impact significatif sur la taille du fichier.
La vitesse Web ne rentre pas dans la catégorie des sexy. La performance ne remporte pas de prix de design et ne fait pas que votre portefeuille soit loué par vos pairs. Cela a toutefois un impact sur les personnes qui comptent, celles qui utilisent le site que vous avez créé. Si vous ne concevez pas pour la performance, vous ne faites pas votre travail.
Enfin, la performance est le seul élément de l'expérience utilisateur (que je connaisse) qui soit entièrement objectif et quantifiable. Je trouve cela rafraîchissant dans une entreprise qui peut être si amorphe et subjective qu’il existe au moins une métrique où, en faisant baisser le chiffre, je peux garantir que meilleur journée.
Accentsconagua