Réalisation du graphisme

Le but est de faire une vision « figée » de votre site. (figé car nous allons voir plus loin que pour un site multi résolution, d’autres étapes de création seront nécessaires.

Vous trouverez en bas de cette page un lien vers la rubrique de vue d’ensemble de Photoshop, si vous n’avez jamais lancé ce logiciel et que l’interface vous donne des boutons.

1) Fond du site

Tout d’abords, créer une image vide (j ai choisi 1280*1000 pour le mien). Créer un calque que vous allez nommer fond. Dans ce calque, il faut créer le fond du site, qui peut être une couleur uni, un liseré, un dégradé, une ½uvre artistique, etc… Moi j’ai choisi (bien aidé par un graphiste rencontré sur le chat IRC de Webrankinfo) un liseré de couleur suivi d’un dégradé de couleur : Tutorial créer un fond liseré

2) Insertion d’une photo en superposition du fond

Reportez vous au tutorial Effet de fondu pour apprendre a insérer l'image choisi en superposition / transparence sur le fond. Le résultat est le suivant :

3) Menu du site

Vous avez carte blanche, le tout est de faire un cadre pour le menu, de la taille / hauteur / forme que vous souhaitez. j'ai choisi la version "simple" :-)

4 ) Zone de texte

Pour pas s'embeter, le mieux est de faire un simple rectangle. ensuite tout va se jouer sur le bandeau haut, faire quelquechose de simple pour ne pas surcharger la page, et qui soit en accord avec le reste de la page au niveau des couleurs.

Voila, c’est terminé, votre maquette est prête. Nous pouvons donc commencer à créer le squelette xhtml des pages

Webmaster toulouse