ARTICLES - TRUCS ET ASTUCES
Créer son site web, partie 3
Publier le 03/07/2009 par Web-Argent-Facile
Nous allon attaquer une partie un peu plus difficile, c’est la que nous allons voir comment insérer des liens, des images, des framset, des tableaux. Soyez attentif, une seul lettre ou caractère spéciale en plus dans le code fait planter la formule, soyez précis losque vous créer des formules.
Les Images
- Pour améliorer votre site il est indispensable d’y faire apparaitre des images (mais pas trop), pour afficher une image au milieu de votre texte c’est très simple, il suffit d’insérer la ligne suivante :
<img src=\"nom du fichier\">.
Si cette ligne est particulièrement simple, il est néanmoins important d’y ajouter deux paramètres pour optimiser l’affichage dans le navigateur :
la hauteur et la largeur, ce qui donne finalement :
<img src=\"nom du fichier\" height=\"hauteur\" width=\"largeur\" >.
Les Tableaux
- C’est maintenant que ça se gate, lorsque vous souhaitez avoir une mise en page un peu sympa, le mieux c’est d’utiliser des tableaux.
Un petit exemple:
<table width=\"80%\">
<tr>
<td valign=top>
cell 1
</td>
<td align=center>
cell 2
</td>
</tr>
</table>
ce qui donne :
Explications : le tag table permet de débuter un tableau, tr une ligne et td une cellule. Les attributs intéressants sont width pour table et td pour donner la largeur du tableau par rapport à la page ou de la cellule dans la ligne.
border permet de spécifier la bordure des cellules, par défaut il n’y en a pas ( i.e: border=0 ).
valign et align permettent de gérer l’alignement vertical et horizontal.
l’attributs colspan specifie que la cellule aura la largeur de deux cellules des autres lignes. ( rowspan s’utilise de la même manière pour les colonnes )
Les Framset
- Les framesets permettent de diviser une page en plusieurs parties, pour ensuite insérer dans chaque partie une page à part entière.
Exemple :
<frameset cols=\"100,*\">
<frame name=menu src=\"menu.html\">
<frame name=princ src=\"princ.html\">
</frameset>
Dans un fichier ( généralement index.html ), on met le code ci dessus. Cela permettra de séparer la page avec une colonne de 100 pixels à gauche et le reste a droite. A gauche figure le contenu du fichier menu.html, à droite princ.html.
Chaque frame a un nom, ce qui permet lorsque vous faites un lien d’afficher le résultat dans la frame ad hoc ( voir section suivante ).
Pour séparer la page dans la hauteur, utilisez l’attribut rows à la place de cols
Les liens
- L’une des particularités d’un document web est de pouvoir cliquer sur une partie de texte ou une image et d’être renvoyé vers une autre page, c’est un lien.
Pour cela il suffit d’encadrer le texte ou l’image avec le tag a:
<a href=page_suivante.html>vers la page suivante</a>
Un attribut utile est target, il permet de spécifier ou la page pointée sera affichée, ex: target=princ affichera le résultat du lien dans la frame ou la fenêtre princ.
Attention si vous voulez faire un lien vers un autre site n’oubliez pas de mettre l’addresse complète, c’est à dire précédée de http:// , ex: <a href=http://www.salemioche.net>créer son site web</a>.