Quand les concepteurs graphiques refont le monde du web, en proposant cette année un graphisme géométrique épuré et ludique…Des couleurs flash, une nouvelle disposition des grilles, une masse d’animations visuelles rigolotes, et enfin du contenu rédactionnel qualitatif : le web s’allège et s’élève vers des sphères d’authenticité ! Et on a hâte.
Quelle sera la transition graphique entre 2016 et 2017 ? État des lieux et projections
Le nouveau web design : Des couleurs et des graphismes surprenants
Tous les jours, la belle histoire d’amour entre nous et internet. Pour réserver un séjour vacance, pour acheter cette sublime paire de chaussures, ou encore pour communiquer avec le cousin qui vit à l’autre bout du monde.
Le web a profondément modifié nos modes de vie et de consommation, et bien souvent nous ne réalisons pas à quel point des milliers de personnes travaillent en sous-marins pour toujours nous attirer encore plus, nous fidéliser et nous assurer un résultat de qualité. C’est notamment le cas dans le grand domaine du Web design, un secteur exclusivement dédié à la conception des éléments graphiques d’un site web. Les missions globales du web design : les couleurs, la typographie et les vastes illustrations. Une forme d’architecture colossale, qui retient ou fait fuir l’internaute-passager.
Le web design est un élément fondamental, participant ainsi de très près à la notoriété d’une marque, d’un produit ou d’une entreprise, en plus du référencement classique.
Exit les visuels dits « plats »
A l’image d’un supermarché dans lequel vous entrez : pour une raison x ou y, vous optez pour tel ou tel produit. Non parce que vous l’avez vraiment décidé, mais parce qu’inconsciemment un élément vous a poussé à le vouloir. Une odeur, une couleur, un slogan…
C’est toute cette somme de sensations inconscientes, qui se joue aussi sur le web design, où rien n’est choisi au hasard. Il s’agit de valoriser au maximum un site web, afin d’optimiser l’expérience utilisateur, afin qu’il ait envie de rester sur le site, pour peut-être à un moment donné provoquer un achat.
Alors depuis 2013, c’est la formule dite Flat Design, qui se mettait à toutes les sauces. Style volontairement minimaliste et épuré, ce visuel « plat » a été longuement utilisé, jusqu’à temps que l’utilisateur se lasse…
Justement en raison d’une utilisation massive de ce Flat Design. Alors Google s’est décidé à lancer ce que nous pourrions appeler un mix entre le Flat Design et le Skeuomorphime, autrement dit le Material Design, de son doux nom technique.
Le Material Design : un regain de vie, de volume, de profondeur pour 2017 !
Et ce sera bel et bien la nouvelle tendance à venir cette année ! Là, ça peut vraiment déménager, même si nous avons déjà eu quelques aperçus de ces changements courant 2016, notamment avec l’utilisation plus régulière des scroll, un défilement des pages en remplacement du fameux clic. Des changements web design déjà donc amorcés l’an dernier, qui se confirment aujourd’hui sur au moins un grand pilier essentiel : renforcer à 1000% l’interaction. Les grandes lignes du Material Design séduisent :
- Une iconographie simple et ludique
- Un graphisme encore plus épuré et géométrique pour améliorer la lecture
- Un contenu web entièrement revalorisé
- Une réduction du temps d’affichage des pages, et ainsi un grain de temps pour les téléchargements
- Des nouvelles fonctionnalités étonnantes avec des animations visuelles ++
- L’ensemble de la toile internet qui bascule en Responsive Design (autrement dit, la consultation du web sur votre téléphone, et sans ralentissement svp)
Le message 2017 est percutant : immerger l’internaute au cœur même du web, de façon à le faire participer le plus possible, en le touchant par des voies graphiques.
Tout comme la mode vestimentaire, le Material Design est entièrement tourné et dédié à l’utilisateur. Dans les détails techniques, voyons un peu plus concrètement la tonalité de ces changements.
Les 4 principaux changements web design
Des couleurs vives et vraies
Exit les couleurs sombres ou moroses ! Les prochaines tendances sont à l’ère des couleurs vives comme par exemple le fuchsia ou le jaune soleil flash. Une bonne teinte de dynamisme est remise au goût du jour, pour frapper, marquer, attiser.
Le vert pomme est en ce moment le chouchou des graphistes, mais il s’agit surtout de jouer avec les couleurs, en mixant les dégradés et les ombres, afin de redonner, et du volume, et de la vie, aux sites web. Le point commun : toutes ces couleurs ont pour but de faire un rappel de l’eau, la terre et la flore.
Un brin d’authenticité, de fraîcheur, de simplicité, avec un gros effort sur le champ de profondeur via la superposition des couches.
Une police imposante, un contenu rédactionnel qualitatif, une meilleure information client
La police sera plus visuelle, plus puissante, plus allégée. Avec une forte augmentation de la taille des lettres, et une préférence pour l’option « gras ».
La typographie Big Bold plaît, délivre un message court et percutant, en permettant d’exposer en quelques mots l’idée principale. Car dans la même veine, le contenu de fond rédactionnel va être nettement privilégié. Fini les textes à rallonge dont le seul but est de se placer en premier sur les moteurs de recherche.
En éliminant la désinformation, l’effort sera mis sur la qualité de l’écriture, avec de vraies phrases d’accroche, tout en améliorant la qualité des informations mises en ligne.
Une meilleure valorisation du produit en donnant des explications techniques réelles, comme avec la storystelling, impliquant affectivement le lecteur, mais aussi via ces petits robots Bots à la disposition du lecteur pour toute question basique sur un produit.
Casser les grilles de dispositions graphiques
Mais pour qu’un texte donne envie de le lire, un sérieux travail doit être réalisé en amont en ce qui concerne la disposition. En 2017, on casse les rituels, on brise les grilles que nous connaissons tous, et on passe à des mises en page visuellement puissantes et efficaces.
Autrement dit : les layouts deviennent beaucoup plus fonctionnels et ludiques, de nouvelles grilles de CSS ont d’ailleurs déjà vu le jour en Mars dernier, on utilise le Split-content afin de diviser sa page en plusieurs parties, avec chacune un contenu différent.
Le Flatlay est également une autre technique correspondant à un style photographique efficace, grâce à une prise de vue en plongée pour un plan de vue complètement « éclaté ».
Et enfin, le système Hamburger Menu remplace les phrases par des images. Pari relevé : des dispositions graphiques entièrement modifiées, afin d’inciter à une meilleure concentration et interaction du lecteur.
Des animations attrayantes et visuelles
Et voilà Le gros changement pour 2017 dans le web design : les effets Hover pour inciter à cliquer, les effets Parallaxe ou Gif, toutes ces animations ont pour but de rendre particulièrement interactif le lien entre l’utilisateur et le site qu’il est en train de consulter.
Notons que ces animations deviennent vraiment très faciles à insérer, ce qui permet ainsi de rapidement personnaliser sa page. Cependant, et comme ce qui s’est passé avec le Flat Design, il est probable que ces animations visuelles deviennent si courantes que l’internaute risque à un moment de ne plus les remarquer pour cause de popularité.
Il est alors de bon ton de créer soi-même ses propres illustrations à la main. Réduire ainsi la distance, se faire familier avec le lecteur, redonner cette touche de « vrai » souvent difficile à insuffler dans le monde utile mais froid de l’informatique.