13 tendances en design web pour 2017

tendances web en 2017

Les tendances web de 2017 peuvent se résumer en deux mots : expérience utilisateur. Tous les éléments graphiques sont réfléchis de façon à retenir l’attention de l’internaute, à faciliter sa recherche d’information et à optimiser son expérience avec la marque. Voici 13 tendances qui influenceront nos designers et programmeurs dans la conception de sites web.

1. Encore plus d’interactions et d’animations

Les « micro-interactions » sont des signaux visuels qui apparaissent lorsqu’un utilisateur effectue une certaine action (exemple : un bouton qui change de couleur lorsqu’on le survole avec la souris). En plus de guider l’internaute, ces animations subtiles et interactives rendent l’interface plus attrayante et plus compréhensible.

Parmi les animations populaires en design web, on retrouve encore une fois cette année les cinemagraphs : des images statistiques dans laquelle on retrouve un léger mouvement répétitif. En raison de leur capacité à se démarquer, les cinemagraphs seront largement utilisés sur les sites de ventes en ligne et les bannières publicitaires.

2. Du contenu mieux structuré

En plus d’être visuellement attrayante, la disposition en blocs (modular layout) permet de définir clairement chaque élément de contenu et de hiérarchiser l’information, pour ainsi mieux diriger l’internaute vers ce qu’il l’intéresse vraiment. On aura droit également à du contenu centré ou divisé à la vertical.

Exemples : 

tendance design web - site web des Hôte;ls Villegia et site web Le Vertendre

 

3. L’approche mobile avant tout

On sait maintenant que le trafic Internet provient en plus grande partie des appareils mobiles (téléphones intelligents et tablettes) que des ordinateurs (1). De plus, un site adapté aux différentes tailles d’écran obtient un meilleur classement dans les moteurs de recherche. Avec ces deux raisons, il n’y a plus d’excuse pour que votre site soit facilement accessible et lisible pour tous les utilisateurs. La solution? Optimiser le contenu en fonction du support utilisé par l’internaute avec une version adaptative de votre site existant (responsive) ou créer une nouvelle version spécifique aux utilisateurs d’appareils intelligents (mobile). Repenser l’interface en fonction des appareils intelligents a pour avantage de nous obliger à prioriser l’information et à faciliter la navigation, afin d’offrir une meilleure expérience aux utilisateurs.

(1) Infopresse

Exemple : 

tendances design web - site web d'Oxynova

4.  Le retour du design minimaliste

Créer du contenu qui s’adapte aux différentes tailles d’écran nous force à revenir à l’essentiel, en misant sur la qualité plutôt que sur la quantité, au travers d’un design réfléchi, concis et épuré qui permet de mettre en évidence l’information la plus importante.

5. La vidéo plus que jamais

En 2017, la vidéo sera au cœur de toutes les stratégies; on estime qu’elle représentera près du ¾ du trafic Internet. Intégrée sur un site et partagée sur les médias sociaux, la vidéo est un outil puissant pour rejoindre votre cible et l’engager. Voici quelques-uns de ses nombreux avantages :

  • Stimuler les conversions et les ventes
    64 % des utilisateurs sont plus enclins à un acheter un produit en ligne après avoir visionné une vidéo (2).
  • Renforcer la confiance et la crédibilité
    Parce qu’elle permet de mettre un visage ou une personnalité derrière la marque, la vidéo a pour effet de rassurer les clients et d’établir une relation avec eux.
  • Obtenir un meilleur classement
    La vidéo permet d’augmenter le temps passé par les utilisateurs sur votre site. Ceci a pour effet d’envoyer un signal aux moteurs de recherche qui considèrent alors votre contenu comme pertinent.
  • Montrer plutôt que raconter
    En quelques secondes, la vidéo a le pouvoir de retenir l’attention, tout en transmettant un message de façon simple et rapide.
  • Améliorer sa visibilité
    Avec l’explosion des médias sociaux, la vidéo est une solution efficace pour susciter un intérêt envers votre marque, favoriser les partages et générer plus de trafic vers votre site. D’ailleurs, les interactions en direct sur les médias sociaux comme Twitter, Facebook ou Instagram gagneront en popularité.

(2) Insivia.com

Exemples :



exemple de tendance design web - vidéo sur page d'accueil de Destination Memphrémagog

6. Des couleurs audacieuses et des typographies surdimensionnées

2017 sera assurément l’année des couleurs osées! Cette tendance, attribuable en grande partie à l’émergence de Material Design par Google, se manifeste par l’utilisation de ton sur ton, dégradé, duo de teintes contrastées, textures et motifs qui ont pour effet de créer un élément de surprise.

Exemple de couleurs Material Design :

exemples de couleurs material design

La typographie est une belle façon de créer un maximum d’impact dans un espace limité. Jouer avec le style et la taille de la typographie donne une personnalité à votre marque et ajoute du dynamisme au contenu. Avec plus de 800 polices gratuites, le répertoire de Google Fonts permet d’être créatif, sans compromettre l’affichage du contenu ou la vitesse du site.

Exemple :

 7. L’adoption du format SVG

Le SVG (Scalable Vector Graphics en anglais) est un format qui supporte les éléments vectoriels (graphique, logo, icône, schéma, etc.) sur le Web. Il présente deux principaux avantages, comparativement aux formats traditionnels tels que JPG, PNG et GIF :

  • Le format d’image est plus léger, ce qui a moins d’impact sur le chargement des pages;
  • Les images peuvent être redimensionnées sans perdre leur qualité.

Le SVG est particulièrement utile pour faire afficher un logo sur un site web, puisque sa résolution ne sera jamais affectée, qu’importe l’appareil utilisé.

8. Des images authentiques

Les consommateurs recherchent des images personnalisées, qui représentent vraiment vos produits et services, votre environnement de travail, la culture de votre entreprise, ou encore, qui sont en phase avec leur style de vie. Non seulement les pages web qui contiennent de vraies photos ont tendance à obtenir un plus grand taux de conversion, elles pourraient également bénéficier d’un meilleur classement sur Google qui pénalise le contenu dupliqué (contenu identique ou similaire retrouvé sur plusieurs sites) (3). En 2017, on dit donc non aux banques d’images et on privilégie les photos uniques qui projettent une image réelle de ce que votre entreprise offre.

(3) BlueCompass.com

9. Le « live » et la conversion 24/7

Avec plusieurs plateformes gratuites comme Periscope, Facebook, Instagram et Twitter, la vidéo en direct (live streaming en anglais) connaîtra encore plus de succès cette année. Les internautes sont des adeptes de cette tendance, car ils peuvent interagir en temps réel avec une entreprise et les autres membres de la communauté. Engageante, la vidéo en direct est un outil peu coûteux qui peut servir à présenter un nouveau produit en primeur, montrer la fabrication d’un produit, son utilisation ou son installation, à réaliser des entrevues avec votre personnel, à organiser une séance de questions-réponses ou à promouvoir un événement.

La vente en ligne a connu un boom exponentiel au cours des dernières années. Dans le but d’offrir aux consommateurs une aussi bonne expérience qu’en magasin, plusieurs entreprises se tournent vers le clavardage pour les accompagner durant leur magasinage en ligne ou leur offrir du support technique. En 2017, la nouveauté se trouve dans la façon de démarcher le visiteur et d’initier la conversation : plutôt que d’attendre sa question, on lui propose un message personnalisé en fonction des pages qu’il visite. Par exemple, si un visiteur navigue dans la section catalogue de votre site, une fenêtre pop-up s’affiche et lui propose de parler avec un représentant des ventes.

Notre recommandation
Nous avons eu la chance de tester l’outil LiveChat pour plusieurs de nos clients. Nous vous invitons à télécharger l’essai gratuit de 30 jours et à communiquer avec nous pour en faire l’installation sur votre site web ou bien comprendre son fonctionnement.

10. La réalité virtuelle (RV)

La réalité virtuelle a connu une forte ascension l’année dernière. Les entreprises ont été nombreuses à développer des applications, vidéos ou casques de réalité virtuelle. En novembre 2016, Google lançait une chaîne spécialisée sur Youtube de vidéos de RV pouvant être visionnées à l’aide de son masque Cardboard, qui se fixe sur un téléphone intelligent. Le journal The New York Times, quant à lui, envoyait un million de « lunettes » Google à ses abonnés afin qu’ils puissent regarder un film de 10 minutes, via son application NYT VR.

Devant les possibilités qu’offre cette technologie, qui devient de plus en plus accessible aux consommateurs,  les marques commencent à l’intégrer dans leurs campagnes. Bien que le marché soit encore restreint jusqu’à maintenant, on prévoit que la réalité virtuelle s’intensifiera au cours des prochaines années. Avec la RV, le consommateur n’est plus qu’un simple spectateur, il devient l’acteur de la scène dans laquelle il est immergé. En repoussant les limites de l’expérience usager, la RV permet de redéfinir la façon de communiquer et de créer un lien encore plus personnel avec les consommateurs.

11. L’abandon du support des anciens navigateurs

En janvier 2016, Microsoft annonçait l’abandon du support de ses anciens navigateurs web, soit Internet Explorer 8, 9 et 10. Ces versions ne recevront plus de mises à jour de sécurité, de correctifs de compatibilité ou d’assistance technique (4). En raison de leur manque de sécurité et de leurs défaillances techniques puisqu’ils ne reconnaissent pas les fonctionnalités de CSS3 ou du HTML5, les développeurs ne pourront plus garantir que le site fonctionne bien sur de tels navigateurs.

(4) Microsoft.com

12. L’utilisation des microdonnées

Les microdonnées (micro-data) sont des balises sémantiques que l’on intègre dans le code HTML d’une page web pour mieux structurer son contenu. Ces données sont traitées par les moteurs de recherche afin de proposer aux internautes des résultats de recherche plus pertinents. Elles peuvent prendre la forme d’un avis (étoiles de classement), d’une adresse, d’un horaire, etc. Ce balisage permet de démarquer les sites dans les résultats de recherche et, surtout, d’augmenter le taux de clics en accédant directement à la page qui intéresse l’internaute.

13. Le contenu « intelligent »

Toujours par souci d’offrir une expérience personnalisée, les sites seront de plus en plus nombreux à afficher du contenu en fonction des caractéristiques de l’internaute ou de la page qu’il visite. Par exemple, en sachant la géolocalisation de l’internaute, il est possible de faire afficher un message pop-up pour lui fournir l’adresse du magasin le plus proche.

Avec le développement de l’intelligence artificielle (AI), les entreprises seront plus enclines à utiliser cette technologie, notamment pour offrir de l’assistance « virtuelle » à leur clientèle. Les chat bots font référence à des logiciels informatiques qui remplacent les humains derrière l’écran, en lisant et en répondant aux messages de l’usager, grâce à un ensemble de réponses préenregistrées. Ils permettent d’établir une relation conversationnelle 24/7, sans devoir impliquer une vraie personne dans toutes les interactions entre l’entreprise et ses clients.

Certains sites plus avancés dotés de CRM (système de gestion de la relation client) vont préprogrammer des actions selon des conditions ou des contextes qui permettent d’être plus efficace dans leurs échanges avec le client. Par exemple, un sondage de satisfaction envoyé automatiquement au client quelques jours après la réception de son achat internet.

En conclusion

Bien que les tendances web évoluent en fonction du comportement des utilisateurs et des avancées technologiques, il est important de rappeler qu’elles ne sont pas nécessairement pertinentes ou appropriées pour toutes les entreprises. C’est notre rôle à l’agence de déterminer les fonctionnalités qui répondront le mieux aux besoins de votre clientèle et qui, par conséquent, rendront votre site plus rentable.