La toute première chose à savoir est que les balises de titres sont de types "block" (si vous ne vous rappelez plus de ce que signifie ce type, allez faire un petit tour ici). Les titres ont des propriétés stylistiques pré-définies. Entrons directement dans le sujet, un titre en html est défini par les balises <h1>. Il en existe 6, elles s'écrivent donc de <h1> à <h6>. En fait, les chiffres correspondent à l'importance du titre, en effet le titre <h1> sera très important, puis jusqu'à <h6> qui sera bien évidemment le moins important. On parle de titre de plus haut niveau pour <h1>.

Vous voulez écrire du texte ?
Bon, c'est très simple, il vous suffit de l'écrire dans des paragraphes, et pour cela rien de bien compliqué, il suffit de l'écrire entre les balises <p> et </p>, <p> comme paragraphe, balises de type "block" également, mais vous l'aurez deviné.

En HTML, si vous appuyez sur la touche entrée, ça ne va pas créer une nouvelle ligne. Donc, vous avez juste besoin de créer un nouveau paragraphe. Vous aurez donc dans votre page web, tout plein de balises paragraphe, globalement, dès que vous aurez du texte à écrire.

Bon, eh bien là, on va voir les balises qui permettent de mettre en italique ou en gras :
- en italique : il faut juste entourer ce que vous voulez mettre en italique par <em> et </em>.

- en gras : vous devez entourer ce que vous voulez mettre en gras par <strong> et </strong>.

Sachez quand même que <b> </b> marche aussi pour mettre en gras, ainsi que <i> </i> pour mettre en italique. Mais je n'utiliserai que <strong></strong> et <em></em>.

Alors là, on rentre dans une partie un peu plus délicate, en effet, pour placer des blocs, il n'y a pas de solution "directe", il faut pour cela passer par des frames (je ne suis pas fan de cette méthode, je ne la trouve pas très esthétique bien que beaucoup plus simple que la suivante). La seconde méthode, celle qui est un peu plus complexe, consiste à utiliser la balise <table> </table>. Cette balise sert normalement à créer des tableaux, au passage, cette balise est de type "block" et marche par paire, donc comme je disais elle sert à créer des tableaux, et nous nous en serviront pour créer des blocs.

Nous allons commencer par voir la méthode des tables car c'est celle que vous utiliserez probablement le plus souvent.

Pour commencer, je vais vous montrer un exemple de ce que peut donner une structure de page web créée avec des tableaux, cela vous permettra de mieux visualiser par la suite.

Voilà cette structure n'a été réalisé qu'avec l'aide de tableaux.

Maintenant, je vais vous montrer le code, et le commenter pour expliquer comment réalisé ce genre de structure.

Premièrement, un tableau s'ouvre avec la balise <table>. Ensuite on remarque une balise <tr> puis une balise <td>. A noter que toutes ces balises marchent pas paire.

- tr : Tout simplement cette balise permet de créer une nouvelle ligne dans un tableau.
- td : Cette balise permet quant à elle de créer une nouvelle colonne.

Il existe une autre balise , qui a à peu près le même but que <td>, cette balise est <th>. On l'utilisera principalement pour mettre des titres aux colonnes d'un tableau, elle nous sert donc pas pour le positionnement des blocs.

Alors en ce qui concerne la construction de l'exemple, on remarque la création de 3 tableaux.

• le premier tableau nommé "header" pour l'exemple, est constitué d'une ligne et d'une colonne, on remarquera les attributs width et height qui permettent de définir respectivement la longueur et la hauteur de la ligne et de la colonne.

• le second tableau est composé de deux blocs, "menu" et "corps", là encore il n'y a qu'une seule ligne ( <tr> n'est ouvert qu'une fois ), en revanche il y a 2 colonnes matérialisées pasr les 2 balises td. Si nous avions voulu rajouté un menu à droite par exemple, nous aurions du rajouté un td supplémentaire, tout en faisant attention aux longueurs dans un souci esthétique. (le mieux étant de changer par vous même les bouts de code que je vous donne pour pouvoir mieux comprendre le code et l'utilisation des balises).

• le troisième tableau, appelé "footer" est construit de la même manière que le premier.

Comment ça vous ne voyez pas comment faire pour avoir un menu à droite ? Bon allez je vous montre le bout de code.

Sinon, 2-3 petites choses un peu plus générales :

• <center> : cette balise permet de centrer le texte dans le bloc, on peut également centrer un tableau, une image etc ...

• l'élément background-color : euh ... tout simplement permet de mettre une couleur de fond aux blocs (jaune, vert, bleu ... comme dans l'exemple, les couleurs peuvent être défini de 3 manières :
- Par leur nom (en anglais bien sûr) : black, white, yellow ...
- Par la notation hexadecimal (ex #FFFFFF) : 6 lettres ou chiffres allant de 0 à 9 et de A à F.
- Par la méthode RGB (rrr vvv bbb) : chiffres allant de 0 à 255 par exemple 100 000 255.

Puisque je vous ai présentés la méthode de positionnement de blocs grâce aux tableaux, je vais quand même vous montrez une exemple de tableau (c'est tout de même pour ça qu'elle a été créée), avec toujours cette même balise table.

Nom	Age
Paul	35
Pierre	28

<table> <tr> <!--on cré une ligne --> <th> Nom </th> <!--on cré une 1ère colonne avec un titre --> <th> Age </th> <!--on cré une 2ème colonne avec un titre --> </tr> <tr> <!-- nouvelle ligne --> <td> Paul </td> <td> 35 </td> <tr> <tr> <!-- nouvelle ligne --> <td> Pierre </td> <td> 28 </td> <tr> <table>

Il existe tout un tas de propriétés comme par exemple mettre une bordure, mettre un mot de telle couleur, le fond de telle couleur, telle taille de police etc... Une multitude de sites propose des listes de toutes ces propriétés.

Les frames sont la deuxième méthode pour positionner des blocs, elle est bien moins compliqué mais aussi bien moins jolie, mon choix est fait mais je présente quand même cette méthode, à vous de vous faire votre propre choix.

Il y a deux balises nécessaires à la création des frames :

• <frameset> : Elle remplace la balise <body>, c'est elle qui va définir les cadres, verticaux ou horizontaux, et leurs dimensions (en px ou en %). Pour créer des cadres horizontaux on utilisera l'attribut cols, pour les cadres verticaux, on utilisera l'attribut rows.

• <frame /> : C'est dans cette balise que l'on défini les zones.

Vous allez mieux comprendre avec l'exemple :

Ici, on a défini deux cadres horizontaux appelés zone1 et zone2.

Vous pouvez, si vous le voulez imbriquer les <frameset> pour créer des cades horizontaux et verticaux.

Les frames permettent donc d'inclure des pages html dans les cadres, dans la zone1 on inclus "zone1.html" et dans la zone2, "zone2.html". Pour faire un lien de la zone1 vers la zone2, il faut connaitre un attribut target qui se trouvera dans la baslie <a> :

On a donc notre zone1.html dans la zone1, et on veut faire un lien vers zone2.html, qui s'affichera dans la zone2, c'est grâce à l'attribut target qu'on indique dans quel zone va s'afficher le lien.

voilà je vous ai montré cette méthode mais je ne suis pas fan, à vous de vous faire votre propre opinion.