Avant de réaliser une page web ou un modèle de page, il est préférable de passer par une étape de création graphique, surtout si vous souhaiter obtenir un résultat professionnel.
La page est donc dessinée et on obtient ainsi une interface graphique qui représente la future page web.
La création d’un modèle de page web se réalise de la manière suivant :
- La page HTML est crée en utilisant un logiciel professionnel ou simplement dans un éditeur de texte. Il s’agit de mettre en place les blocs principaux : cadre haut, centre et bas de page.
- La découpe de l’interface commence par le fond de page généralement. Le fond est alors coupé puis optimisé et enregistré au bon format graphique.
- Après enregistrement dans un dossier d’image, il sera inséré directement dans la page HTML. L’image pourra également être utilisée en combinaison d’un style CSS pour plus de précision.
Chaque élément graphique suit ainsi le même procédé. L’objectif consiste à découper l’interface graphique afin de minimiser le poids graphique d’un page. Il faut donc privilégier la découpe en éléments répétitifs et utiliser le code HTML et CSS pour la continuité. Le travail de découpe, optimisation et conception d’une page HTML peu ainsi durer plusieurs heures.
Voici un exemple de découpe, optimisation et montage HTML et CSS. Le travail une fois réalisé permet de gagner sensiblement en vitesse d’affichage.

L'exemple présente le fond de ciel de notre site optimisé, puis coupé en tranche de 1 pixel de largeur et monté en HTML pour obtenir une continuité. Ensuite nous avons superposé un visuel auquel le fond de dégradé est supprimé pour gagner en légèrté.
|