Patience ... Je me fais beau

10 tendances du web design en 2018

Chaque nouvelle année est l'occasion des classements : "Top 10 des évènements marquants en 2018", "Le classement des personnalités de l'année"...
Le design web n'échappe pas à cette règle. Voyons ensemble quelles seront les tendances du design web en 2018.


  1. Animations
  2. Un peu de couleur dans ce monde de brutes
  3. Typos XXL
  4. A vos crayons
  5. Oublions la symétrie
  6. Mobilisez-vous
  7. E-commerce
  8. Arrondissons les angles
  9. Transitions
  10. Serif, fais moi peur

1. Animations

Les animations peuvent être utilisées pour inciter les visiteurs à interagir avec le site, ou le divertir en attendant une opération. Elles seront soit déclenchées (par un clic, un passage de souris, un scroll...), soit peuvent être en fond de page ou être tout simplement l'élément central d'un site web. Ces animations peuvent être réalisées en format SVG, ce qui les rend très légères à charger.
Quelques exemples d'utilisations :

... et bien d'autres exemples sur www.hongkiat.com

2. Un peu de couleur dans ce monde de brutes

Pantone l'a déclaré : la couleur de l'année 2018 sera l'ultraviolet.

On retrouve ce côté flashy dans les sites web, qui osent des couleurs vives et de fortes saturations. A noter également le retour du dégradé de couleurs, en fond d'écran ou utilisé en filtre sur une photo.

Besoin de créer votre site web ? Faites appel à Foxy Net

3. Typos XXL

Une grosse police tu utiliseras. Du gras, du gras et encore du gras.

En 2018 les polices ne se feront pas discrètes. Elles seront utilisées soit pour guider les lecteurs, soit comme un choix esthétique.

4. A vos crayons

Dans les années 60, la publicité était dominée par les illustrations. Une mode qui revient aujourd'hui dans le design web. Bonne nouvelle, enfin autre chose qu'une photo lifestyle d'une femme ou un homme au sourire parfait téléchargée dans une banque d'images gratuites !

Besoin d'un pro pour créer votre site web ? Foxy Net est là !

5. Oublions la symétrie

Une nouvelle tendance qui émerge est l'asymétrie et les mises en pages "cassées" (Broken layouts), avec des images et des contenus textes qui se superposent ou se croisent, allant ainsi à l'encontre des mises en pages web classiques en s'inspirant de la presse écrite.

  • Spotify

  • Un exemple de Broken layout par Dusko
  • Un broken layout renversant

  • A se demander parfois si c'est intentionnel ou juste une charmante erreur ...

6. Mobilisez-vous

Les Français privilégient désormais le mobile pour accéder à Internet. Selon Médiamétrie et eStat, 56% des visites de sites ont été réalisées par ce biais en juin 2017, contre 30,5% depuis un ordinateur et seulement 13,5% depuis une tablette. L'importance de la conception Web adaptée aux mobiles n'a cessé d'augmenter depuis plusieurs années, et cette tendance ne semble pas ralentir. On parle de « mobile first » dans le milieu.

Au cours de la première moitié de 2018, Google déploiera son nouvel index Mobile First, qui accordera beaucoup plus d'importance à la version mobile de votre site Web, en le positionnant en premier dans les résultats de recherche. Cela signifie que votre site Web doit avoir un design adapté aux mobiles. Mais ce n'est plus uniquement rendre son site internet "responsive", mais c'est une ergonomie, des tailles de boutons et des niveaux d'informations adaptés pour ces supports par essence plus petits.

Les pages mobiles accélérées (AMP) deviennent également très importantes : l'AMP est une norme de codage qui permet de charger rapidement les sites sur mobile. L'AMP est un must pour 2018.

Vous avez besoin d'un site web ? Ca tombe bien Foxy Net est là pour ça !

7. E-commerce

Selon la FEVAD, sur l’année 2016-2017, le CA du e-commerce a représenté 72 milliards d'euros (+14,6%).
Près de 83% des internautes français achètent sur Internet (36,6 millions de personnes), ils effectuent en moyenne 28 transactions par an, avec un panier moyen de 70€ (soit 2000€ euros dépensés par an).
200 000 sites marchands sont référencés en France.
L'ecommerce se porte donc très bien.

Deliveroo n'a pas de restaurants mais amène à peu près n'importe quel plat à notre porte. Amazon ne possède pas de boutique mais peut nous livrer presque tout le lendemain. On s'éloigne de plus en plus de la vitrine en ligne de la boutique physique et le 100% e-commerce est promis a un bel avenir.

8. Arrondissons les angles

Le design web et mobile a connu la suprématie des interfaces en "Card UI" depuis plusieurs années. Jusqu'à peu, ces "cartes" étaient très souvent à angles droits. Ca a changé en 2017. Maintenant, toutes les applications, en passant par Google Now, Twitter ou Facebook ont arrondi les angles de leurs cartes, champs textes etc.

  • A force d'arrondir les angles des rectangles, ca va devenir des ovales... Twitter

  • Même les images de fond s'arrondissent. Landing page Glax
  •  

  • Association de rondeurs et d'angles droits. CDU

9. Transitions

En navigant sur un site, quand on change de page, l'écran devient blanc pour quelques secondes. Rien de fascinant... Heureusement, on voit maintenant de plus en plus de sites qui nous donnent quelque chose de joli à regarder en attendant. La page de transition permet de donner une cohésion à l'expérience de navigation.

  • Ginventory

  • Transition par masquage / affichage du contenu
  • Une transition par rotation. Un peu déroutant.

  • Transition par animation SVG

  • Une transition rythmique

  • Transition par changement de perspective

10. Serif, fais moi peur

Les typographies dites "Sans Serif" (sans empattement) étaient les plus répandues à cause des écrans et des ordinateurs qui ne géraient pas très bien l'affichage des polices Serif. L'évolution des écrans et l'émergence de nouvelles technologies de polices comme la "Font Face" permet aujourd'hui d'intégrer n'importe quelle typographie sur tout type de site internet. Les polices Serifs permettent d'apporter un style différent, élégant et moderne.

Maintenant, passez à l'action ! Contactez Foxy Net pour créer votre site.