Les bases du Webdesign : la pla­ni­fi­ca­tion

L’étape fon­da­men­tale de l’éla­bo­ra­tion d’un site Web commence par la pla­ni­fi­ca­tion de votre projet. Mieux le projet sera défini, plus sa mise en place sera sim­pli­fiée par la suite. Ce cadrage initial est la condition sine qua non de votre réussite, que ce soit pour dé­ve­lop­per un site Web pour un client, votre en­tre­prise, ou encore pour vous-même.

C’est pourquoi il est re­com­mandé de prévoir assez de temps en amont pour la phase de con­cep­tua­li­sa­tion et de pla­ni­fi­ca­tion de votre site Web. Pour définir une structure adaptée à votre présence sur Internet, voici quelques conseils qui sauront vous guider au cours du dé­ve­lop­pe­ment de votre projet.

Avant de songer à la mise en page de votre site, demandez-vous tout d’abord quel est l’objectif que vous voulez atteindre grâce à votre site Web. C’est la dé­fi­ni­tion de cet objectif qui cons­ti­tuera le pilier de base du processus de travail à venir. En effet, chaque élément présent sur votre page d’accueil devra être en adé­qua­tion avec ce but. Demandez-vous à quoi votre site Web doit con­tri­buer et quelle sera sa fonc­tion­na­lité. Voulez-vous améliorer la po­pu­la­rité de son contenu ? En faire la promotion ? Ou encore informer ? Si votre site Web est par exemple implanté dans le domaine du e-commerce, l’objectif sera d’acquérir de nouveaux clients ou prospects et d’augmenter les ventes de vos produits. En règle générale, la présence sur le Web d’une en­tre­prise ou d’une ins­ti­tu­tion cor­res­pond à sa carte de visite, à l’image qu’elle véhicule. Quel que soit le but que vous désirez atteindre, gardez en mémoire que la pla­ni­fi­ca­tion de votre site Web jalonnera la suite de tout votre parcours.

Le groupe cible de votre site et ses attentes

Quelle est la cible de votre site Web ? Dé­fi­nis­sez-la tout en gardant vos objectifs en mémoire. Si vous désirez pro­mou­voir ou vendre un produit ou un service, adaptez le contenu et la mise en page à votre cible. De même s’il s’agit d’un portail d’in­for­ma­tions ou encore d’un forum thématisé. Que le site soit com­mer­cial ou in­for­ma­tif, tout ad­mi­nis­tra­teur de site Web doit savoir à qui il s’adresse pour que son site concorde avec les besoins de ses uti­li­sa­teurs. 

Dans de nombreux domaines, des standards ont été établis con­cer­nant le contenu et la pré­sen­ta­tion en fonction de la cible. Ainsi, on trouve par exemple ré­gu­liè­re­ment des outils de tri et de recherche de produits sur les sites d’achats en ligne afin de faciliter la na­vi­ga­tion des uti­li­sa­teurs. Chaque secteur d’activité et chaque cible se ca­rac­té­rise par des par­ti­cu­la­ri­tés qui lui sont propres. Le contenu et la pré­sen­ta­tion de votre site Web doivent être in­fluen­cés par ces facteurs. Il est important de connaître et de cerner ces par­ti­cu­la­ri­tés, même si votre site a pour ambition de se démarquer de la con­cur­rence et des con­ven­tions.

La struc­tu­ra­tion du plan du site

Cette étape consiste à élaborer la structure du site en créant un sitemap. Le sitemap, ou encore plan de site en français, est une re­pré­sen­ta­tion de l’ar­chi­tec­ture du site qui organise les rubriques et les liens entre les dif­fé­rentes pages.

Faites un ébauche de l’ar­bo­res­cence de votre site Web pendant sa pla­ni­fi­ca­tion, que ce soit sur votre or­di­na­teur ou di­rec­te­ment sur une feuille de papier. Cela vous permet non seulement d’organiser le contenu mais aussi la na­vi­ga­tion sur le site. Le plan du site vous permet également de définir vers quelle page mène tel ou tel lien. Classez chaque page en fonction de son im­por­tance et dressez une courte des­crip­tion du contenu prévu. Bien entendu, la struc­tu­ra­tion des pages doit rester claire et une rubrique ne doit pas comporter trop de sous-rubriques.

La maquette et la pré­sen­ta­tion du site Web

L’éla­bo­ra­tion de la mise en page est liée étroi­te­ment à celle du plan du site. L’ébauche de la mise en page est une étape à planifier avec soin : elle ne sert pas à définir le design final de votre site Web mais plutôt à agencer le contenu sur les dif­fé­rentes pages. Il s’agit par exemple de décider où vous placerez le logo de votre en­tre­prise, un menu déroulant ou encore dif­fé­rents onglets. Les autres aspects de la mise en page de votre site Web dépendent du type de contenu proposé, comme par exemple :

• la pos­si­bi­lité pour les visiteurs de laisser des com­men­taires

• l’ajout de boutons de partage vers les réseaux sociaux, pour que les uti­li­sa­teurs puissent laisser une mention « j’aime » et partager votre contenu

• Liens d’af­fi­lia­tion vers les en­tre­prises par­te­naires dont vous faites la promotion

Demandez-vous également si vous voulez optimiser votre site web pour dif­fé­rents supports (mobiles, tablettes, or­di­na­teurs…). Il est en général in­té­res­sant d’optimiser son site web pour rendre l’ex­pé­rience de na­vi­ga­tion plus agréable pour les uti­li­sa­teurs (mobile friendly) et augmenter le trafic sur votre site. Pour cela, il est souvent né­ces­saire de réor­don­ner les com­po­sants de votre page.

Créer un site Internet n’est plus l’apanage des pro­fes­sion­nels, notamment depuis l’émergence des CMS en ligne (Content Ma­na­ge­ment System) soit un système de gestion de contenu en français (ou encore éditeurs de sites en ligne). Plus besoin de savoir coder pour ad­mi­nis­trer ou gérer un site Web : dans la majorité des cas, les novices en Web design et en pro­gram­ma­tion optent pour un éditeur de site en ligne. L’éditeur de site en ligne permet de créer des pages et de modifier leur contenu, de le struc­tu­rer sans avoir besoin de disposer de con­nais­sances tech­niques poussées. Demandez-vous tout d’abord quelles fonc­tion­na­li­tés vous désirez mettre en place pour votre site Web, car elles varient gran­de­ment en fonction des dif­fé­rents pres­ta­taires. Bien souvent, l’éditeur de site en ligne se révèle assez limité lorsque l’on veut ajouter des fonc­tion­na­li­tés par­ti­cu­lières, mais il est souvent possible de les compléter par des ex­ten­sions payantes. Il existe également des CMS gratuits pour créer des sites Web, cependant leurs fonc­tion­na­li­tés sont souvent res­treintes et plutôt adaptées aux par­ti­cu­liers qui ont besoin d’un site Web mi­ni­ma­liste. Si vous souhaitez dé­ve­lop­per un site pro­fes­sion­nel et complexe, il est in­dis­pen­sable de maîtriser des langages de pro­gram­ma­tion comme HTML et CSS. Vous bé­né­fi­cie­rez alors d’une large palette d’outils et de fonc­tion­na­li­tés. Néanmoins, un peu de temps et d’ex­pé­rience vous seront né­ces­saires pour obtenir un résultat im­pec­cable et pro­fes­sion­nel. De plus, la main­te­nance et l’ac­tua­li­sa­tion des contenus est plus complexe qu’avec un CMS. Vous avez également la pos­si­bi­lité de faire appel à un pro­fes­sion­nel ou à une agence pour faire dé­ve­lop­per votre site Web. Là aussi, La phase de con­cep­tion con­di­tionne le processus de création et le résultat final de votre site. Il est donc essentiel de vous fixer au préalable les objectifs que vous voulez atteindre et d’établir un cahier des charges précis pour la personne où l’agence à laquelle vous confiez votre projet.

Dès lors que avez défini quel contenu proposer, que la structure de votre site vous parait claire et que vous savez à qui confier son dé­ve­lop­pe­ment, il est temps d’établir le ca­len­drier. Pour les projets de grande envergure, n’hésitez pas à frag­men­ter le ca­len­drier en dif­fé­rentes étapes. Par exemple, en com­men­çant par la rédaction de textes de contenu, puis par la mise en place du design. Ce tableau de bord peut revêtir plusieurs formes et sa main­te­nance évoluera au cours de votre projet, mais n’oubliez pas de toujours prévoir assez de temps en cas d’imprévus.

Une fois ces étapes franchies, la structure de votre site Web sera définie dans les grandes lignes. Mais il vous reste encore à peaufiner de nombreux aspects suite à la pla­ni­fi­ca­tion de votre site Web.

Découvrez dans les rubriques suivantes les autres standards à respecter en Webdesign, notamment comment créer une page d’accueil con­vi­viale (user-friendly) et les normes à observer pour l’uti­li­sa­tion de logos et de couleurs en web design.