• Notre méthodologie
• En savoir plus

Visuel

Les standards visuels du web sont très nombreux, s'attardant notamment à la structure et la longueur des pages, la typographie, les couleurs, les images et l'arrière-plan.

Structure de page

Le squelette graphique d'une page type s'articule généralement de manière à retrouver :

• Un logo dans le haut, à gauche, émettant usuellement un lien interne vers l'accueil;
• Un en-tête accrocheur, contenant généralement le nom de votre entreprise, disposé à la droite du logo, toujours en haut de page. Cet en-tête peut être fixe ou variable en fonction de la page et/ou section dans laquelle se trouve l'internaute. Il arrive également d'y retrouver une navigation utilitaire, permettant d'accéder aux sections indépendantes de la structure hiérarchique (Nous joindre, Nouvelles et événements, Plan du site, etc.)
• Un premier niveau de navigation permettant d'accéder aux sections principales, situé sous l'en-tête.
• Un second niveau de navigation permettant d'accéder aux sous-sections, situé sous le logo.
• Un corps de page, contenant l'essentiel de l'information, disposé sous le menu entre le menu secondaire et les boîtes d'action. Le corps de page débute généralement par un fil d'Arian (breadscrumb), outil de navigation constitué d'une suite de liens hiérarchisée permettant à l'usager de se situer dans la structure du site web et de retourner facilement aux rubriques parentes.
• Un pied de page regroupant quelques informations utiles telles que la date de dernière mise à jour, avis de copyright, etc. Le pied de page marque la fin du corps de page.

Il s'agit là du canevas le plus répandu sur le web. Bien sûr, d'autres structures de page peuvent être adoptées pour votre site web, mais il convient de ne pas trop déboussoler les internautes. À noter que la structure de l'accueil, par convention, diffère généralement quelque peu du reste du site web, mais il faut s'assurer de respecter une certaine uniformité dans l'ensemble.

Taille de page
Selon les règles de l'art, la taille des pages de votre site web doit permettre un affichage optimal pour les internautes. D'une part, il convient d'éviter à tout prix les barres de défilement horizontales. Pour ce faire, il s'agit de s'ajuster à la résolution d'écran de votre public cible. Selon les tendances générales du web, approximativement 50% des internautes utilisent une résolution d'écran de 768 x 1024. Il peut s'avérer utile de laisser une marge horizontale d'une vingtaine de pixels ou plus de manière à prendre en considération les barres de tâches de Windows et les barres de défilement verticales. En ce qui concerne la longueur, il est préférable de se limiter à trois hauteurs d'écran. Autrement, les pages de votre site web ne seront fort probablement pas lues entièrement par les internautes, et elles prendront davantage de temps à se charger. 

Votre site web est-il optimisé pour une résolution d'écran adéquate? Faites le test! Assurez-vous d'appliquer une résolution de 1024 x 768 dans les paramètres d'affichage de votre ordinateur avant de visiter votre site web. Une barre de défilement horizontale apparaît-elle? La plage verticale de vos pages web surpasse-t-elle trois hauteurs d'écran? Si oui, votre site web n'est pas conforme aux règles de l'art. Il est donc fortement conseillé d'ajuster en conséquence la taille de vos pages web. Une stratégie des plus efficaces pour s'assurer d'un affichage optimal en tout temps consiste à générer plusieurs versions de votre site web, une pour chacune des résolutions les plus répandues, puis d'implanter un script permettant de détecter la résolution d'écran des visiteurs de manière à les rediriger par la suite vers la version la plus appropriée.

Couleurs
La palette de couleurs de votre site web doit évidemment correspondre à votre image d'entreprise (logo, documents de présentation, campagnes publicitaires, etc.). Il convient toutefois de se limiter à un maximum de 3 couleurs principales différentes afin de ne pas trop agresser l'œil des internautes. Il est également conseillé d'établir une couleur prédominante relativement sobre, à laquelle s'adjoindront quelques couleurs secondaires plus dynamiques. Les couleurs d'arrière-plan sombres sont généralement déconseillées, car le visuel qui s'en dégage est souvent trop lourd.

Choix des images
Dans un site web, les images doivent être utilisées avec parcimonie afin de ne pas gêner le confort visuel des internautes. Dans la mesure du possible, tentez d'uniformiser l'emplacement des images. Il peut être intéressant, par exemple, d'insérer une image d'en-tête différente pour chaque page ou section de votre site web. Lorsqu'une grande quantité d'images doit être intégrée, privilégiez l'implantation d'une section spécifique à cet effet dotée d'une galerie d'images. Évitez d'inclure trop d'images animées, car vous risquez d'irriter le visiteur. Les images contenant du texte, surtout lorsqu'il s'agit de mots-clés, doivent également être évitées puisqu'elles nuisent au référencement.

Il est fortement déconseillé d'utiliser plus de deux polices de caractère sur un site web. Pour le corps du texte, privilégiez les polices de caractère standards sans empattement (Arial, Verdana, Helvetica, etc.), afin de faciliter la lecture. Utilisez les polices de caractère stylisées avec parcimonie, uniquement lorsque vous désirez attirer l'attention des internautes. Assurez-vous que les polices de caractère utilisées sont compatibles avec les principaux navigateurs web.