Top Assistante - Conception Web, construire son projet web

Conception web > Index

26-Mar-2006

Étape 1 : séquencer son projet
Étape 2 : choisir ses couleurs
Étape 3 : construire son interface
Étape 4 : construire sa page d'accueil

Construire son projet web

Étape 1 : construire son interface

Une fois la structure des pages et les couleurs définies reste à constuire l'interface de votre site.

Gardez toujours présent à l'esprit la règle des 3 clics maximum pour accéder à l'information.

Pour cette étape importante, n'hésitez pas à recourir à la bonne vieille feuille et au crayon à papier.

Si vous souhaitez que votre site soit correctement répertorié, évitez les frames (un exemple de site avec frame : ) et consruisez votre site à l'aide de tableaux. De nombreux sites reprennent ce système : les Echos, Le Monde, Siemens... et ce site.

Exemple :

La page que vous avez sous les yeux est constituée d'un tableau à 2 colonnes (encadré en vert sur l'illustration ci-contre).
Deux tableaux (cf. lignes grises) de 3 colonnes chacun ont ensuite été imbriqués à l'intérieur de la 2e colonne. Le premier (en haut) sert de barre de navigation : elle permet de vous situer au niveau du site (vous êtes actuellement dans la rubrique Conception Web. Pour accéder les autres sujets sur le même thème, il vous suffit de cliquer sur Index).
Le second tableau contient le corps du document : tout d'abord à gauche un menu donnant accès aux différentes pages traitant du thème, puis les explications et enfin quelques indications ou notes.

Le logo
Essayez de placer votre logo à gauche. Un clic sur ce dernier doit ramener à la page d'accueil.

Les menus
La disposition des menus revêt une importance stratégique. Ces derniers doivent être facilement identifiables. Utilisez éventuellement des couleurs de fond pour les faire ressortir du reste de votre page.
Voici quelques exemples de disposition :

Menu placés horizontalement en haut de l'écran :
Utilisez cette disposition si vos rubriques sont peu nombreuses.
(cf. le superbe site Poésie française).
Menus placés sur la gauche
Idéal si vos menus risquent de s'allonger avec le temps : tel est le cas sur ce site où de nouvelles rubriques peuvent être facilement implémentées, la hauteur de la page pouvant être ajustée en conséquence.
Menus à gauche et en haut
Cette combinaison peut se révéler particulièrement pertinente.
Réservez le menu du haut à des accès rapides : forum/chat, favoris, accueil...
Menus en haut, à gauche et à droite
C'est une combinaison que l'on rencontre souvent sur le net.
Le piège est que le visiteur s'y perde un peu. A n'utiliser donc que pour les sites d'information où les rubriques sont particulièrement nombreuses.
Ex : Microsoft, l'Entreprise.com

Vous le voyez, vous n'avez que l'embarras du choix, aussi mûrissez bien votre décision.

Pour notre site exemple (celui sur l'Irlande), nos rubriques étant limitées, j'ai opté pour un système de menus Haut/gauche.

Vous le constaterez également, la page d'accueil bénéficie parfois d'un traitement particulier que nous allons découvrir...

Haut

Niveau

Graphisme des Sites Web***
(Micro Application )
Un ouvrage de référence, particulièrement accessible aux débutants, agréable à lire. Bref, ma bible sur le sujet.
(ouvrage actuellement épuisé mais disponible sur certains sites d'occasion).

Learn the net
(en français !)
pour tout savoir sur le net, les messageries électroniques, la création de sites. Site dédié aux débutants

Communautique :
concevoir un site
web crédible :
10 conseils pour concevoir un site "professionnel"

Les minis-guides :
Créer un site web***
A lire absolument.
En particulier pour sa rubrique "Analyser"