Tendances de conception Web 2022 pour inspirer votre prochain projet de site Web

Y a-t-il quelque chose qui ne va pas avec TROP tendance?

Je vois beaucoup de concepteurs de sites Web s'égarer - attirés par la conception «super sophistiquée», au détriment de l'utilisabilité et de la fonctionnalité de leurs sites Web.

"La plupart des designers vivent dans une sorte de réalité alternative, créant des choses inutiles les uns pour les autres. Ensuite, ils deviennent des tendances. – Blazej, utilisateur du flux Web

Aujourd'hui, nous allons passer en revue 3 tendances pour 2022 - cela ne vous fera pas sacrifier la convivialité de votre projet de site Web, mais vous aidera à l'élever au niveau supérieur.

2022 Web Deisign Trend #1 - Découpes de sujets avec des arrière-plans colorés

Faites en sorte que cette tendance de site Web 2022 fonctionne pour vous :

• L'utilisation d'une application de création de formes telle que ShapeDivider.app peut vous aider à créer ces formes naturelles si vous souhaitez un joli raccourci.
• Le choix de l'image parfaite sera plus important pour ceux-ci, car il est facile d'aller aussi "stock photo-y" avec beaucoup d'images sur Internet avec des arrière-plans blancs.

Tendance 2022 Web Design #2 – Travail monochrome

• Choisir une autre couleur en plus du noir et du blanc peut rendre le design POP !
• Avoir moins de couleurs avec lesquelles travailler facilite en fait la conception de ces types de sites Web !
• Faites en sorte que la couleur fonctionne pour vous, utilisez-la pour les boutons clés et les choses sur lesquelles vous voulez attirer l'attention.

Tendance de conception Web 2022 n ° 3 - Éléments de conception fantômes

Faites en sorte que cette tendance de conception Web 2022 fonctionne pour vous :

• Mélangez un élément que vous ne voulez pas nécessairement faire ressortir comme un pouce endolori.
• Créez une esthétique haut de gamme en utilisant ce look plus subtil.

Années précédentes des tendances du site Web

Nous aimons les beaux sites Web - axés sur l'expérience utilisateur et construits de manière à la fois élégante ET intemporelle. La clé est… de ne pas devenir TROP à la mode d'une manière qui sera démodée avant de pouvoir dire "animation de parallaxe".

• Ne sautez pas sur chaque nouvelle tendance.
• Gardez un œil sur ce qui est à la fois élégant ET efficace.
• Chacune des tendances présentées ci-dessous aura un petit extrait sur pourquoi c'est élégant, et un autre sur pourquoi - ou si - c'est efficace.

Les trois principales tendances de conception Web 2020

1. Grande Typographie

Pourquoi est-ce stylé ? Dans un monde où tout le monde insère autant de texte que possible dans ses conceptions pour satisfaire 200 parties prenantes… si vous pouvez le résumer à un message clé très court et le rendre énorme, vous gagnez.

Est-ce efficace : C'est très efficace parce que les gens savent sur quoi se concentrer ! Le problème avec chaque morceau de texte ayant la même taille ou juste de minuscules variations les uns des autres est bien sûr qu'il n'est pas clair quelle est la partie la plus importante.

2. Un héros plus petit, des images de héros plus percutantes

Pourquoi est-ce stylé ? À quel point est-il glorieux de ne pas couvrir vos belles images ? Les gens adorent cela parce que cela semble cohérent et que vous êtes moins susceptible de rencontrer des problèmes de superposition difficiles (exemples dans l'élément suivant.)

Est-ce efficace : Cela peut certainement l'être - le point crucial est que les images soient bonnes et aident vraiment les gens à s'imaginer bénéficier de votre produit ou service. Sans de bonnes images, cela peut sembler ringard.

3. Éléments en couches

Pourquoi est-ce stylé ? Tout comme dans la mode, la superposition intentionnelle est astucieuse - elle semble intentionnelle et peut donc être très belle.

Est-ce efficace : Cela dépend vraiment de l'élément spécifique. Cela ne peut vraiment PAS être efficace s'il n'a pas la bonne photo, les bons éléments de support, la bonne superposition pour le contraste ou la bonne typographie (fonctionne mieux avec des polices plus lourdes.) Veillez à ne pas en abuser - et à l'utiliser lorsque vous avez des éléments solides qui fonctionnent ensemble et que vous « avez le contrôle sur eux ». Souvent, un client peut échanger une image qui ne fonctionne plus – et il est donc important que cela soit fait avec les bons composants lorsque vous savez qu'ils ne changeront pas souvent.

Autres mentions honorables :

Typographie verticale - Utilisée pour les éléments de l'interface utilisateur, peut donner une impression plus intentionnelle sur les conceptions.

Découpes de forme organique - L'exemple de Pops Diabetes ci-dessus utilise également cette tendance.

10 % d'images décalées - L'article Schaefco ci-dessus présente également ceci -

Découpes typographiques - J'en ai vu des exemples impressionnants. Une grande lettre en gras est découpée dans un espace blanc et comporte parfois une vidéo derrière, ce qui donne un effet superposé vraiment cool.

Vidéo sur chaque page – Si vous faites régulièrement de la vidéo, pourquoi ne pas en faire une pour chacun de vos services clés et les inclure pour augmenter le « temps passé sur le site » ? Idéal pour le référencement - et idéal pour vos utilisateurs qui n'ont pas envie de lire. (Astuce : la plupart d'entre nous préféreraient regarder une vidéo.)

Animations complémentaires légères - les animations attirent l'œil, surtout si elles bougent un peu, mais assurez-vous d'attirer l'attention des gens sur la bonne chose. Ou assurez-vous que les animations sont réellement bonnes / ont un style qui complète vraiment votre marque.

Plus de polices Serif – Les polices Serif sont plus faciles à lire ! Je suis heureux de voir les empattements faire leur grand retour en 2020 et au-delà !

D'autres designers s'attaquent aux tendances du design Web 2020 (crowdsourced.)

Les services de conception Web de ces derniers temps se concentrent sur la fourniture de la meilleure expérience aux utilisateurs au moment où ils naviguent sur le site Web. Ainsi, il devient très important de la part des développeurs de s'assurer qu'ils travaillent en conséquence.
Voici donc une liste des 17 principales tendances en matière de conception Web et d'interface utilisateur pour l'année 2020.

1. Minimalisme ouvert et coloré
De nos jours, si vous pensez encore au design minimaliste utilisant des arrière-plans en noir et blanc, ces jours sont révolus. Le minimalisme ouvert et coloré est la dernière tendance qui apporte une sensation cohérente et accrocheuse aux conceptions Web.

2. Adapté aux mobiles
Avec l'utilisation croissante des mobiles, les concepteurs doivent s'assurer que le site Web est adapté aux mobiles afin que chacun des utilisateurs puisse consulter facilement le site Web via son mobile. C'est exactement là qu'un service de conception Web réactif vient à la rescousse.

3. Titres surdimensionnés
Les en-têtes et les titres surdimensionnés sont devenus extrêmement courants ces derniers temps afin d'attirer l'attention des lecteurs car ils ont beaucoup moins de temps à passer sur le site Web. Ainsi, les titres sont créés de telle sorte qu'ils attirent l'attention des lecteurs.

4. Couleurs vives, dégradés difficiles et arrière-plans sombres
Les sites Web d'aujourd'hui se concentrent sur la fourniture de la meilleure expérience utilisateur et, par conséquent, les services de conception Web se concentrent particulièrement sur la même chose. L'utilisation de dégradés plus complexes avec un rendu fantastique des couleurs sur fond sombre est devenue plus courante en 2019. Un mélange classique des trois est la tendance.

5. Vitesse de chargement du site Web
Les clients d'aujourd'hui sont toujours pressés et, par conséquent, un site Web à chargement lent est simplement ignoré par les utilisateurs. Ainsi, la vitesse de chargement du site Web doit être beaucoup plus élevée, ce qui est exactement ce qui est devenu la dernière tendance en matière d'amélioration de l'expérience utilisateur.

6. Animations et illustrations de niveau supérieur
Les utilisateurs attendent toujours avec impatience quelque chose de nouveau à tout moment. Ceci peut être facilement réalisé avec les animations ainsi que les illustrations de niveau supérieur, ce qui est exactement la raison pour laquelle celles-ci sont devenues la dernière tendance.

7. Grilles CSS
Les grilles CSS sont toujours l'une des tendances de conception Web les plus populaires qui jouent un rôle essentiel dans la simplification de la conception Web. Ces derniers temps, il s'agit d'un mélange de nouveaux outils avec des fonctionnalités existantes. Le CSS moderne d'aujourd'hui offre un tout nouveau niveau de réactivité, d'interaction ainsi que de visualisation des données.

8. Schémas de couleurs clairs et foncés
Pour créer quelque chose d'excitant pour les utilisateurs, l'utilisation de combinaisons de couleurs claires et sombres est tout simplement trop bonne. Cela crée une impression positive sur les utilisateurs, donc bénéfique.

9. Expériences 3D immersives
Les images et les graphiques 3D sont sans aucun doute trop bons pour les services de conception Web afin que des conceptions Web attrayantes puissent être créées, ce qui le rend accrocheur pour les utilisateurs. Les expériences 3D immersives donnent vie à votre site Web et offrent de superbes expériences aux utilisateurs.

10. BrutalismeLe brutalisme est une autre tendance majeure qui est à la hausse, ce qui est assez évident du fait que de plus en plus de marques préfèrent utiliser des concepts audacieux, granuleux et impétueux pour embrasser leur côté rebelle intérieur.

11. Éléments volants et flottants
Pour attirer l'attention des utilisateurs, les visuels volants et flottants sont extrêmement efficaces.

12. Formes organiques et géométriques
L'utilisation de formes géométriques et organiques pour les services de conception de sites Web a pris sa place assez solidement, quelque part entre les conceptions plates et les grilles brisées.

13. Les choses qui se chevauchent
L'effet de chevauchement est certainement l'une des tendances les plus en vogue de l'année 2020. Les choses qui se chevauchent apportent un intérêt visuel à certains types de contenus spécifiques. Ce concept est une excellente astuce pour exciter les intérêts des gens, mais doit être fait avec soin avec les services de conception de sites Web.

14. Augmentation de la vidéo
L'ajout de plus de vidéo apporte plus de vie au site Web et il a la capacité de capter l'attention de presque tous comme aucune autre forme de média. C'est sans aucun doute une tendance de 2020 et se poursuivra pendant longtemps.

15. Dispositions asymétriques et grilles brisées
Les mises en page asymétriques du site Web ainsi que l'utilisation de grilles brisées au moment de la conception Web sont devenues plus courantes de nos jours.

16. Réalité Augmentée
Les interfaces uniquement à l'écran ne suffisent pas dans le monde d'aujourd'hui et les utilisateurs veulent que les interactions physiques aient lieu dans le monde réel. C'est là que les webdesigners doivent penser à quelque chose de nouveau pour proposer la fonction réalité augmentée.

17. Micro-interactions
L'importance des micro-interactions ne peut à aucun prix être négligée. Ceux-ci sont tout simplement parfaits pour créer des événements qui sont assez invitants et donc à la hausse en 2020.
Maintenant, lorsque vous connaissez les principales tendances en matière de conception Web et d'interface utilisateur pour 2020, ne perdez pas plus de temps, mais intégrez-les à votre site Web pour offrir aux utilisateurs des expériences fantastiques.

Exemples de tendances de conception Web courantes mal utilisées

Comment déterminer si une tendance est mal utilisée ? Empathie et intuition. Consultez votre cricket jiminy intérieur. Aimeriez-vous que quelqu'un vous fasse cela avec son site Web ? Si la réponse est non, peut-être devriez-vous renoncer aux cinquante pop-ups même si vous avez "tellement d'inscriptions à la newsletter" que vous pouvez les spammer pour le reste de votre vie.

Est-ce que ça marche? Félicitations, vous avez converti 5 personnes de plus et en avez énervé 40 autres, ruinant la perception de votre marque et les incitant à reconsidérer le fait de cliquer à nouveau sur votre contenu d'auto-félicitations. Alors oui, vous l'avez deviné, mon exemple numéro un d'une tendance de conception Web mal utilisée est :

Pop-up invasifs

Les fenêtres contextuelles envahissantes et celles que vous ne savez pas comment fermer ou qui vous obligent à répondre à une question ridicule sont affreuses.

Comment faire mieux – Donner quelque chose de valeur quand quelqu'un s'en va

Au lieu d'essayer de pousser quelqu'un dans votre liste de diffusion, tirez. Si vous me donnez quelque chose de valeur, je ne suis pas fâché que vous ayez mis un gros vieux pop-up sur mon visage, en fait, je pourrais être un peu intrigué. Ce qui est important à noter, c'est que le contenu est la variable. Ne dépoussiérez pas de papier blanc merdique, construisez quelque chose de génial – travaillez avec une équipe pour construire quelque chose de génial – tout ce que vous avez à faire et faites-en la pièce maîtresse. Associez cela à une fenêtre contextuelle «d'intention de sortie» et ne forcez personne à prendre une décision - donnez toujours des moyens clairs de supprimer la fenêtre contextuelle.

DEFILEMENT infini

Nous n'avons pas besoin d'un appel clair à l'action à la fin ou d'un beau pied de page avec une navigation bien pensée

C'est peut-être un exemple de mon cerveau de vieil homme cynique parce que je ne peux même pas gérer quand Twitter passe des étoiles aux cœurs - mais si nous appliquons la règle d'or ici, je déteste finir un article et demander à quelqu'un d'autre de faire un choix à propos de quel article je veux lire ensuite. Prendre la décision pour eux pourrait être agréable avec les vidéos facebook et youtube car bon, c'est de la vidéo et je suis juste en train de végéter de toute façon - mais pour le contenu que vous devez lire, je suis désolé, je ne pense pas que vous allez faire une décision concernant mes préférences basée avec précision sur un article ou un élément de contenu que j'ai terminé.

Je vais mettre cela en garde avec le fait que les sites de type galerie / Pinterest-esque où vous parcourez un éventail d'éléments semblent avoir certains avantages pour ce type de navigation, mais cela peut être limité aux réseaux sociaux. Le reste d'entre nous a besoin de la satisfaction d'une conclusion et de plus de navigation.

Comment faire mieux - Pensez à ce qu'une personne voudrait faire après avoir lu le type de cette catégorie ou ce type de contenu sur le site.

Chaque type de contenu sur le site peut avoir un type de pré-pied de page avec d'autres articles similaires, des éléments de navigation et, idéalement, quelques prochaines étapes claires adaptées à ce qu'ils viennent de terminer. Même si je déteste la police "Lobster" dans l'exemple ci-dessus (Messages Home), je pense que Jared a longuement réfléchi à ce qui pourrait intéresser les gens après avoir fini de lire une page de contenu et les a partagés d'une manière visuelle qui est clair et simple. Si seulement les autres pieds de page avaient autant de chance. Je l'admets, j'ai un fétichisme des pieds de page.

3. Une parallaxe douloureusement distrayante qui n'ajoute aucune valeur, sauf pendant une milliseconde de oooh-ahhh.

Cette organisation artistique et culturelle a du mouvement, elle a de la profondeur – mais a-t-elle un sens ? Je ne peux pas imaginer comment les cercles à l'arrière ajoutent un élément utile, sauf qu'à un moment donné, c'était original, ou pas encore beaucoup fait. C'est-à-dire un gadget - mais bon, ils ont remporté un prix de site… donc le site doit être bon, n'est-ce pas ?

Le mouvement et la profondeur peuvent être formidables lorsqu'ils sont mis en œuvre avec goût, malheureusement, un grand nombre de personnes se sont précipitées pour mettre en œuvre la parallaxe sans beaucoup d'intention réfléchie sur la façon dont cela aiderait vraiment les visiteurs et ajouterait de la valeur. Les grandes conceptions spacy sont belles, mais si vous essayez d'accéder à la viande du contenu d'un site Web et de vraiment savoir comment ou pourquoi vous voudriez travailler avec une entreprise ou acheter un produit, les longs sites de parallaxe passent à côté de l'essentiel.

Comment faire mieux - Implémenter subtilement pour ajouter de la profondeur et utiliser avec parcimonie d'une manière qui ajoute un peu d'intrigue pour les produits le cas échéant.

À ce jour, peut-être que beaucoup d'entre vous ont vu l'article sur les chutes de neige du New York Times qui a été publié en 2012. L'article utilise la parallaxe et la vidéo d'une manière qui était presque désarmante parce qu'elle était si progressive à l'époque.

Les clés qui font que ce site fonctionne si bien ?

• Fort accent sur le contenu - les éléments typographiques sont super bien pensés et lisibles
• Les traitements de titre donnent une hiérarchie claire
• Tout cela joue assez bien ensemble, de sorte que l'aspect de parallaxe n'est pas au centre de la scène, mais plutôt une pièce subtile agréable à une image plus grande.

C'est exactement ainsi que la parallaxe peut être utilisée avec goût en 2016, sans se sentir comme un gadget.

Tendances de la conception Web à partir de 2019

Les concepteurs de sites Web ne sont pas différents des créateurs de mode, en ce sens qu'ils doivent constamment garder une oreille attentive lorsqu'il s'agit d'écouter quelles seront les dernières tendances de l'année à venir en matière de conception de sites Web.

Un concepteur Web intelligent garde non seulement l'image de marque à l'esprit lors de la création de la mise en page d'un site, mais également la convivialité pour l'utilisateur. Pour cette raison, chaque année, les concepteurs éliminent les détails de conception que les utilisateurs n'aiment pas et développent ceux que les utilisateurs aiment.

Cette année n'est pas différente, et voici une liste des principales tendances à rechercher dans la conception de sites Web pour 2019.

Arrière-plans vidéo

Vous avez probablement vu une quantité décente de sites Web qui intègrent de grands arrière-plans vidéo pour engager l'utilisateur. Les arrière-plans vidéo sont un excellent moyen de donner à l'utilisateur un aperçu de votre entreprise.

Consultez le site Web de la société de développement immobilier Ditto , qui met en évidence leurs développements résidentiels avec des personnes qui passent leurs journées, offrant à l'utilisateur la possibilité de voir l'intérieur des unités de manière attrayante.

Nous avons travaillé avec Deneen Pottery pour aider à mettre en œuvre une vidéo sur leur arrière-plan également, qui présente des images réelles de leur poterie fabriquée à la main.

Arrière-plans de particules

Pour les entreprises qui souhaitent toujours incorporer du mouvement dans leurs sites Web, les arrière-plans de particules sont une excellente alternative aux arrière-plans vidéo, en particulier si vous vous inquiétez du temps de chargement avec une vidéo d'arrière-plan plus grande. Ces animations sont en javascript qui créent un mouvement naturel et engageant dans le cadre de l'arrière-plan.

Heystack a utilisé un fond de particules complexe pour son site, et nous nous attendons à ce que davantage de concepteurs fassent de même.

Dispositions asymétriques

Les aspects uniques et distinctifs de la conception Web asymétrique le rendent attrayant en termes de différenciation de votre site des autres. Contrairement au style minimaliste qui est populaire depuis quelques années maintenant, les conceptions asymétriques sont plus occupées mais ont toujours l'air tout aussi propres et professionnelles lorsqu'elles sont bien faites.

Nous avons récemment lancé ce site Web pour Sustainable 9, qui présente des formes qui se chevauchent et bien qu'il y ait un semblant d'équilibre, il y a certainement des éléments asymétriques, ajoutant de la profondeur.

Typographie audacieuse

Choisir la bonne typographie peut faire la différence en ayant un taux de rebond faible plutôt qu'élevé. Choisir une typographie audacieuse, en particulier dans une grande taille de police, peut vraiment attirer l'attention de l'utilisateur de votre site.

Ces deux pages d'accueil de sites Web, créées par un concepteur Web sur Dribble, illustrent parfaitement la nature simple et moderne des caractères gras.

Animations intégrées

Les animations intégrées sont exactement ce à quoi elles ressemblent : des animations qui sont placées sur tout le site Web pour ajouter une sensation supplémentaire de vivacité, de mouvement et d'engagement au site Web. Comme vous l'avez remarqué, le mouvement est un thème important à rechercher dans la conception Web pour cette année à venir.

30 Species in Pieces, un site Web dédié à l'éducation des gens sur les animaux en voie de disparition, utilise une animation nette et engageante dans sa conception Web simple pour lui donner vie.

Dégradés dynamiques

Comme nous l'avons déjà noté, les dégradés de couleurs commencent à faire leur retour. Les dégradés permettent une personnalisation avec les couleurs de votre site Web pour créer quelque chose qui incarne vraiment votre marque.

Apple a utilisé un dégradé pour la couleur de sa police afin de coller au thème de ses nouvelles publicités pour iPhone X.

Tendances de conception Web sous-estimées à partir de 2018

Chaque année, les tendances en matière de conception de sites Web changent constamment. Par conséquent, ce qui semblait « à la mode » il y a quelques années n'est peut-être pas la meilleure option aujourd'hui. Il est donc important pour tous les propriétaires d'entreprise de se tenir au courant des dernières tendances en matière de conception de sites Web afin de vendre leur entreprise et de maintenir l'attention des visiteurs. Lisez la suite pour découvrir six des plus grandes tendances de conception Web sous-estimées de 2018.

Dispositions de grille brisées

De nombreux sites Web utilisent des grilles pour s'assurer qu'il y a une structure derrière le texte, les images et les boutons de navigation. Non seulement les grilles fournissent une ligne directrice aux concepteurs, mais elles aident également les visiteurs à naviguer facilement sur le site Web. Cependant, cette année, la disposition typique de la grille est brisée. Au lieu de suivre une règle définie, il y avait une opportunité de faire quelque chose de différent avec la conception Web. Les développeurs ont évolué vers des dispositions de grille brisées qui sont moins restrictives. Les dispositions en grille brisée permettent au texte et aux images de dériver plus librement dans et à travers la page. Lorsque les éléments se chevauchent, cela crée une conception Web harmonieuse qui coule naturellement pour le visiteur. Des dispositions de grille brisées peuvent également être obtenues grâce à l'utilisation de calques, d'un positionnement inhabituel et de touches subtiles qui rendent la page plus attrayante.

2. Chatbots

De plus en plus de concepteurs de sites Web commencent à implémenter l'utilisation de chatbots dans les sites Web. Les chatbots sont couramment vus sur les sites Web d'entreprises situés en bas à droite de l'écran. La petite fenêtre contextuelle donne aux visiteurs la possibilité de parler à quelqu'un de l'entreprise ou d'obtenir une aide automatisée pour toute demande de renseignements. L'ajout d'une fenêtre de discussion à votre conception Web signifie que tout visiteur ayant une question peut obtenir une réponse immédiatement. Certaines entreprises ont du mal à avoir un membre du personnel disponible pour discuter. Cependant, il est possible de programmer votre chatbot pour répondre aux questions les plus courantes et fournir des détails sur la façon de contacter l'entreprise si elle ne connaît pas la réponse à une question.

Illustrations personnalisées

Dans le passé, les images de conception Web consistaient principalement en des photos de produits, des GIF et des photographies éditoriales qui mettaient l'accent sur les caractéristiques, la fonctionnalité et les dimensions humaines du produit. En 2018, on s'en est légèrement éloigné, les illustrations dominant désormais le marché. Les développeurs ont constaté que les illustrations sont plus attrayantes et invitantes. Ils ont un message clair et ciblé qui est adapté à la marque. Les illustrations sont normalement complétées par des combinaisons de couleurs non traditionnelles qui expérimentent divers contrastes, créant une tension mais préservant également la lisibilité de la conception Web.

Transitions de page

Chaque fois que l'expérience d'un utilisateur est interrompue, il y a de fortes chances qu'il quitte le site Web. Cela peut également se produire lorsqu'ils passent d'une page à l'autre. Certains sites Web prennent trop de temps à charger, tandis que d'autres sortent l'utilisateur du contexte dans lequel il se trouvait avant l'ouverture de la nouvelle page. Il est donc essentiel que chaque conception Web ait des transitions fluides et efficaces entre les pages. Cette année, de plus en plus de sites Web introduisent des transitions de page cohérentes pour leurs visiteurs. Plutôt que de naviguer vers une nouvelle page, les visiteurs peuvent afficher différentes informations sur la même page. Ces transitions de page plus fluides peuvent améliorer l'expérience utilisateur et stimuler l'engagement avec votre marque.

Brutalisme

2018 a vu une augmentation de l'utilisation du brutalisme dans la conception Web. Le brutalisme ouvre un espace où les développeurs et les designers peuvent faire ce qu'ils veulent, plutôt que ce qu'ils devraient faire. Ce style de conception Web a été inspiré par l'architecture des années 1950 qui était simpliste, rentable et pratique. La conception Web du brutalisme est brute et captivante. L'accent est mis sur le contenu, car il est important de le rendre visuellement agréable pour le visiteur. La conception Web du brutalisme se manifeste à travers des structures exposées, un sens de la rugosité et des processus réfléchis.

Contenu vidéo

Cette année a également vu l'utilisation accrue de contenu vidéo sur les sites Web. La vidéo est un excellent moyen de transmettre des informations complexes dans un format visuel. Non seulement le contenu vidéo rend les sites Web plus modernes, mais il crée également un sens artistique qu'une image statique ne peut pas simplement faire. Les vidéos sont un outil puissant car elles peuvent se glisser de manière transparente dans votre conception Web tout en restant de très haute qualité, même avec beaucoup de couleurs, de dégradés et de détails. Les vidéos peuvent également être mises en boucle pour garantir que les détails de la copie et ceux de la vidéo restent à l'unisson. De nombreux développeurs de sites Web voient les visiteurs rester plus longtemps sur les sites Web lorsque le contenu vidéo est présent, les visiteurs étant également plus susceptibles de s'inscrire ou d'accepter leurs offres de produits et de services.D'un point de vue commercial, quelles sont les tendances de la conception Web en 2017 ?

Tendances de conception Web qui font bouger l'aiguille

1. Formulaire de contact sur chaque page

Ne vous méprenez pas - si votre site Web est un site Web de génération de prospects, vous ne voulez pas rendre le formulaire de contact difficile à trouver. Si vous pouvez l'inclure sur chaque page, tant mieux.

Cela peut sembler être une astuce simple, mais les meilleures "astuces" le sont.

2. CTA omniprésent : bouton d'appel à l'action puissant et constant

Vous n'avez pas besoin d'avoir le formulaire de contact pour inciter les gens à vous contacter, pour obtenir une démonstration, pour obtenir un devis, ou quelle que soit l'action principale que vous souhaitez inciter le client à prendre. Au lieu de cela, vous pouvez inclure un gros bouton en haut à droite tout le temps. Lorsqu'ils défilent, laissez le bouton d'appel à l'action en haut de l'écran avec un en-tête "collant" qui suit les visiteurs.

3. Surcharger la conception avec des facteurs de confiance comme des badges organisationnels et des témoignages

Je m'en tiens aux choses les plus efficaces que je connais et dont certains de mon public n'étaient peut-être pas aussi conscients auparavant. Les facteurs de confiance sont tout dans la conception Web - ils sont presque tout ce à quoi je pense en plus d'une conception visuelle propre, moderne et esthétique.

La seule façon d'amener les gens à agir (gros boutons d'appel à l'action, boutons Acheter maintenant, etc.) est de les entourer de ces éléments qui les expliquent et les poussent à continuer - car la CONFIANCE est absolument cruciale dans toute transaction.

Avez-vous des retours gratuits ? Avez-vous une livraison rapide et gratuite? Avez-vous une garantie? Présentez ces choses.

Vous faites partie d'un groupe de commerce local ? Bureau d'éthique commerciale ? Vous avez un certificat SSL sur votre boutique en ligne ?

Ajoutez une représentation visuelle à ces éléments et envisagez de les adapter au style de votre site Web pour accroître encore plus la confiance.

L'un des éléments les plus importants de la catégorie des facteurs de confiance que possèdent la plupart des entreprises de qualité sont les avis et les témoignages en ligne. Je suggère fortement de les présenter de manière très visuelle sur votre site. S'il s'agit de témoignages, idéalement, vous avez des photos des clients eux-mêmes pour donner encore plus de crédibilité à ce qu'ils ont dit à propos de votre produit ou service.

4. Avoir une vidéo pour présenter votre proposition de valeur clé

Lorsque j'ai conçu DeneenPottery.com pour la première fois, j'ai travaillé avec ce que le client avait - des images de ses tasses de haute qualité et une vidéo qui était un peu cachée dans la conception. Nous avons dessiné cette vidéo en en prenant un petit point culminant montrant indéniablement la nature artisanale de leurs tasses et donnant aux gens un avant-goût de leur processus :

5. Conception très attrayante avec espace blanc - pensez à utiliser des transitions significatives, des systèmes de grille qui se chevauchent et divisez le contenu pour faire ressortir les dichotomies

L'espace blanc est cet élément de design délicieux qui semble rendre tout plus "haut de gamme":

Dans ce site Web, j'ai décidé d'utiliser l'ouverture naturelle de la photographie pour créer une sensation de décadence spacieuse.

Apple comprend les espaces. Cela ne signifie pas que l'arrière-plan est blanc - cela signifie simplement un espace ouvert autour du sujet principal de la conception.

Voici un très grand exemple de l'utilisation des espaces blancs par Apple dans son site :

Transitions significatives

Google utilise depuis des années des transitions significatives dans sa " conception matérielle ", mais de plus en plus de concepteurs de sites Web s'en servent pour créer un moyen efficace de donner plus de contexte à l'action de l'utilisateur sur le site. Découvrez l'état de survol sur le bouton ci-dessous, l'étalement de la couleur lorsque l'utilisateur clique sur le bouton, puis la façon dont la fenêtre modale/popup s'agrandit après avoir cliqué :

L'utilisation de la conception matérielle dans ce site Web m'a permis de rendre le site très interactif et très moderne. Cela aide également qu'en utilisant les conventions de Material Design, vous vous associiez subtilement au type d'expérience utilisateur sur Google.com et aux nombreux produits de Google, car ils correspondent et utilisent tous ces conventions.

Chevauchement des systèmes de grille

Les boîtes dans la conception Web sont traditionnellement côte à côte, l'une au-dessus de l'autre, mais de nombreux concepteurs utilisent un style très 2017 appelé système de grille superposée, ou un système de grille décalée. Ce style juxtapose des boîtes et des photos les unes sur les autres pour un effet plus organique et fluide.

Diviser les couleurs ou diviser les images pour tracer une dichotomie

Une dichotomie est la séparation de deux choses, comme « le chaud et le froid » ou « le bien et le mal ». En rendant les deux côtés d'un site Web très différents l'un de l'autre, il attire l'attention du visiteur.

Vous pouvez l'utiliser pour faire ressortir les éléments émotionnels de l'opposition, ou les deux côtés du cerveau « émotionnel et logique », « créatif et orienté système », ou simplement l'utiliser pour créer un attrait visuel comme ce design de Mateusz Koziorowski. .

Quoi que vous fassiez - ne vous précipitez pas dans les tendances de conception Web bon gré mal gré

Assurez-vous de considérer d'abord et avant tout vos objectifs commerciaux. Les tendances de conception visuelle ne sont rien sans tenir compte de ce qu'elles feront en ce qui concerne le déplacement de l'aiguille avec vos revenus.

Un meilleur site Web est juste au coin de la rue
Nous avons parcouru un long chemin depuis le lancement des premiers sites Web. Les concepteurs Web deviennent plus détaillés, plus aventureux et, franchement, meilleurs. Les prochaines années de conception de sites Web consisteront à repousser les limites et à essayer de nouvelles idées audacieuses. Chez Hook, nous aimons prendre un ancien site dont vous en avez assez et le transformer en quelque chose qui résume vraiment le caractère unique et avant-gardiste de votre marque. Si vous cherchez à créer un nouveau site, qui engagera les utilisateurs et entraînera davantage de conversions, contactez Hook Agency dès aujourd'hui pour organiser une réunion, où nous discuterons de vos objectifs commerciaux et de la manière dont nous pouvons les mettre en œuvre. les intégrer à votre nouveau site.