Créer un site internet est un travail plus compliqué qu’il n’y paraît. En dehors de l’aspect graphique d’un site, il faut sérieusement connaître les plateformes sur lesquelles celui-ci sera vu ainsi que de nombreuses limitations techniques. Voici un rappel de 10 erreurs à éviter avant de présenter sa maquette.
Rendre le texte illisible
Une belle police de caractères est très importante lors de la création d’un site vitrine ou e-commerce, elle vous permettra de vous différencier de vos concurrents de manière subtile sans que vos utilisateurs ne s’en rendent compte immédiatement. Cependant, il ne faut pas privilégier la lisibilité à l’aspect esthétique. Une police Arial sera toujours préférable à une police moderne mais dure à lire.
Par exemple, sur le site ticketac.com, les textes sont très fins et fatiguent rapidement, en la remplaçant par une police gratuite téléchargeable sur Google Font, on obtient un résultat plus clair.
Ignorer la ligne de flottaison / Ne pas visualiser le rendu sur un navigateur
Lorsque l’on créé une maquette web, on a tendance à se retrouver avec une grande page sur notre logiciel préféré, sur laquelle on zoom et on dézoome, perdant ainsi la notion de ligne de flottaison ou de taille. De même lorsqu’on présente cette version à un client, celui-ci risque de ne pas se rendre compte de l’aspect final sur un navigateur, surtout avec des spécificités comme un fond fixe.
Notre solution : Présenter une maquette sur un navigateur en enregistrant deux images, le fond et le contenu. Vous aurez alors tout de suite une vue plus réaliste de votre maquette en plein écran.
Ne pas avoir une ligne graphique cohérente
Avant toute chose, il faut définir une ligne graphique, des couleurs thématiques et s’y tenir( lire notre article sur la symbolique des couleurs ). Si vous optez pour un style sobre et minimaliste, évitez d’ajouter un diaporama avec beaucoup d’effets. Ne mélangez pas plus de deux typographies (Une pour les titres, l’autre pour les autres textes) ni trop de couleurs. Soyez strictes sur votre charte et utilisez une grille pour garder une cohérence dans la gestion de vos espaces.
Faire une maquette pour son client et non pour les visiteurs
Une erreur a éviter est la création d’un visuel qui plaira à votre client mais sera peu adapté à la cible de celui-ci. Il est important de connaître la tranche d’âge de son public ainsi que le type de secteur. Un site financier ou juridique n’aura ainsi pas le même thème visuel qu’un site événementiel ou encore d’animations. Cibler son persona est l’élément majeur qui devrait guider votre réflexion. Nous constatons presque tous les jours que c’est la principale source d’erreur qui conduit à l’échec les webmasters et leurs clients.
Vouloir mettre tous les éléments en avant
Il est tentant de donner un style léché à tous les éléments de votre site, mais en faisant ça, vous risquez de noyer les informations importantes. Tous les boutons n’ont pas besoin d’être en couleur, les boutons qui reviennent souvent comme « Détails » sur un site marchand, peuvent être laissés en gris clair afin de mettre en valeur le bouton d’achat qui est essentiel. Utilisez votre couleur complémentaire avec parcimonie afin de la faire ressortir encore plus.
Ne pas tenir compte du poids des éléments graphiques
Un détail plus qu’important lors de la création (ou refonte) d’un site web est sa rapidité. Aucun élément ne doit être ignoré et il faut donc faire attention à ne pas utiliser de photos ou visuels d’une qualité trop importante. Inutile d’utiliser une image en png et en 300dpi lorsqu’une image jpeg en 72dpi fera tout à fait l’affaire.
De plus, évitez les images inutiles lorsqu’un peu de code peut être utilisé, comme pour la création de boutons ou d’animations !
Oublier les différents navigateurs et leurs différentes versions
Cela peut être un parti pris d’ignorer des versions trop anciennes de certains navigateurs (en affichant un lien demandant alors d’upgrader le navigateur du visiteur), mais il faut garder en tête que votre public n’utilisera pas le même navigateur que vous. Internet Explorer pose de moins en moins de soucis mais n’oubliez pas que certains visiteurs peuvent avoir une version antérieure qui n’affichera peut-être pas des éléments clés de votre site internet. De même, certaines animations ou règles CSS risquent de ne pas fonctionner avec Internet Explorer ou Safari.
Un beau design au profit d’une navigation cohérente
Un beau design soigné plaira toujours à vos clients mais pensez-vous aux utilisateurs ? Si ceux-ci ne trouvent pas les fonctionnalités dont ils ont besoin, ils risquent de tout simplement quitter le site très rapidement.
Par exemple, vous créez un menu très moderne et impressionnant qui s’ouvre en cliquant sur une icône particulière. Certes, c’est beaucoup plus joli qu’un simple menu statique horizontal mais êtes-vous sûr que vos clients penseront à cliquer sur cet onglet ?
Concevoir une maquette en oubliant les différents formats d’écrans
Avec l’apparition de tous les différents supports existants (tablettes, mobiles, phablettes et autres à venir !) il est maintenant impossible de créer un site internet avec une seule résolution. Il faut donc penser à tous les formats que votre site pourrait prendre et donc décider de l’organisation de votre contenu lorsqu’il est vu sur un ordinateur bureau, une tablette ou un téléphone portable.
Il est même probable que certains éléments disparaîtront comme un diaporama ou prendront alors un format carré.
De plus, il ne faut pas oublier que certaines actions, comme le fait de survoler un élément avec sa souris, ne pourront pas être réalisées sur un écran tactile.
Ne pas penser à l’intégration de la maquette
Souvent, le/la graphiste chargé(e) de la création de la maquette n’intégrera pas celle-ci en ligne. Cependant, il est plus qu’important de faire appel à un graphiste qui connaît les limitations techniques de la plateforme que vous utilisez ou saura designer des éléments qui pourront être générés en code. Par exemple, utiliser un simple fond pour vos boutons ou visuels (Détails, Acheter etc) plutôt qu’une image vous permettra de charger plus vite votre site.
Un graphiste sachant coder pourra ainsi choisir le type d’animation ou de rendu qui sera le plus léger pour votre site internet. Il est parfois plus simple de créer de simples animations en HTML et CSS qu’en gif ou flash.
Laissez un commentaire