Décryptons les tendances Web Design & Design Digital de 2017 (Deuxième partie)

Cet article est le deuxième d'une série de trois sur les tendances du web design en 2017. Lire la première partie. Il y a peu, nous sommes tombés sur l'ebook "Web Design Trends 2017" du site www.uxpin.com retraçant comme son nom l'indique les tendances observées durant cette année (qui n'est pas encore finie). Bien sûr, nous pourrions tout simplement vous dire de le télécharger et de le parcourir dans votre coin, mais en tant qu'intervenants plongés tous les jours dans ce domaine, nous vous avons simplifié la tâche (et évité de vous faire lire 66 pages dans la langue de Shakespeare) en en faisant une synthèse, ci dessous, présentant les points clés que nous avons retenus, accompagnés de notre avis sur ces derniers.

Des typographies simples, mais lisibles et surdimensionnées

Depuis quelques années, et encore plus en 2017, on voit de plus en plus de projets composés de grandes typographies oversize fleurir sur les site web, que ce soit pour habiller une bannière d'accueil, séparer des niveaux ou créer des effets de style (par exemple un texte qui vient mordre une photo tout en partant d'un aplat). Cette tendance remplace même petit à petit l'iconographie, qui était, à un moment donné, peut-être sur-utilisée avec des éléments qui se ressemblaient quasiment tous d'un site à un autre. L'ebook donne aussi le conseil de plutôt utiliser des typographies "bâtons". Notre avis : Au sein de l'agence, nous ne généralisons pas les éléments oversize, mais, au cœur du studio créatif, nous sommes persuadés que c'est une bonne tendance. Plusieurs raisons à cela, la typographie existe depuis quasiment toujours, et même si elle peut connaître des "modes", elle a son histoire, elle est universelle et surtout elle est compréhensible de tous, là où des pictos peuvent parfois vite être "démodés". Ou ne pas être compris, tout simplement. Le fait de la jouer de façon oversize amène vite un message et donne de l'impact à l'introduction d'une interface ou d'un contenu. Il ne faut pas avoir peur d'aller en ce sens (le slogan d'une affiche 4/3 n'est jamais écrit en petit, il faut qu'il soit lisible perceptible et de loin, il faut essayer de raisonner pareil pour le web en plus des problématiques spécifiques). De plus, les nouvelles technologies d'intégration nous permettent d'intégrer des polices dites "exotiques", ce qui permet d'apporter d'autant plus d'originalité. Pour ce qui est de privilégier des typographies "bâtons", nous n'avons pas un avis aussi tranché... En effet, déjà il faut composer avec la charte graphique du client, si elle existe, et, d'autre part, une police avec empattement peut aussi amener de l'identité, de l'impact ou un esprit graphique, là où une typographie bâton évoque souvent le minimalisme et la simplicité. C'est ici plus un point subjectif. Aussi, comme nous l'avions évoqué dans un article précédent, il est aussi possible de jouer de la typographie "faite main" créée par des "lettreurs/typographes", ce qui apportera encore plus de cachet et de singularité. Par contre dans ce cas, le revers de la médaille est qu'on ne peut pas la référencer. Il faut aussi ici penser à son objectif initial.

Site Pumperl Gsund

Le contraste, le nerf de la guerre

Ici, l'ebook ne nous apprend rien de nouveau, sinon nous rappeler (et il le fait bien) que le contraste reste le maître mot d'un design d'interface web. En effet, si vous voulez que votre site soit lu et lisible, il faut s'assurer que vos éléments (qu'ils soient du texte, des liens ou des boutons d'action) soient bien différentiables et perceptibles par rapport à vos éléments d'arrière plan (aplat de couleur, photo, illustration, vidéo...). Notre avis : Ici, nous sommes bien évidemment d'accord. Au delà d'être une tendance, cela en devient même logique. De plus nous militons toujours en ce sens, pour une autre raison : il y a énormément d'écrans de différentes qualités sur le marché, et un contraste trop doux ou faible peut parfois amener des surprises comme une non perception d'un niveau de lecture par exemple, ou des difficultés de lecture pour des personnes ayant des problèmes de vue. Prévoir un bon contraste maximise l'accessibilité du plus grand nombre à votre interface.

site Reputation Squad

De la couleur, de la couleur ! Oui mais seulement deux

Hormis le noir et blanc qui ne sont pas considérés comme des couleurs, il est conseillé de n'utiliser que deux couleurs dans un projet pour maximiser la cohérence graphique d'un projet dans sa globalité. Notre avis : Chez Concept Image, c'est une idée avec laquelle nous sommes tout à fait à l'aise. En effet quand on pense à un projet web, il ne faut pas penser qu'à la homepage (que l'on pourrait comparer à un "produit d'appel") mais à la globalité du site ou de l'application, et notamment ses pages les moins "visuelles". Or, multiplier les couleurs peut vite devenir difficile à définir et à utiliser de façon correcte et cohérente sur un ensemble de pages. Deux couleurs vont aider à stabiliser une hiérarchie et à définir une vraie cohérence graphique. Cependant, il peut arriver qu'un projet nécessite plus de couleurs (pour différencier des offres ou des marques par exemple, ou par réelle volonté créative). Dans ce cas, c'est au designer de trouver des astuces de structure pour amener la cohérence du projet d'une autre manière. Ici encore, l'objectif initial du site et sa cible seront primordiaux afin de savoir si on peut s'autoriser un peu d'excentricité ou rester dans des codes plus classiques.

OK, deux couleurs. Mais alors des couleurs vives et audacieuses !

On a vu naître beaucoup de projets cette année utilisant des couleurs très vives, voire saturées ou presque fluos. Cela a apporté de la couleur et des interfaces assez osées. Notre avis : Nous pensons que c'est un effet de mode un peu comme les couleurs dans le monde du textile, mais il est vrai que ces couleurs ont rafraîchi les interfaces, leur ont donné de la vie, et les ont fait sortir du minimalisme trop poussé à base de noir et blanc. En somme, nous avons aimé ! Et nous espérons que cela continuera en ce sens !

Site de Tealer

Une iconographie ? Pourquoi pas ? Mais originale et impactante

Une phrase pourrait résumer cette "tendance" : ne pas faire de l'iconographie pour faire de l'iconographie ! Si on fait le choix d'un site illustré, il faut savoir placer les éléments aux endroits clés. Et, si on utilise des pictos assez généralistes, ne pas trop en abuser. Dans le cas où on souhaiterait avoir un site très chargé en pictos ou illustrations, il faut définir une ligne artistique claire et originale afin d'apporter de l'impact visuel, et s'assurer également de leur bonne compréhension. Notre avis : Nous sommes assez d'accord pour dire que "l'iconographie a connu son heure de gloire" avec, à un moment donné, une sur-utilisation d'icônes qui se ressemblaient relativement d'un projet à un autre. Un peu à l'instar de la tendance minimaliste où tous les sites étaient construits sur des fonds blancs. De plus, des études ont démontré depuis que la plupart des gens ne travaillant pas dans le web (les utilisateurs en général pourrait-on dire) ne comprenaient pas la majorité des pictos que l'on est habitué à voir et à comprendre lorsque l'on évolue, au contraire, dans l'univers digital au niveau professionnel. Notre conseil irait donc plutôt dans le sens de l'ebook, à savoir placer les pictos qui sont utiles et aident à la compréhension à des endroits clés pour les visiteurs, ou imaginer un système illustratif singulier, travaillé et identifiant avec la nature du projet et du secteur d'activité.  

Site Wrk

Lire la suite : Décryptons les tendances Web Design & Design Digital de 2017 (Troisième partie)