5 Conseils pour améliorer le design de votre site web (partie 1)

Par Chromatic Sites, le 5 octobre 2007, traduit par Christophe Da Silva

Que détestez-vous le plus lorsque vous visitez des sites web ? Si vous surfez autant de sites web que nous, vous avez de quoi en détester plus d'un. Parce qu'ils sont une armée à être mal conçus pour les utilisateurs, et nous avons donc décidé de proposer cette liste de conseils sur l'optimisation du design de sites web.

Lors de la création d'un site internet, il y a un certain nombre de choses qu'un web designer doit prendre en considération si son objectif est de produire un site internet de grande qualité et en adéquation avec les utilisateurs (utilisabilité).

Les Palettes de Couleurs

Il n'y a rien de pire que de visiter un site internet et de voir un ensemble de couleurs qui se marient très mal, provocant de très nettes lignes de démarcation, allant jusqu'à jurer avec les couleurs du texte. Aussi basique que cela puisse être, beaucoup de gens passent un temps phénoménal à trouver et employer de bons jeux de couleurs. Bien qu'il existe des millions de couleurs parmi lesquelles choisir, ce n'est pas un processus difficile. En effet, que vous investissiez dans un logiciel qui vous simplifie significativement le processus de sélection de vos combinaisons de couleurs ou que vous utilisiez l'un des outils gratuits de gestion de palettes de couleurs, vous implémenterez des combinaisons de couleurs attractives en un rien de temps.

Logiciel payant

Si vous souhaitez investir dans un logiciel de gestion de palettes de couleurs qui fera tout le travail pour vous, aors la meilleure solution reste Color Scheme Studio, disponible à la fois pour Mac OS X et les différentes versions de Windows. Cet outil ne se contente pas de bâtir pour vous l'intégralité d'un jeu de couleurs à partir d'une couleur donnée, mais il vous fournit également pour cette couleur ses versions monochromes, couleurs complémentaires, combinaisons trichromes et quadrichromes ainsi que les harmonies analogues basées sur cette même couleur. C'est un outil absolument remarquable. Il existe également beaucoup d'autres fonctionnalités pratiques dans cet outil.

Logiciel gratuit

Si vous ne souhaitez pas investir la modique somme de 49,99$ pour Color Scheme Studio, il existe d'autes alternatives gratuites. Il existe un outil en technologie Flash pour lé génération de palettes de couleurs : Color Wizard. Bien qu'il soit moins esthétique et intuitif que Color Scheme Studio, Color Wizard possède un grand nombre de fonctionnalités bien utiles. Vous pouvez soit entrer le code hexadécimal de la couleur, soit déplacer le curseur pour trouver la couleur que vous cherchez. Color Wizard vous donne également les multiples harmonies basées sur la couleur que vous avez choisie. Color Wizard est un outil pratique (et gratuit) pour la création de combinaisons de couleurs. La seule chose qu'on pourrait lui reprocher est d'être uniquement disponible online, a contrario de Color Scheme Studio qui ne nécessite pas d'être connecté à Internet pour être utilisé.

Le mieux est l'ennemi du bien

Lorsque vous choisissez une combinaison de couleurs, n'utilisez pas trop de couleurs. L'adage "le mieux est l'ennemi du bien" vaut également lors du processus de sélection de la combinaison de couleurs. Combien de couleurs doit-on utiliser ? C'est une question à laquelle il est difficile de répondre. Bien qu'il n'y ait aucun nombre défini, il est généralement préférable de travailler autour de 3 couleurs :

La couleur primaire : c'est la couleur principale qui occupe la majorité de la page. C'est celle qui donne le ton général du site.

La couleur secondaire : la seconde couleur a pour objectif de renforcer la couleur primaire. La seconde couleur est en général une couleur similaire à la couleur primaire

La couleur dominante : c'est la couleur qui est utilisée pour mettre en exergue certaines parties de la page. C'est d'habitude une couleur qui contraste avec les couleurs primaire et secondaire, et en tant que telle, elle doit être employée avec modération. Si vous employez l'un des outils mentionnés plus haut, il est préférable d'employer des couleurs complémentaires ou les couleurs "split-complementary".

Il existe un grand nombre de ressources sur le Web qui expliquent les schémas de couleurs de manière détaillée. Quoiqu'il en soit, si vous utilisez l'un des outils mentionnés plus haut et appliquez ces quelques conseils, vous n'éprouverez plus aucune difficulté à créer de beaux jeux de couleurs pour votre site web.

La technologie Flash

Lorsque Flash est utilisé de manière excessive ou de façon inappropriée, il peut être un ennemi : ennemi des moteurs de recherche tout autant qu'ennemi des internautes. Mais ne nous méprenons pas, Flash est un programme remarquable qui permet aux génies créateurs multimédia de produire des travaux fascinants. Cependant, les implémentations suivantes de Flash doivent être exclues de votre site web :

La navigation

Probablement la méthode la plus abusée et mal employée de Flash, une navigation en Flash est en général mauvais voire extrêmement mauvais. Pourquoi ? Pour un certain nombre de raisons :

Optimisation pour les moteurs de recherche (SEO) : si vous êtes familier avec la SEO, alors vous connaissez l'importance du texte dans une page. Le texte est ce qui vous permet d'être indexé convenablement dans les moteurs de recherche. Le problème avec Flash est que les moteurs de recherche ne peuvent entrer dans l'animation Flash pour collecter les informations textuelles. Ce qui veut dire que lorsque les robots d'indexation parcourent votre site et arrivent sur votre navigation en Flash, ils l'ignorent tout bonnement. Si vous avez des mots-clés dans votre navigation en Flash qui sont pertinents par rapport au reste du contenu de votre site, ils ne seront pas indexés ou notifiés par les robots.
Le temps de chargement de la page : employer Flash pour votre navigation risque de ralentir le temps de chargement de votre page. Quoi que vous employiez sur votre site, chaque élément s'ajoute au ralentissement de votre page. Certaines choses, comme les navigations en Flash, sont à éviter. Certains fichiers Flash sont plus lourds que d'autres et plus un fichier est lourd, plus il ralentit le temps de chargement de la page, et donc vous risquez de perdre d'éventuels internautes impatients ou pas encore équipés de haut débit.
Inutilisabilité : l'objectif d'une barre d navigation d'un site web est de fournir, et bien, la possibilité de naviguer partout dans votre site ! Les navigations Flash interfèrent dans l'utilisabilité du site lorsque l'internaute doit attendre le chargement complet d'une animation chaque fois que le curseur de la souris passe sur un item du menu. Et au cas où vous ne le saviez pas encore, les internautes détestent attendre. Et il n'y a rien de plus détestable que de devoir attendre, même juste quelques secondes, pour activer un item particulier du menu de navigation lorsque la souris vient de le survoler.
Tout le monde ne dispose pas de Flash : Bien qu'il soit rare qu'un internaute n'ait pas Flash d'activé sur son ordinateur, cela peut toutefois arriver. Ces utilisateurs n'auront donc aucun moyen de surfer sur votre site. Et depuis que l'ingrédient-clé de la réussite d'un site est la navigation, ne pas avoir de barre de navigation pour les internautes ne disposant pas de Flash risque également d'handicaper visuellement votre site, et plus important, le rendre non-interactif et a fortiori inutile.

Le meilleur moyen de rendre votre menu de navigation accessible aux robots d'indexation, utilisable par les internautes et ultra-compatible est d'employer le CSS (Cascading Style Sheets). Le CSS résoud tous les problèmes que vous pouvez rencontrer avec une navigation en Flash. Il existe un grand nombre de ressources gratuites sur les navigations en CSS disponibles sur Internet. Dynamicdrive est un site extrêmement populaire et très largement utilisé par les web designers et développeurs, y compris nous.

Les intros Flash

Il ne fait aucun doute que la plus mauvaise façon d'employer Flash est de fournir une intro Flash sur votre site web. Les intro Flash sont ces animations ennuyeuses qui se lancent lorsque vous arrivez sur certains sites web. Si le contenu de votre site est utile et profitable, alors il n'y a aucune véritable raison de proposer une intro Flash. Ajouté à cela, la plupart des gens sont impatients lorsqu'ils surfent le web, et beaucoup d'entre eux n'ont pas le temps ou la patience de regarder une intro en Flash, souvent longue.

Si vous voulez toutefois utiliser une intro Flash, proposez un "skip intro" ou "passer l'animation" clairement visible. Ou encore mieux, au lieu de faire une intro flash qui se charge automatiquement à l'arrivée du visiteur, placez un lien descriptif bien mis en évidence sur votre site qui, une fois cliqué, permettra aux utilisateurs de voir votre animation promotionnelle (c'est que sont en général les intro Flash).

Pour terminer, soyez également vigilent avec l'inclusion du son dans vos intros Flash. Si un internaute a ses enceintes allumées à un fort volume, vous pourriez le surprendre. Ou tout simplement certains n'apprécient pas du tout la musique sur un site web, et il est vraisemblable que même si vous disposez de l'information qu'il recherchait, l'internaute préfèrerait celle proposée par votre concurrent qui ne l'agressera pas avec de la musique intempestive.

En Conclusion

Voici donc 2 de 5 conseils sur les manières d'optimiser le design de votre site web. Nous verrons prochainement les 3 derniers : l'information, les images texte et le nombre de colonnes dans l'architecture d'une page.

A propos de l'auteur

Si vous recherchez un professionnel du design de sites web, Chromatic Sites peut vous aider. Chromatic Sites publie également de longs articles 1 fois par mois et de plus courts 1 fois par semaine.

Retour

Imprimer cet article