Vous êtes ici : Accueil >> Versions originales des articles de Christophe Da Silva >> Optimiser la structure d’une page web

Optimiser la structure d’une page web

Version originale de l'article publié le 26 avril 2011 © Christophe Da Silva

Une page web bien organisée permettra de mieux convertir les objectifs d’un site web. Les divisions géométriques des pages web ont fortement évolué depuis les premiers sites web pour aujourd’hui presque toutes présenter le même canevas : le header (l’en-tête), lefooter (le pied de page), les colonnes latérales et la zone de contenu. Voyons comment nous pouvons améliorer la structure de chacune des parties.

Bien structurer une page web, s’intégrant parfaitement dans un ensemble homogène, permettra d’améliorer les taux de conversion du site en mettant en exergue un certain nombre d’éléments dans les différentes divisions géométriques de celle-ci. Ces éléments jouent tantôt sur l’amélioration de la crédibilité, tantôt sur les réflexes de navigation basés sur les habitudes des internautes

Le Header d’une page web

Le header (en-tête) est la zone d’une page web qui s’affiche tout de suite, à l’ouverture de la page dans le navigateur. Ce header est par conséquent un élément stratégique de la page web, d’autant qu’il est reproduit sur l’ensemble des pages du site.

Le header doit faire l’objet d’une attention particulière car il doit orienter le visiteur, l’informer et le séduire. Le header est sans doute l’un des dispositifs les plus importants d’une page web en matière de conversion et à cet égard, il doit intégrer un certain nombre d’éléments.

Le logo du site web

Le logo représente l’identité du site. Si vous avez une activité réelle, il est préférable d’employer le même logo, vous capitaliserez ainsi sur la valeur de votre marque et renforcerez sa notoriété grâce au Web. De toute évidence, le logo doit être créé en fonction de l’audience ciblée, mais également en fonction du thème. Pour ce dernier point, renseignez-vous sur la signification des couleurs : par exemple, la couleur orange est connue pour stimuler l’appétit, elle est parfaitement adapté pour les sites sur la cuisine et les recettes.

Le baseline ou slogan

Peu de sites en définitive emploient un baseline ou slogan. Celui-ci a pour fonction de présenter l’offre et l’objectif global du site. Il se situe en-dessous ou à côté du logo.

Le champ de recherche

Idéalement, le champ de recherche doit se situer dans le header des pages. Ainsi, proposer l’accès à l’ensemble des pages depuis chaque page est devenu une convention. Le champ de recherche doit se situer en haut à droite du header.

Le menu de navigation horizontal

Une autre convention est de proposer une barre de menu de navigation horizontale permettant l’accès aux principales rubriques du site. Ce menu est d’autant plus stratégique sur les sites ecommerce et tous les plus grands sites ont adopté cet emplacement (Fnac.comRueducommerce.com…). C’est à cet endroit que les internautes ont l’habitude de rechercher les accès vers les différentes rubriques.

Le panier et un lien vers la confirmation de commande

Pour les sites ecommerce, positionner l’accès au panier et à la confirmation de commande dans le header est l’endroit qui convertit le mieux et est présent sur toutes les pages.

Les bannières pubs

De très nombreux sites insèrent un emplacement publicitaire dans cette zone. Mais les bannières publicitaires sont à double tranchant. En effet, il n’est pas souhaitable de distraire l’internaute de votre objectif de conversion. Seuls les sites dont le modèle économique repose sur les revenus publicitaires peuvent se le permettre. En revanche, vous pourriez toutefois utiliser cet emplacement publicitaire pour de l’auto-promotion et amener ainsi l’internaute vers une page construite dans le but d’augmenter les conversions du site (promotion, offre spéciale, évènement, nouveau produit…).

Les colonnes latérales et la zone de contenu

La plupart du temps, on observe des structures allant de 1 à 3 colonnes, la plus large (60% à 80% de la largeur) accueillant le contenu principal de la page.

Il y a quelques temps, j’ai publié un billet sur les études d’Eyetracking qui ont démontré que les internautes avaient un parcours de lecture très particulier et que la zone la plus vue dans une page web était celle qui était en haut à gauche.

De très nombreux sites se sont basés sur ces études et ont finalement restructuré leur site de manière à avoir la colonne du contenu le plus à gauche possible, à la manière des blogs. Les menus sont venus dans le header et les colonnes latérales se sont retrouvées soit fusionnées entre elles à droite, soit proposées distinctement à droite également. Les grands sites d’actualités proposent exactement cette structure (LeFigaro.frLeMonde.fr…).

Pour l’organisation d’un contenu rédactionnel efficace, merci de vous référer à ce billet : La technique de la pyramide inversée en rédaction web

Les colonnes latérales présentent ainsi l’accès aux rubriques filles (celles de la catégorie où l’internaute se situe), des blocs de publicités, des incitations à l’action et des remontées de contenus (comme les produits les mieux vendus sur un site ecommerce, les derniers commentaires d’un blog, les derniers actualités d’un site…).

Le footer (pied de page)

Le footer a longtemps été dénigré par les éditeurs de sites web, et à juste raison : c’est le contenu le moins visible d’une page web. Or, les habitudes des internautes ont évolué. Ainsi, ces derniers, ont de plus en plus pris l’habitude de se rendre dans le pied de page pour y trouver un lien en particulier.

Moi le premier, lorsque je me trouve sur un « gros » site, c’est-à-dire volumineux, avec beaucoup d’informations, je me rends dans le footer pour trouver le lien vers le plan du site.

Cependant, quelle que soit la taille du site, le footer, comme le header, doit recevoir une attention particulière, car il reste présent sur l’ensemble des pages. Dans le souci d’améliorer ses taux de conversion, il est donc nécessaire de soigner son footer. Afin de contribuer à l’amélioration du taux de conversion, le footer devrait présenter :

la navigation principale : il est désormais coutume de reprendre la navigation principale dans le footer. Souvent, le footer présente les différents accès présents sur la Homepage, facilitant ainsi le travail de l’internaute qui n’a pas à revenir sur la page d’accueil mais aussi maximisant le nombre de pages vues par l’internaute, améliorant de fait les taux de conversion.

les accès vers les pages d’aide : on y trouvera des liens vers le plan du site, les informations de contact, les mentions légales, les CGU (Conditions Générales d’Utilisation). Fournir ce type d’accès permettra, en contribuant à la crédibilité du site, d’améliorer les taux de conversion.

les remontées de contenus : de plus en plus de footers proposent l’accès à des contenus importants (les billets les plus commentés sur un blog, les best-sellers pour un site ecommerce…).

 

Ce type de structure est également conseillé, entre autres, par Serge Roukine, fondateur de Codeur.com, dans son livre "Améliorer ses taux de conversion web".

 

Texte original rédigé par Christophe Da Silva sur redacteur-web-freelance.com