- 20 sites au top du web design pour vous inspirer
20 sites au top du web design pour vous inspirer
Alors que le développement continu d’internet met en ligne chaque jour des milliers de nouveaux sites(s’ouvre dans un nouvel onglet ou une nouvelle fenêtre), trouver LA "Touch” qui permettra de vous démarquer en matière de webdesign face à la concurrence n’est pas toujours chose aisée...
D'autant que, comme nombre de domaines où la créativité joue un rôle majeur, il existe des tendances et des modes dans le webdesign, de même qu'il existe aussi des sensibilités et des goûts propres à chacun, chacune !
Pour corser le tout, les tendances du webdesign évoluent en permanence pour s'adapter à l’émergence de nouvelles solutions techniques et pour répondre également aux attentes changeantes des internautes.
Puisque le web met à votre portée la création de n'importe qui partout dans le monde, il est aujourd'hui facile de trouver l’inspiration en quelques clics... En théorie ! Car pour trouver, il faut savoir où chercher et c'est pourquoi nous avons décider de vous accompagner dans votre quête du Graal webdesign.
Dans cet article, nous avons sélectionné pour vous les meilleurs sites disponibles sur la toile (classés par tendance) pour que vous puissiez rester à la page et nourrir votre inspiration en webdesign, en graphisme ou encore en photographie(s’ouvre dans un nouvel onglet ou une nouvelle fenêtre)...
Bienvenue dans ce florilège inspirant centré autour des thèmes les plus tendances du moment... C'est parti pour une belle balade créative au cours de laquelle vos yeux vont se régaler du meilleur en ligne.
Les nouvelles tendances webdesign
Canva vous propose d’explorer 20 sites au top des tendances design pour inspirer celui de votre prochain site. D’année en année, le domaine du webdesign se réinvente au gré des audaces esthétiques et des avancées technologiques pour apporter son lot de petites surprises…
Parmi les incontournables, se retrouve la question centrale de l’expérience utilisateur(s’ouvre dans un nouvel onglet ou une nouvelle fenêtre) et son articulation avec l’interface visuelle. Par exemple le mouvement de défilement (scroll) est désormais plus qu'une simple mode pour devenir une réelle habitude de navigation pour les visiteurs.
De même, le “spoiler alerte” est un mouvement devenu le fondement de nombreux designs. À celui-ci s’ajoutent des immanquables tels que les “broken grid” et autres formes d'illustration animée, confortablement installés dans le paysage de la conception web.
Aujourd'hui, nous vous invitons à découvrir des exemples incarnant les pratiques les plus populaires du webdesign… À commencer par le grand retour du fameux design de site we “One Page” !
Fluide et intuitif : le One Page fait son come back
On le croyait has been… mais le One Page(s’ouvre dans un nouvel onglet ou une nouvelle fenêtre) est surtout indémodable ! Re-devenu carrément tendance, ce design ultra simple et hyper efficace a de sacrés atouts à faire valoir !
Le One Page, en version actuelle, sait désormais très bien comment faire pour retenir l’attention des internautes et inciter les visiteurs à scroller jusqu’au bas de la page (qui est unique !).
Laissez-vous inspirer par cette sélection de sites One Page, aux designs très qualitatifs et à la navigation aussi naturelle que surprenante…
Modèles de site One Page proposé par Canva, à personnaliser pour renforcer votre présence en ligne
Bancal, aligné : l'indémodable grid
Décidément, le webdesign n’est pas prêt de se lasser de ce jeu permanent avec les “grilles”.
CAPTION: Exemple de grid / alignement décalé
Bien installés dans le coeur des webdesigners, les designs à grille mettent parfaitement en valeur les typographies. Cette alliance est particulièrement appréciée des marques aux messages limpides. Les typographies(s’ouvre dans un nouvel onglet ou une nouvelle fenêtre) seront les reines en 2023 ; on en joue, on en use et abuse sans limite.
conseil : acceptez les cookies, c’est drôle. :)
En optant pour le langage Javascript pour dynamiser son site, le photographe Fabian Fallend peut se jouer de tous les codes dans l’alignement des images. Un site one page sobre, classe, appuyé par une grille visible en permanence, qui souligne chacune des images sélectionnées pour représenter au mieux son travail.
Ce site n’hésite pas à jouer avec les espaces blancs(s’ouvre dans un nouvel onglet ou une nouvelle fenêtre)pour rendre leur découpage toujours plus clair au visiteur.
Eatnuggs opte pour un alignement décalé, une typo imposante dotée d’une forte graisse et une charte graphique percutante(s’ouvre dans un nouvel onglet ou une nouvelle fenêtre), mettant en avant son produit assez particulier : des nuggets sans poulet. Quand le marketing et le webdesign joignent leur force au service d’un produit unique, ça donne un site fluide, original et particulièrement tendance.
On retrouvera, du reste, des éléments animés et flottants, mais aussi des éléments surlignés, inévitables en 2023. Le détail qui tue ? Un packaging aux petits oignons, et un snake intégré bien sûr.
Typo imposante et main levée
On poursuit dans ces sites qui mettent en avant la grille non alignée avec 11mirror-hotel. Un site comportant son lot de petits détails qui raviront les amateurs de webdesign. Les éléments animés - à savoir les boutons d’appel à l’action - sont discrets et viennent rompre la linéarité de la grille. Le raccord qui tue ? Le filtre apposé à certaines images qui vient refléter une partie de la photographie.
Exit ici le broken grid, place au chevauchement
Des typographies imposantes, une identité clairement axée sur les 70’s et non pas, comme les précédents exemples, un jeu sur l’alignement mais bien un chevauchement des différents éléments du design.
A l’instar de plusieurs des exemples de cette liste, les effets d’apparition au scroll par étapes amènent progressivement les différents contenus.
Ce webdesign surfe sur une autre tendance actuelle : la mise en avant d’une phrase d’accroche simple et forte, présentée sur fond monochrome. Outre l’impact de la catchphrase, cette petite technique permet d’accorder un temps de repos nécessaire aux yeux du visiteur lors du scroll, et de sauter sur cette opportunité pour lui passer un message fort.
Le dernier petit élément ultra tendance pour cette rentrée du webdesign ? La mise en avant de la police et du propos en surlignant le lien sortant. Cet effet stabylo boss, autrement appelé highlighting est, - nous le verrons tout au long de l’article - l’élément récurrent de cette année.
Quand l’illustration et l’animation s’en donnent à cœur joie
Les nouvelles générations de designers(s’ouvre dans un nouvel onglet ou une nouvelle fenêtre) se sont mis à animer les illustrations, au point de voir émerger des générateurs de silhouettes. Se mariant à la perfection aux formes organiques, ces silhouettes demeuraient assez fades... jusqu'à aujourd'hui.
silhouettes, formes organiques et couleurs vives
Pourquoi ne pas fusionner cette idée d’illustrations humaines, de formes organiques et de couleurs fluos ? C’est le parti pris de Inkyy et on peut dire que ça attrape bien l’œil !
Des illustrations animées par milliers
On ne sera pas non plus surpris cette année de voir se dessiner un véritable engouement pour les illustrations animées. Sur le site BeUnicorn, on mêle volontiers licorne réaliste, portfolio vidéo, photos de l’équipe et petits dessins. Le tout à grand renfort de couleurs extrêmement vives et typographies imposantes.
Tendance à venir : exit l’homogénéité !
Patchwork, typos, gifs webdesign
Le collectif SheepInc opte pour un site one page au webdesign marqué par une typographie imposante. L’inter-lettre et la font au style “à main levée” participent grandement à l’impact du message militant.
5 points suffisent à informer le visiteur. Chaque rubrique développe un argumentaire, où se succèdent GIFS animés, textes défilants et illustrations.
Illustration made in Scotland
Pour un message clair, quoi de mieux que de la bonne grosse typo, quelques animations et une illustration évocatrice. C’est le parti pris de ce blog d’information écossais sur le tourisme qui donne envie d'y aller instantanément !
Webdesign et animations : toujours plus de scroll
Si les webdesigns “classiques” rencontrent toujours du succès sur le web, les interfaces pensées comme des expériences immersives et inédites sont une véritable tendance à suivre dans certains secteurs.
C’est le cas des créatifs qui rivalisent d’originalité pour se démarquer.
L’accroche qui tue - le scroll mémorable sur fond sonore
Le studio pluridisciplinaire DogStudio illustre parfaitement cette tendance à pousser l’immersion du visiteur toujours plus loin.
Site salué par Awwwards.com
Salué par les jurés de l’estimé site Awwwards.com, MATrueCannabis.com est un site entièrement animé. Le contenu, extrêmement dense, s’articule dans quatre univers aux couleurs pastel. Là encore, on vous recommande chaudement de scroller !
Une autre dimension au produit personnalisé
Ah la personnalisation ! Si le e-commerce jouent progressivement cette carte, certains webdesigners ont brillamment anticipé la tendance dès l'étape de conception du site internet. C’est le cas de Deejo qui propose - sur desktop - une interface chiadée de customisation de leur produit : des couteaux. La 3D, au service du consommateur, c’est aussi ça l’articulation entre UX et UI(s’ouvre dans un nouvel onglet ou une nouvelle fenêtre) - et c’est aussi ça la nouvelle tendance du webdesign.
Le retour du patchwork
Autre tendance webdesign du momennt : le cousu/décousu assumé.
Animations et hétérogénéité assumée
Le site Geek-Arts.com vous propose un voyage intersidéral débutant par une animation bien énervée où les couleurs criardes et les clins d’oeil aux premières heures d’internet et au design se succèdent à une cadence effrénée.
Une expérience de navigation qui parfaitement cette tendance selon laquelle l’UI (User Interface) prend largement le pas sur l’expérience utilisateur, tout en servant un message impactant et original.
Le style 2000’s redevient hype !
Avec therecreationist.com, nous vous présentons un autre exemple de webdesign à l’aspect décousu, non sans rappeler les premières heures des sites et blogs personnels. Les nombreuses typographies utilisées, les éléments qui rappellent le “main levée”: tout ici évoque un patchwork des éléments graphiques les plus populaire sur le web.
Les indétrônables
Vous commencez à perdre pied dans toutes ces tendances ? Amateurs organisés de webdesign, ne partez pas tout de suite : cette année ne sera toujours pas la dernière pour les webdesigns aux alignements classiques et structurés !
Naviguer sur le fil de l’eau
Morenita l’a bien compris : de l'eau se dégage un sentiment de plénitude, de sérénité recherché pour un prestataire de balades en mer. Le site assure au visiteur une expérience de navigation claire, reposante et baignée dans l'air du temps.
Vous prendriez bien un peu d’animations ?
Ces couleurs sont clairement celles de cette rentrée 2019-2020. On les retrouve en osmose avec les formes géométriques du site EasternEuropeanMovies. L’effet de parallax quasi omniprésent sur le web, sert largement à la mise en valeur des sections du site.
A ces immanquables, ajoutez quelques ingrédients tels que l’animation, le surlignage dynamique du texte, des hovers efficace et vous obtenez là un webdesign au top des tendances !
Liquide, organique : les formes au service du fond
Non sans une certaine logique, on retrouve une articulation entre forme, légère animation et accroches mises en avant par des typographies toujours plus imposantes.
Non sans une certaine logique, on retrouve une articulation entre forme, légère animation et accroches mises en avant par des typographies toujours plus imposantes.
Si la marque à la sirène peut se permettre de jouer sur ses propres couleurs et sa propre typographie - qu’elle explicite sur ce même site - d’autres créatifs n’hésitent pas à allier les couleurs tendances et ces formes si dynamiques. Vous trouverez un autre bon exemple de cette tendance dans le footer de notre blog. ;)
Donner à voir l’humain : une tendance design qui rassure
La grande tendance de cette année se dessine au profit de formes organiques, et non plus géométriques comme l’année dernière. Nous l’avons vu, si la (micro) animation et les illustrations sont de plus en plus sollicitées, c’est bien l’humain qui prime pour cette nouvelle année - tous secteurs confondus.
Si ce site reprend plusieurs des points déjà traités (alignement, animations), il a également la particularité de mettre en avant les personnalités qui font l’entreprise. Au-delà de l’argument de vente, l’humain est désormais une composante à part entière du webdesign, particulièrement efficace dans le B2B.
Autre exemple de recours à l'humain avec un rapport évident entre le visuel et son propos qui sert un argumentaire simple et impactant... L'animation douce des images renforce la sensation de plonger en profondeur dans les abysses.
Le meilleur pour la fin
Animations, illustrations, couleurs et typos efficaces, le tout au service du défilement
Pour conclure ce tour d’horizon, quoi de mieux que deux sites alliant la globalité des éléments passés en revue ? July 01 est utilise avec maestria toutes les ficelles et astuces graphiques et d'animation... pour un webdesign de haut vol ! Quoi de plus normal puisque ce site présente l'élégante typographie July 01, éditée par Studio K95(s’ouvre dans un nouvel onglet ou une nouvelle fenêtre), une pointure du genre !
Quant au site Koox.co, il utilise intelligemment les illustrations, l’effet de parallax, le défilement (scroll friendly), des typos impactantes et une identité graphique à la fois forte et élégante. Cela donne envie de manger !
Tous ces exemples prouvent que le webdesign impacte de façon déterminante le message d’une marque, d’une société, d’un créateur ou d’un produit ; son importance est considérable dans la stratégie digitale(s’ouvre dans un nouvel onglet ou une nouvelle fenêtre) d’une entreprise !
Quelles sont les tendances de conception visuelle les plus intéressantes aujourd'hui ?
Excellente question et la réponse n’est pas unique, elle est même démultipliée ! Alors pour vous y retrouver et si vous voulez aller plus loin, voici en bonus notre sélection de 20 plateformes de tendances… toutes tendances confondues.
Webdesign donc, mais aussi graphisme, typographie, photographie, illustrations, mais aussi art, architecture, cinéma… parce qu’en matière d’inspiration, il vaut mieux ne pas se fixer de limites arbitraires et laissez divaguer son imagination. C’est bien connu, tout le monde s’inspire de tout le monde et c’est tant mieux.
Finissons donc par une belle brochette de sites à découvrir (ou redécouvrir), il n'y a pas de classement (et c'est volontaire...) pour que preniez le temps d'explorer au gré des vos envies et intuitions. Il y en a 20, vous avez de quoi voir (et faire !) :
Si vous êtes ici, c'est que vous êtes paré pour votre prochain site web... et vous ne pourrez plus faire le coup de la panne (d'inspiration).
Rédigé par
La rédaction
