COMMENT CRÉER SON PROPRE SITE WEB Version 2.12 Dernière mise à jour : 23 mai 2004 Outils Outils de base : un ordinateur, un navigateur, et un éditeur ; Il n est pas nécessaire d être connecté à Internet, ni même d avoir un modem ; Apprentissage avec un éditeur de texte : le bloc-note ; Objectifs Comprendre et apprécier le langage html ; Donner l envie d en apprendre plus sur le sujet ; Apprentissage des notions de base et des balises élémentaires ; Structuration d un site web et méthodologie ; Présentation de l information de façon claire ; Utilisation de certaines balises avancées ; Les possibilités d une page web ; Annexe : utilisation du Javascript. Références Mon e-mail : scorpio@redpulsar.com Mon site web : http://www.redpulsar.com Cours donné par David HO - page 1 - Version 2.12
PLAN DE LA MATIERE 1. Comment créer son propre site web page 1 a. Les objectifs du cours avec ses outils b. Mes références (email, site web) 2. Plan de la matière page 2 3. Les éditeurs page 3 a. Editeur de texte b. Editeur avancé c. Logiciel du type WYSIWYG 4. Ce qu il faut savoir page 3 a. Le navigateur b. L extention htm ou html c. Les commentaires d. Les balises obligatoires 5. Balises élémentaires page 4 a. Utilisation des balises modifiant du texte 6. Ouvrir l éditeur de texte page 4 a. Le bloc-notes 7. Quelques couleurs basiques page 4 a. Le code hexadécimal des couleurs basiques 8. Exercice sur les balises élémentaires page 5 9. L alignement du texte et des images page 6 10.Les listes page 6 a. Les listes numérotées b. Les listes non-numérotées c. Les élements de liste 11.Les liens page 6 a. Définition b. Schéma 12.Couleur d arrière plan et du texte page 7 13.Couleur des liens page 7 14.Utilisation des ancres page 7 15.Pour envoyer un e-mail page 7 16.Tracer une ligne horizontale page 7 17.Insertion d une image page 8 a. La syntaxe b. Les paramètres facultatifs 18.Lien sur image page 8 19.Balises en vrac modifiant du texte page 8 20.Les tableaux page 9 a. Définition b. Les lignes c. Les colonnes d. Exemples e. Remarques pour les avancés 21.Les frames page 10 a. Définition b. Fenêtre avec découpe horizontale c. Fenêtre avec découpe verticale d. Nommer les fenêtres e. Lien des fenêtres 22.Quelques conseils page 11 23.Comment mettre son site sur Internet page 12 a. Avoir une adresse email b. Etapes pour s inscrire c. Etapes pour mettre le site sur Internet 24.Solution de l exercice page 13 Cours donné par David HO - page 2 - Version 2.12
Pour créer une page web, on peut utiliser plusieurs sortes de logiciels : un éditeur de texte (bloc-notes) ; un éditeur avancé du code HTML (WebExpert). un logiciel du type WYSIWYG qui veut dire "What You See Is What You Get" (Dreamweaver, FrontPage, GoLive...) Les avantages sont que ces derniers ne demandent presque aucune connaissance en programmation HTML (au moins pour la réalisation d une page élémentaire) et permettent de facilement voir, à chaque étape, ce que l on fait, ce que l on modifie. Remarque : la plus petite faute d orthographe dans un éditeur de texte est synonyme de faute d e syntaxe dans la page web qui risquera d être mal affichée dans le navigateur. CE QU IL FAUT SAVOIR : Le code HTML est une suite d instructions qui a pour but de donner au navigateur des indications sur la lecture de balises et la visibilité de la page. Le navigateur permet de surfer sur le net et d afficher des pages web. Il existe plusieurs navigateurs aujourd hui : Microsoft Internet Explorer et Netscape sont les plus réputés. Le navigateur affiche le résultat de la page éditée à l écran. Afin que le navigateur reconnaisse la page que l on a créé, il faut absolument nommer la page en extension.htm ou.html (par exemple : "index.htm") Le langage HTML se compose exclusivement de balises. Lorsqu on ouvre une balise, on doit toujours la fermer. En effet, à chaque balise de début d une action, soit < > correspond une balise de fin d action </ >. Dans une page web, nous retrouvons toujours certaines balises : <html> <head> <title>cours de htm</title> </head> <body>a partir d ici commence réellement ce que le navigateur va afficher à l écran format HTML. </body> </html> La balise <html> sert à informer le navigateur qu il a affaire à un document de format HTML. o Attention : tout se qui est écrit après la balise </html> n est pas lue par le navigateur. Entre les balises <head> et </head> se trouvent toutes les informations sur la nature de la page. Les balises qui peuvent être insérées entre les balises <head> et </head> sont : o <title> et </title> le titre de la page web o <meta> et </meta> permet d introduire les mots-clés destinés aux robots de recherche sur les moteurs de recherche. o <script> et </script> se réfère au Javascript o <style> et </style> redéfinit certains paramètres d une page web, telle que la couleur des liens, la couleur de la barre verticale à droite Nous pouvons configurer la balise <body> et </body> en introduisant quelques paramètres : o <body bgcolor=white> la couleur du fond de la page. o <body bgcolor=#ffffff> la couleur du fond de la page. o <body background="fond.jpg"> on peut aussi placer une image comme fond. o <body text=yellow> la couleur du texte de la page web o <body link=red alink=orange vlink=blue> Nous avons la possibilité d utiliser des couleurs différentes pour les liens que le visiteur n a pas encore visité (link), c est-à-dire qu il n a jamais cliqué sur un lien; les liens déjà visités (alink) et le lien qui a été le dernier à être sélectionné (vlink). Cours donné par David HO - page 3 - Version 2.12
BALISES ELEMENTAIRES Utilisation Balise de début Balise de fin Texte GRAS <B> </B> Texte ITALIQUE <I> </I> Texte SOULIGNE <U> </U> Taille de caractère <FONT SIZE=?> </FONT> Couleur de caractère <FONT COLOR=#??????> </FONT> Passer une ligne <BR> Commentaires <!-- --> Centrer <CENTER> </CENTER> Remarque : la balise <BR> est une des s eules balise s qui ne requiert pas de balis e de fin Remarque : Pour qu un texte soit affecté d une balise, il faut que ce texte soit entouré de la balise de début et de la balise de fin. Par exemple, pour un texte en gras : Ici le texte n est pas en gras <B>Ici le texte en gras</b> Ici le texte n est pas en gras OUVRIR L EDITEUR DE TEXTE (bloc-notes) Ne pas utiliser d accents, ni d espace, ni de caractères spéciaux pour le nom du fichier! Ouvrir le bloc-notes et écrire les codes html suivants : <HTML> <HEAD><TITLE>Ma première page web</title></head> <BODY>texte simple<br> <B>texte en gras</b><br> <I>texte en italique</i><br> <B><I>texte en gras et en italique</i></b><br> <FONT SIZE=3>texte</FONT> <FONT COLOR=#0000FF>texte en bleu</font> </BODY> </HTML> Enregistrer le document avec l extension.htm, et sélectionner "tous" pour le type. QUELQUES COULEURS BASIQUES Les couleurs en HTML s expriment en codes hexadécimaux. Ils se présentent toujours avec le symbole # suivi de 6 caractères (chiffres ou lettres). Couleur désirée Code de la couleur Bleu (blue) #0000FF Vert (green) #00FF00 Blanc (white) #FFFFFF Violet (purple) #8000FF Rouge (red) #FF0000 Noir (black) #000000 Jaune (yellow) #FFFF00 Brun #990000 Rose #FF00FF Gris clair #C0C0C0 Orange #FF9900 Remarque : si l on ne veut pas mettre le c ode de la couleur, la couleur désirée doit être obligatoirement être écrite en anglai s ET en un seul mot. Remarque : la couleur en anglais peut être claire ou foncée, en anglais on ajoute le préfixe "light" ou "dark" devant le nom de la couleur (par exempl e : darkblue, lightred) Remarque : dans le code de la couleur, ce sont tous des zéros ("0") et non pas des "o" minuscules ou "O" majuscule. Cours donné par David HO - page 4 - Version 2.12
EXERCICE Réaliser votre première page intitulée "Ma première page web" en y indiquant un certain nombre d informations élémentaires, et en utilisant toutes les balises apprises jusqu à maintenant (voir la page 3). Voici quelques idées pour le contenu de votre page web: Nom Prénom Age Date de naissance Lieu de naissance Adresse Mon école Mon sport favori Mes loisirs Mes animaux de compagnie Mon chanteur ou chanteuse préféré(e) Mon acteur ou actrice préféré(e) Mon email Mes hobbies La ville (le pays) où je suis né Mon film préféré Mes qualités et mes défauts Mes dernières vacances à Mes projets de vacances Ce que j aime Ce que je déteste Durant mes temps de loisirs, je Etc Voici un petit aperçu de ce que l on pourrait obtenir : David HO Texte en gras et de taille 5 Je suis né à Bruxelles Texte en italique et de couleur rouge J habite à Jette Texte en italique et de couleur rouge Et j ai 21 ans Texte normal de couleur rouge (passer une ligne) (passer une ligne) Mes hobbies sont : Texte souligné et en gras Être devant mon ordinateur Texte de couleur bleue Aller au cinéma Texte de couleur bleue Sortir avec mes copains Texte de couleur bleue (passer une ligne) J aime écouter de la techno Texte normal Je n aime pas faire la vaisselle Texte normal Remarque : ne pas oublier de "passer une ligne " après chaque information en utilis ant la balise <BR>. Solution : voir page 13 Cours donné par David HO - page 5 - Version 2.12
L ALIGNEMENT Pour aligner du texte ou une image, nous pouvons utiliser la balise <DIV> et </DIV>. Utilisation Balise de début Balise de fin Aligner à gauche de la page <DIV align=left> </DIV> Aligner au milieu de la page <DIV align=center> </DIV> Aligner à droite de la page <DIV align=right> </DIV> Remarque : la balise <DIV align=center> a le même résultat que la balise <CENTER>. LES LISTES Utilisation Balise de début Balise de fin Liste numérotée <OL> </OL> Liste non-numérotée <UL> </UL> Elément de liste <LI> </LI> Paragraphe <P> </P> La balise <LI> doit être insérée entre une balise <OL> et </OL>, ou une balise <UL> et </UL>. La balise <P> permet d aller à la ligne ET de passer une ligne. Voici un exemple de liste numérotée : <OL>Chapître <LI>Les animaux <LI>Les humains <LI>Conclusion </OL> LES LIENS <A HREF="fichiercible.htm">mot-hyper-lien</A> mot-hyper-lien = un ou des mots de la page qui seront soulignés et mis dans une couleur spécifique (par défaut c est le bleu). Lorsqu on amène le curseur sur ce(s) mot(s), ce curseur prend la forme d une main ; si l on clique sur ce(s) mot(s), l ordinateur va automatiquement afficher le fichier "fichiercible.htm" dans le navigateur. Remarque : le fichier "fichiercible.htm" doit avoir été créé auparavant. Le fichier index.htm <A HREF="hobbies/htm"> Mes hobbies</a> Le résultat affiché dans le navigateur Mes hobbies Le fichier hobbies.htm Le résultat affiché dans le navigateur - Mon ordinateur - Mon ordinateur - Aller au cinéma - Aller au cinéma Logiquement à la fin de ce fichier, on doit trouver un lien permettant de retourner à la page principale : <A HREF="index.htm"> RETOUR A LA PAGE INDEX</A> RETOUR A LA PAGE INDEX Cours donné par David HO - page 6 - Version 2.12
COULEUR D ARRIERE PLAN ET DU TEXTE <BODY BGCOLOR=#??????> au lieu d utiliser un code hexadécimal, on peut donner le nom d une couleur (en anglais bien entendu). Par exemple : <BODY BGCOLOR=gold> <BODY BACKGROUND="image.jpg"> on peut utiliser une image qui sera le fond de la page web ; ne pas oublier les guillemets ici. <BODY TEXT=red> tous les textes dans la page seront de couleur rouge ; mais la balise <FONT COLOR=blue> dans la même page, a priorité. <BODY BGCOLOR=green TEXT=green> tout à fait correct mais le texte sera invisible. COULEUR DES LIENS A déterminer avec la balise BODY. <BODY LINK=blue VLINK= green ALINK=black> LINK= couleur de lien VLINK= lien visité ALINK= lien actif Mais attention, les paramètres définis au niveau du navigateur peuvent être différents et avoir la priorité. Le tout est de ne jamais avoir une couleur d un texte identique à la couleur de fond d écran. UTILISATION DES ANCRES Sur la même page : Pour créer un lien et appeler vers une cible <A HREF="#nomdelacible">aller à la cible</a> et plus loin dans la page (ou avant) <A NAME="nomdelacible">Voici la cible</a> Remarque : Ces balises s utilisent lorsque l on a une page web qui fait 6000 lignes de texte par exemple. POUR ENVOYER UN E-MAIL Pour que les visiteurs puissent vous envoyer un e- mail à partir de votre page : <A HREF=" mailto:mon_adresse_email@yahoo.com">nom du destinataire</a> TRACER UNE LIGNE HORIZONTALE <HR color=red size=2 align=center width=100%></hr> Remarque: cette balis e a le même résultat que l exemple n 1. Exemple n 1 : <HR></HR> les paramètres utilisés sont les valeurs par défaut) Exemple n 2 : <HR color=blue size=15 align=left width=30%></hr> Cours donné par David HO - page 7 - Version 2.12
INSERTION D UNE IMAGE <IMG SRC="photodeclasse.jpg"> affiche l image qui se trouve à l adresse entre guillemets. Les paramètres facultatifs sont : alt=" " Affiche un texte lorsqu on laisse le curseur de la souris sur l image width=? Largeur de l image (en pixels) height=? Hauteur de l image (en pixels) border=? Crée une bordure autour de l image (en pixels) align=top Alignement de l image par rapport au texte de la page web (haut) align=middle " (milieu) align=bottom " (bas) align=left " (gauche) align=right " (droite) Voici un exemple : <IMG SRC="vacances.jpg" width=300 height=150 border=1 align=left> Remarque : si vous voulez que l image soit affichée à sa taille réelle, il suffit d enlever les paramètres width et height. Remarque : la balise <IMG> est une des seules balises qui ne requiert pas de balise de fin. LIEN SUR IMAGE <A HREF="fichiercible.htm"><IMG SRC="image.jpg"></A> Remarquons ici que les images cliquables sont entourées d une bordure de la couleur de LINK. On peut bien sûr combiner un texte avec son image comme lien. Par exemple : <A HREF="photosvacances.htm"> Voici mes photos de vacances<br> <IMG SRC="photo.jpg"></A> A vous de décider maintenant quels seront les textes ou/et les images à mettre un lien vers d autres pages. BALISES EN VRAC La balise <PRE> et </PRE> affiche un texte dit pré-formaté. Le navigateur prend ainsi en compte tous les espaces et les sauts de lignes définis dans l éditeur (bloc-notes). La balise <STRIKE> et </STRIKE> permet de barrer un texte. Les balises o <H1> et </H1> affiche un texte dans sa plus grande taille ; o <H2> et </H2> affiche un texte de grande taille ; o <H3> et </H3> affiche un texte de taille moyenne ; o <H4> et </H4> affiche un texte de taille normale ; o <H5> et </H5> affiche un texte de petite taille ; o <H6> et </H6> affiche un texte dans sa plus petite taille ; ont le même résultat que la balise <FONT SIZE=?> et </FONT>. La balise <SUB> et </SUB> affiche un texte en indice (par exemple : ceci est en indice). La balise <SUP> et </SUP> affiche un texte en exposant (par exemple : en exposant ). ceci est Cours donné par David HO - page 8 - Version 2.12
LES TABLEAUX Voici un exemple d affichage d un tableau dans le navigateur : HORAIRE Lundi Mardi Mercredi Jeudi Vendredi 8h30-9h30 Français Math Informatique Néerlandais Français 9h30-10h30 Français Géographie Musique Anglais Sciences Etc Remarque : Un tableau est composé de plusieurs lignes et plusieurs colonnes, chaque ligne ou chaque colonne est composée de plusieurs cellules. Ainsi, la 3 ème ligne de la colonne "Mardi" nous indique "Géographie". Pour créer un tableau simple, voici les balises à mettre d office : <TABLE> <TR> <TD></TD> </TR> </TABLE> Explications : <TABLE> et </TABLE> pour créer un tableau. <TR> et </TR> pour créer une ligne. <TD> et </TD> pour créer une colonne. Les paramètres facultatifs de la balise <TABLE> et </TABLE> sont : border=? Crée une bordure autour du tableau avec une certaine épaisseur. cellspacing=? Défini l épaisseur du quadrillage intérieur. cellpadding=? Défini la distance entre le texte de chaque cellule et le cadre de la cellule. width=?% Défini la largeur du tableau par rapport à l écran, en pourcentage. bgcolor=#?????? Défini la couleur de fond du tableau. Les paramètres facultatifs de la balise <TD> et </TD> sont : width=?% Défini la largeur de la cellule par rapport à la largeur du tableau. bgcolor=#?????? Défini la couleur de fond de la cellule. Voici un exemple : <TABLE bgcolor=gold border=2 cellspacing=4 cellpadding=8 width=82%> <TR> <TD bgcolor=red width=18%>horaire</td> <TD width=12%>lundi</td> <TD width=12%>mardi</td> <TD width=12%>mercredi</td> <TD width=12%>jeudi</td> <TD width=12%>vendredi</td> </TR> </TABLE> Remarque pour les avancés : La somme des % des collules d une rangée ne peut pas dépasser le % de la largeur du tableau (sinon la largeur des cellules est ignorée). Les % des largeurs des cellules sont calculés proportionnellement à la largeur du tableau. Ainsi, <TD width=20%>aaa</td><td width=10%>bbb</td><td width=10%>ccc</td> et <TD width=2%>aaa</td><td width=1%>bbb</td><td width=1%>ccc</td> donneront le même affichage. Cours donné par David HO - page 9 - Version 2.12
LES FRAMES C est le découpage de l écran en plusieurs parties : des fenêtres horizontales (en lignes) ou verticales (en colonnes). L utilisation la plus courante est de placer le menu dans une fenêtre à gauche sur ¼ de la largeur de l écran et les contenus dans une fenêtre à droite sur les ¾ restants de l écran. Cela donne approximativement ceci : MENU PRINCIPAL Bienvenue sur mon site web!! Lien n 1 Lien n 2 Blablabla Lien n 3 Retour à la page principale Attention, la balise <FRAMESET> et </FRAMESET> remplace <BODY> et </BODY> <html> <head><title>titre de la page</title></head> <frameset cols="30%,70%"> <frame src="gauche.htm" name="gauche"> <frame src="droite.htm" name="droite"> </frameset> </html> Remarque : la balise <FRAME> est une des seules balise s qui ne requiert pas de balise de fin. <FRAMESET ROWS="15%,75%,10%"></FRAMESET> découpe l écran en 3 bandes horizontales selon les valeurs indiquées. Cela donne approximativement ceci : menu.htm index.htm bas.htm <FRAMESET COLS="25%,75%"></FRAMESET> découpe l écran en 2 bandes verticales selon les valeurs indiquées. Cela donne approximativement ceci : menu.htm index.htm Nommer les fenêtres : Pour pouvoir circuler d une fenêtre à l autre, il est nécessaire de donner un nom à chaque fenêtre (attention, ce n est pas le nom du fichier). Exemple : <FRAME SRC="gauche.htm" NAME="gauche"> <FRAME SRC="droite.htm" NAME="droite"> dans la première fenêtre qui fait 25%, j insère "gauche.htm" et j appelle cette fenêtre "gauche" ; et même technique pour la seconde fenêtre. Lien des fenêtres : Maintenant, lorsque je crée un lien, je décide de l envoyer dans la fenêtre de gauche ou de droite. Exemple : <A HREF="droite.htm" TARGET="droite">photos de mes vacances</a> commande à placer évidemment dans le fichier "gauche.htm" ; quand je clique sur le mot lien "photos de mes vacances", je provoque l affichage de "droite.htm" dans la fenêtre de droite. Cours donné par David HO - page 10 - Version 2.12
QUELQUES CONSEILS 1. Bien vérifier s il n a pas de fautes d orthographe : il n y a rien de pire à un lecteur que de lire un texte bourré de fautes d orthographe. 2. Est-ce que toutes les images sont-elles présentes dans mes pages web? 3. Est-ce que tous mes liens fonctionnent-ils? 4. Eviter de mettre trop d information dans la même page, et créer plusieurs pages pour distinguer les catégories différentes du sujet. 5. Prévoir dans chaque page un lien vers la page d accueil ou la page d index. 6. Mettre un titre à chaque page web. 7. Ne pas exagérer la taille des images : limiter la taille des images. 8. Ne pas jouer avec trop de couleurs différentes : 3 ou 4 couleurs différentes suffisent dans une seule page web. 9. Les informations décrites sur votre page web sont-elles correctes? 10. Est-ce que le titre résume t-il bien le contenu de vos pages? 11. Ne jamais mettre d accent, ni de caractères spéciaux, ni d espaces dans le nom d un fichier d une page web. 12. Enfin, soignez vos pages web pour qu elles donnent l envie aux visiteurs intéressés d aller plus loin dans votre site. Cours donné par David HO - page 11 - Version 2.12
COMMENT METTRE SON SITE SUR INTERNET Avant toute chose, avoir une adresse email (si vous n en avez pas, créez en une : par http://www.hotmail.com par exemple). Etapes pour s'inscrire (une seule fois à faire) : Aller sur http://www.multimania.lycos.fr Cliquer sur [s'inscrire] Cliquer sur [accepter] Choisir un identifiant : votre nom ou surnom... (Attention, ne pas mettre d'accents, ni d'espace, ni de caractères spéciaux) Choisir un mot de passe (Attention aux majuscules et aux minuscules) Introduisez votre email Compléter le reste du formulaire à votre guise (Vous n'êtes pas obligé de mettre vos vraies coordonnées, ni de vraies infos) Puis cliquer sur [s'inscrire] Si l on vous dis que votre identifiant est incorrect, veuillez choisir un autre (par exemple, ajoutez un chiffre après votre nom ou surnom) Si votre identifiant et votre mot de passe sont valides, veuillez noter l'identifiant et le mot de passe sur une feuille de papier (ne le perdez pas) Ensuite vous recevrez automatiquement un email de confirmation (allez vérifier votre email pour ouvrir l email de confirmation) ; il y a un lien, cliquez-le une seule fois Une nouvelle fenêtre va apparaître, entrez votre mot de passe 2 fois, ensuite cliquez sur [Valider] Votre page web sera désormais : http://membres.lycos.fr/identifiant Etapes pour mettre votre site sur Internet (upload): Aller sur http://www.multimania.lycos.fr Cliquer sur [Mon compte] Introduire votre identifiant et votre mot de passe, ensuite cliquer sur [Valider] Cliquer sur [WebFTP] (à droite de la page), une nouvelle fenêtre va apparaître : c'est le contenu de votre site Si c'est la première fois que vous accédez à cette page (sinon passez cette étape) : o o il y a normalement un fichier qui se nomme [index.html], cliquez une seule fois dessus pour qu'il devienne de couleur orange, et cliquez sur [Supprimer]. En effet, ce fichier n est pas à vous. Vous devez l effacer, attention pour la suite : ne pas effacer index.htm!! o cliquez [ok] pour la confirmation Ensuite, cliquez sur [Charger], cliquez sur [Parcourir] et choisissez le fichier que vous voulez mettre sur Internet, et recommencez cette étape à chaque fichier différent jusqu à ce que tous vos fichiers soient affichés dans la fenêtre. Aller tout en bas pour cliquer sur [Charger] Attendre (Ca peut prendre un certain temps, il faut être patient) Voilà, normalement la page affiche tous les fichiers que vous avez déjà mis sur Internet C'est fini, vous pouvez enfin montrer votre site à vos amis et à vos parents!! Cours donné par David HO - page 12 - Version 2.12
SOLUTION DE L EXERCICE Bien essayé, mais je ne te donne pas la solution avant que tu n aies pas essayé d abord. Voici quelques autres aides si tu ne t en sors pas : Regarde dans la page 3, quelles sont d abord les "balises" que tu dois toujours mettre dans une page web. Ensuite tape ton texte, puis selon que tu veuilles le mettre en gras, souligné tu l appliques avec les "balises élémentaires" en page 4. Un exemple avec chaque balise différente est donné à la page 4 "Ouvrir l éditeur de texte". Pour les couleurs, tu peux soit mettre la couleur désirée en anglais (mais tu dois la connaître), soit tu mets la couleur correspondante au code hexadécimal (voir page 4 "Quelques couleurs basiques"). Cours donné par David HO - page 13 - Version 2.12
SOLUTION DE L EXERCICE <html> <head> <title>titre</title> </head> <body> <font size=5><b>david HO</b></font><br> <font color=red><i>je suis né à Bruxelles</i></font><br> <font color=red><i>j'habite à Jette</i></font><br> <font color=red>et j'ai 21 ans</font><br> <br> <b><u>mes hobbies sont :</u></b><br> <font color=blue>etre devant mon ordinateur</font><br> <font color=blue>aller au cinéma</font><br> <font color=blue>sortir avec mes copains</font><br> <br> J'aime écouter de la techno<br> Je n'aime pas faire la vaisselle<br> </body> </html> Cours donné par David HO - page 14 - Version 2.12