La conception de sites web est en constante évolution. Alors que la technologie devient de plus en plus puissante et que les designers expérimentent de nouveaux styles, chaque année présente un ensemble unique de tendances passionnantes dans le monde en ligne. En s’inspirant des designs qui ont vu le jour au cours des dernières années, ainsi que des nouvelles technologies qui sont en cours de développement, il est possible de prévoir ce qui se passera au cours de l’année 2020.

Récapitulons les dernières années dans le domaine du design web et examinons les styles émergents, afin que vous sachiez à quoi vous attendre pour la nouvelle année et au-delà.

Pourquoi suivre les tendances ?

Tous les engouements pour le web design ne sont pas viables, cela est certain. Il y a un temps et un lieu pour tout, et la refonte de votre site web sans raison peut faire plus de mal que de bien, surtout quand elle se fait au prix l’ergonomie et de l’UX.

Mais bien que vous ne deviez pas faire un lifting sur votre site sans y réfléchir sérieusement, il y a certainement un certain mérite à suivre les tendances du web design, en particulier celles basées sur les avancées technologiques.

Par exemple, si vous n’avez pas entendu parler de IA de chatbots, des applications web progressives ou de grille CSS, vous pourriez utiliser une technologie dépassée qui vous fait perdre des conversions. Pensez à la façon dont le design responsive a révolutionné Internet ; vous ne voulez pas être le dernier la prochaine fois qu’un développement comme celui-là se reproduit.

Et même lorsque les tendances sont purement esthétiques, il y a toujours du mérite à les suivre. Par exemple, un site web blanc, propre et simple peut être fonctionnel. Mais avec le style plus avant-gardiste de la conception web qui s’est imposé ces dernières années, les utilisateurs le trouvent aussi assez ennuyeux.

Même de petits changements comme l’ajout de couleurs, de grilles brisées ou des animations de micro-interactions peuvent contribuer à la pertinence de votre site.

De plus, à mesure que les concepteurs de sites web évoluent, apprennent et s’adaptent aux nouvelles technologies, certaines de ces avancées et tendances sont très positives, tant sur le plan de la beauté que de la fonctionnalité. Pensez à l’aspect et au fonctionnement des sites il y a 20 ou même 10 ans… Nous avons fait beaucoup de chemin, et il nous reste encore beaucoup de chemin à parcourir.

Si vous voyez une tendance de design web moderne qui correspond à votre marque, et qui aide ou du moins ne nuit pas à l’ergonomie, cela vaut peut-être la peine de s’y mettre.

Récapitulatif : Tendances du design Web en 2018

Avec 2020 maintenant ici, 2018 semble de plus en plus loin. Mais ses tendances continuent à avoir un impact sur le web même si de nouveaux styles émergent, et comme beaucoup d’entre elles sont toujours pertinentes pour le design moderne, il est bon de regarder en arrière et de voir le chemin parcouru.

Depuis quelques années, la conception web s’éloigne de la simplicité minimaliste et s’oriente vers un individualisme audacieux, mais tout cela a atteint son apogée en 2018. On peut encore en sentir les effets aujourd’hui, et Internet continuera sûrement à se peupler de styles originaux et uniques.

Illustrations 2D, Animation 3D

Un exemple d'illustration en 2D
Un exemple d’illustration en 2D (Source : Nomadic Tribe)

Les illustrations sont l’un des meilleurs moyens de transmettre la personnalité et les dessins en 2D sont de plus en plus nombreux. Ils sont parfaits pour l’image de marque et rendent votre site web beaucoup plus mémorable, ce n’est donc pas une surprise. Un site web avec des illustrations étonnantes ne risque pas d’être oublié.

L’animation d’arrière-plan en 3D est également devenue plus populaire, grâce à la puissance accrue des navigateurs, de la technologie d’animation et des appareils comme les ordinateurs et les téléphones. Particulièrement fréquent sur les sites web de portfolios et des agences, les animations 3D attirent instantanément l’attention et offrent des possibilités d’interactivité amusantes.

À l’avenir, les illustrations et animations faites à la main ne feront que gagner en popularité. Elles mettent en valeur la personnalité de votre marque d’une manière que rien d’autre ne peut égaler (et ceci a prouvé son efficacité en tant que stratégie).

Subtilité, plat (flat) et minimalisme

Webflow
Le design plat était très populaire (Source : Webflow)

Malgré les avancées vers des styles plus originaux, le minimalisme a continué à dominer l’Internet. La simplicité propre est incontestablement attrayante, et même dans les sites qui présentaient des couleurs plus vives ou des éléments expérimentaux, elle était souvent accompagnée d’un design plat.

Cependant, le « Flat 2.0 », ou design semi-plat, a pris racine plus fortement avec son utilisation d’ombres, de dégradés et d’autres éléments légèrement plus complexes. Tant que le minimalisme existera, les designers trouveront un moyen de le mettre en valeur.

Les animations subtiles ont également occupé une grande place en 2018, avec un léger parallax et de légers effets de survol apparaissant partout. Ceux-ci ont permis aux sites web minimalistes de conserver leur simplicité tout en rendant la conception globale beaucoup plus jolie.

Design géométrique

La plupart des sites comprennent des polygones et de la géométrie dans une certaine mesure, mais la conception géométrique a joué un rôle important dans les tendances de 2018. Les sites étaient réalisés uniquement autour de formes simples comme des carrés, des rectangles et des lignes, et ils comportaient aussi des détails plus petits comme des boutons ou des boîtes décoratives.

Les formes géométriques organiques, ou celles qui sont quelque peu irrégulières et imparfaites, en constituaient une grande partie. Elles présentent souvent des coins mous et une asymétrie, et leur aspect inhabituel est plutôt intéressant. Les angles vifs des polygones et les arêtes arrondies de la géométrie organique étaient souvent combinés pour créer un contraste visuellement attrayant.

Les dessins géométriques ont régné
Les dessins géométriques ont régné (Source : GiftRocket)

Couleurs vives et audacieuses

L’Internet qui était autrefois blanc et uni est maintenant plein de couleurs, de palettes vibrantes et aventureuses à chaque coin de rue. Les jours d’une ou deux teintes sourdes dans chaque palette de couleurs s’estompent, des palettes vives et audacieuses prenant rapidement leur place.

Les dégradés sont apparus partout et demeurent un choix populaire encore aujourd’hui, leurs teintes intenses et vibrantes remplissant les en-têtes de nombreux sites importants.

Spotify
Couleurs audacieuses des volumes (Source : Spotify)

En plus des couleurs vives, il y avait des effets de distorsion et de glitch, les animations scintillantes apparaissant dans le portfolio de nombreux concepteurs ou développeurs. Bien que leur popularité ait quelque peu diminué, vous pouvez toujours les trouver sur le web.

Design en grille brisée

Startup Lab
Tous saluent la grille brisée (Source : Startup Lab)

La plupart des sites web sont construits sur une structure simple à base de grille, avec des éléments divisés en sections. Une conception de grille brisée brise cette attente, en faisant se chevaucher les éléments et en jetant la symétrie par la fenêtre. Cette disposition non conventionnelle est l’une des façons les plus évidentes de briser le moule et de se démarquer.

Un autre style qui a attiré beaucoup d’attention est le design à écran divisé, une technique qui divise l’écran en deux panneaux, chacun avec son propre contenu. Dans l’ensemble, les mises en page sont devenues beaucoup plus intéressantes.

IA et Machine Learning

Les chatbots sont une grosse affaire. Ces programmes ingénieux répondent dynamiquement aux clients, en automatisant partiellement ou complètement le processus de support ou d’achat. L’apprentissage machine leur permet d’examiner les données et d’apprendre à répondre aux questions et aux commentaires, et de soulager vos agents de support humain d’une partie de leur charge de travail.

Mais ce n’est que le début. Au fur et à mesure que la technologie progresse, l’IA et l’apprentissage machine sont appelés à s’intégrer encore plus aux systèmes en ligne.

La montée du brutalisme

The Outline
Le brutalisme est dur pour les yeux, mais fait une déclaration (Source : The Outline)

Le brutalisme n’est pas joli, mais son étrange attrait a gagné le cœur de beaucoup. Caractérisé par des couleurs criardes, des choix anti-UX, et une conception qui se retrouve partout, le brutalisme encourage les concepteurs à devenir fous et à créer un site qui défie les attentes. Vous devriez vous attendre à voir davantage de ce style non uniforme à l’avenir.

Raconter des histoires avec un design web

Atlassian
Le design peut être utilisé pour raconter une histoire (Source : Atlassien)

Les éléments visuels sont l’un des meilleurs moyens de transmettre efficacement l’information, que vous essayiez de raconter une histoire ou de rendre un grand nombre de données lisibles par l’homme. Les concepteurs de sites web racontent leurs histoires à travers des illustrations charmantes et la visualisation de données, avec des designs interactifs et visuels qui rendent leur message plus engageant et plus facile à comprendre.

Les plus grandes tendances du design web de 2019

2019 a partagé avec 2018 de nombreuses tendances en matière de conception web, comme le design de grille brisée et les palettes de couleurs vives. Mais les choses sont devenues encore plus folles, avec beaucoup d’expérimentation de la part de concepteurs audacieux.

Le thème de la course pour 2019 : contourner les règles et les briser. Blanc, plat, en grille, minimaliste à l’extérieur, asymétrie lumineuse et audacieuse à l’intérieur. Bien que le design épuré et l’espace blanc seront toujours des atouts majeurs, les designers sont plus enclins à essayer de nouvelles choses ces derniers temps. Nous constatons que bon nombre d’entre elles seront pleinement opérationnelles en 2020.

Vibration et expérimentation des couleurs

Fotonaut
Couleurs vibrantes dominantes (Source : Fotonaut)

L’Internet devient plus coloré. Les dégradés sont monnaie courante aujourd’hui, et les sites web affichent souvent des palettes lumineuses et tape-à-l’œil qui étaient inconnues il y a quelques années. Les palettes elles-mêmes sont plus expérimentales, rompant avec le moule habituel des couleurs complémentaires ou contrastées et allant dans tous les sens.

Les sites n’arborent plus les mêmes une ou deux couleurs simples et sourdes. Les pastels doux, les teintes vives et les palettes de toutes tailles prennent le dessus. Un contraste marqué, une subtilité douce et des palettes pleines de personnalité se mélangent pour rendre l’internet beaucoup plus diversifié.

Le monochrome est aussi une grande mode en ce moment. Cela prend souvent la forme de sites totalement en noir et blanc ou en niveaux de gris avec une esthétique sombre, mais vous pouvez aussi trouver des sites réalisés uniquement autour d’une seule couleur.

Plus d’illustrations

Absurd
Les illustrations étaient encore populaires (Source : Absurd)

Les illustrations et le contenu visuel étaient également importants en 2018, mais ils ont continué à évoluer. Les artistes s’éloignent du style d’illustration typique et simpliste que la plupart des sites emploient, et essaient quelque chose d’un peu différent.

Une tendance émergente est l’art excentrique et ludique qui s’écarte de la normalité et s’essaie à un style plus abstrait et aléatoire. Ces illustrations ignorent les frontières habituelles et n’ont pas peur de montrer la personnalité de leurs créateurs.

Les illustrations 3D sont également très populaires. Ce n’est qu’un petit effet sur la tendance des œuvres d’art principalement plates, mais cela lui donne un nouveau souffle. Certaines sont des œuvres d’art en 2D dessinées pour ressembler à la 3D, tandis que d’autres sont de véritables rendus en trois dimensions. Quoi qu’il en soit, elles gagnent rapidement en popularité en même temps que les animations Web en 3D.

Jet Style
Et les illustrations 3D ont fait un impact (Source : Jet Style)

Enfin, la dernière tendance illustrée est l’animation. L’art animé attire instantanément l’attention et ajoute une couche supplémentaire de personnalité à une forme d’art déjà très expressive. L’art de l’animation 2D et 3D va continuer à se développer au fur et à mesure que cet engouement se fera sentir.

Design audacieux

Le web design 2019 peut être résumé en trois mots : grand et gras. Plus c’est grand et plus c’est expérimental, mieux c’est, surtout quand le résultat final est tape-à-l’œil et demande une attention immédiate.

La conception web brutaliste est toujours aussi forte, avec des sites entiers dédiés à la collecte du meilleur dans le brutalisme. L’art brutal, laid et anti-utilisateur fait certainement une déclaration : le design web a toujours eu pour seul objectif de créer une bonne expérience utilisateur, mais le brutalisme cherche à en faire une œuvre d’art. On ne sait pas combien de temps le brutalisme va durer, mais la tendance est toujours aussi forte.

Visualbox
Le brutalisme est toujours dominant (Source : Visualbox)

On dirait que tout prend de l’ampleur, mais l’impact le plus important a été sur la typographie et la navigation. Il n’est pas rare de voir des textes qui remplissent presque entièrement l’écran, ou même des dessins réalisés uniquement autour de la typographie, avec peu ou pas d’images du tout.

Les polices deviennent aussi plus créatives, notamment grâce aux polices de couleur, qui rendent enfin possible la personnalisation et le rendu de polices qui ont l’air d’avoir été améliorées dans Photoshop. La typographie comme point de mire est maintenant une méthode viable de conception de sites web.

La navigation est également en expansion. Les navigations avec des en-têtes délicats et les menus déroulants ou hamburgers élégants sont remplacés par des affichages dominants, avec des écrans entiers dédiés à la navigation, encore une fois souvent centrés autour d’une typographie énorme.

Dans ce guide détaillé, vous pouvez en apprendre davantage sur les meilleures pratiques en matière de navigation sur les sites web.

Tribu
La conception des en-têtes a également eu un impact (Source : Tribu)

Regardez aussi les vidéos d’en-têtes hero, les arrière-plans animés, et plus encore le contenu vidéo sur les pages web. Les éléments vidéo étaient auparavant un problème car ils étaient lents à charger et consommaient des données mobiles limitées, mais grâce à un matériel plus puissant et à des images de repli, vous pouvez maintenant utiliser les vidéos n’importe où. Ce magnifique site web avec un fond animé plein écran, autrefois une rareté, est sur le point de devenir plus commun.

Asymétrie

New Flight
L’asymétrie est toujours très populaire (Source : New Flight)

La conception de grille brisée reste très populaire. Les sites web choisissent souvent d’éviter les mises en page typiques et d’opter pour quelque chose de plus artistique, avec beaucoup de pièces et d’éléments qui se chevauchent sur tout l’écran. C’est un style qui est difficile à réaliser, mais il est superbe une fois qu’on l’a réussi.

Mais pour ceux qui ne sont pas intéressés à briser entièrement le moule, un peu d’asymétrie est une alternative acceptable. Les conceptions asymétriques d’écran partagé sont particulièrement populaires, même si ces sites collent toujours à une grille.

En parlant de grille, la grille CSS est un ajout super puissant au CSS qui fonctionne en deux dimensions, colonnes et lignes, et qui vous permet de créer facilement des mises en page de sites web à partir de zéro. Avec un peu de magie CSS, vous pouvez aussi créer une grille de mise en page brisée, donc tout est possible. Les concepteurs et les développeurs web commencent à s’intéresser à la grille CSS, alors ne manquez pas cette occasion.

Plus d’effets et d’animations

3h-i
Les animations peuvent avoir un impact positif sur la conception de l’IU et de l’UX (Source : 3H-i)

Bien que le brutalisme devienne monnaie courante dans certains coins du web, le reste se concentre sur le design UI/UX : créer une plus belle interface tout en améliorant l’expérience utilisateur.

Une grande partie de cela est dans les micro-interactions. Pensez à survoler un produit sur une boutique ou jouer avec un arrière-plan interactif et animé. Ces petites animations rendent un site web plus divertissant à naviguer et apportent de la joie aux petites interactions comme le clic et le survol. Certains sites sont même allés jusqu’à mettre en place de mignons mini-jeux.

Mais ce n’est pas seulement pour le plaisir. Les micro-interactions servent souvent le même objectif que l’animation subtile courante : elles dirigent l’attention de l’utilisateur vers les éléments importants de l’IU. Et une sur-implémentation peut vite devenir obsolète, alors il s’agit de trouver le nombre idéal d’animations à inclure sur votre site web.

Les effets de défilement et de parallax sont bien sûr toujours aussi populaires et peuvent ajouter un aspect dynamique en calques à une page et la rendre beaucoup plus intéressante.

Aussi, faites attention aux curseurs personnalisés. Autrefois, on les voyait rarement en dehors des petits blogs ou des sites pour enfants, mais ils sont maintenant un choix populaire, surtout pour les sites construits autour d’arrière-plans ou de navigation animés en 3D. Un élégant curseur personnalisé peut vraiment améliorer votre esthétique.

Espace blanc

Apple iPhone
L’espace blanc gagne toujours (Source : Apple)

Comme toujours, l’espace blanc et la conception épurée continueront d’avoir leur place dans les tendances du web design. Simple et propre est un choix sûr : il y a une raison pour laquelle ce style est présent sur presque tous les sites web modernes.

Mais même si vous visez une approche plus audacieuse et plus unique, l’espace blanc reste un élément qu’il vous faut contourner. Chaque site a besoin d’un peu d’espace, et l’espace blanc peut être utilisé pour mettre soigneusement en évidence et souligner les images ou tout autre contenu.

Il est possible d’utiliser beaucoup d’espace blanc avec un grand effet, en laissant des portions entières de l’écran vides pour donner aux éléments importants beaucoup d’espace. L’espace blanc maximal est un style qui se poursuivra probablement au cours des prochaines années.

Applications web progressives

La prochaine grande chose dans le design mobile : les applications web progressives. Ces plateformes web sont construites sur du code comme HTML et JavaScript, mais elles fonctionnent et agissent comme des mini-applications pour les utilisateurs mobiles. Elles sont conçues pour offrir l’expérience d’une application sans avoir besoin d’être réellement construites sur une technologie mobile ou d’être publiées sur l’app store.

Les AWP fonctionnent hors ligne, peuvent envoyer des notifications et être épinglées à l’écran d’accueil, mais vous n’avez pas besoin de télécharger ou de distribuer quoi que ce soit. Elles sont légères et se chargent aussi rapidement, pour ne pas prendre trop de bande passante.

Même Twitter s’est lancé dans les AWP, développant Twitter Lite comme une solution pour ceux qui ont des vitesses Internet lentes. Et ils ont fini par intégrer le système directement dans leur interface principale. C’est la preuve que cette technologie fonctionne bien.

Si vous n’avez pas encore entendu parler des applications web progressives, vous devriez certainement faire quelques recherches. En construire une pourrait rendre l’expérience de vos utilisateurs mobiles beaucoup plus fluide.

Résumé

2018 et 2019 ont été des années passionnantes pour le monde en ligne. 2020 apporte déjà des designs encore plus aventureux. Les éléments qui enfreignent les règles, comme l’asymétrie, les couleurs vives, le brutalisme et les animations accrocheuses, continueront de gagner en popularité au cours des prochaines années.

Qui sait ce qui pourrait arriver ensuite ? Nous sommes sûrement en réserve pour de nouveaux styles d’art encore plus non conventionnels.

Si vous n’avez pas encore compris, il est peut-être temps de ré-imaginer certains de vos designs et de saisir ces nouvelles tendances. Attendez-vous à voir les marques et les designers commencer à s’exprimer réellement et l’Internet à devenir beaucoup plus vibrant et intéressant.

La prochaine décennie de la conception web sera probablement marquée par la prise de risques et l’innovation, alors assurez-vous d’être prêt à suivre le rythme.

Brenda Barron

Brenda Barron est une journaliste et rédactrice publicitaire originaire de Californie. Elle contribue à des sites tels que WPMU DEV, Envato et Torque.