Vous voici arriver sur la page principale du site. C'est ici que vous apprendrez à programmer votre site Internet, à l'aide du langage HTML. Tous les scripts que vous verrer sur cette page, sont nécessaires à la création d'un site Web de niveau correct. Si vous suivez attentivement les applications de cette page, vous arriverez sans emcombres à l'objectif que vous vous étiez fixé : la création de votre site Internet.
Ce site est construit sur une base HTML simple, afin de vous montrer les possibilités réalisables à l'aide de celui-ci. Toutefois, si vous désirez faire un site plus important et plus complexe, vous serez très certainement amenés à utiliser le PHP ou le CSS.
*******
Etape 1
Pour commencer, vous avez besoin d'un traitement de texte. Si vous êtes sous Windows, vous pouvez utiliser Notepad (Bloc-notes). Lancer le programme. Désormais, suivez les tags de cette page pour programmer votre site. Plus : Si vous êtes sous Linux, vous pouvez utiliser un traitement de texte similaire (Pico). Pour les Macs, c'est la même chose avec (Simple Text).
Etape 2
Créer un nouveau dossier. Créer un nouveau document texte. Incorporer votre script dans votre traitement de texte, sauvegarder-le (raccourci : Ctrl+S) puis renommer-le en changeant ".txt" en ".htm". Double-cliquez et vous observerez le résultat de votre programmation. Pour modifiez votre script, c'est très simple, renommer le document en changeant ".htm" en ".txt". C'est la démarche de base que vous effectuerez tout au long de votre création.
Les Codes HTML Ne pas oublier : Une balise ouverte doit toujours être fermée. Exemple : <head> </head>
(Sauf exception)
1] Structure
<html>
<head>
<title>Titre de la page</title>
</head>
<body>
Voici la première page de mon site. <b>Mon texte en gras.</b> </body>
</html>
Le tag html indique la nature du document.
Le tag head désigne l'en-tête de votre site Web.
Le tag body désigne la partie principale de votre page, composée de textes et de photos.
Indications :
Border : "0" signifie sans bordure et "1" avec bordure.
Width : signifie la largeur.
Height : signifie la hauteur.
? : désigne un nombre arbitraire.
2] Format de présentation
<B></B> : Permet d'écrire en gras.
<I></I> : Permet d'écrire en italique.
<U></U> : Permet de souligner.
<S></S> : Permet de rayer.
<BR> : Passer à la ligne. (Cette balise ne se ferme pas)
<P></P> : Pour faire un paragraphe.
<P align="justify"></P> : Pour justifier un texte.
<CITE></CITE> : Introduire une citation. (en italique)
<PRE></PRE> : Affiche le texte dans son format original.
<UL><LI></UL> : Permet de faire une liste. (<LI> devant chaque phrase de la liste)
<OL><LI></OL> : Permet de faire une liste ordonnée.
<STYLE></STYLE> : Feuille de style.
<FONT SIZE="?"></FONT> : Grandeur de la police. (entre 1 et 7)
<SMALL></SMALL> : Ecriture de petite taille.
<BIG></BIG> : Ecriture de grande taille.
<FONT COLOR="#123456"></FONT> : Couleur de la police.
Astuce : Pour connaitre le code qui correspond à la couleur que vous désirez, vous pouvez utiliser le nuancier de couleurs de Paint Shop Pro, il est très pratique car il vous donne le code en fonction de la couleur choisie.
3] Liens et images
<A HREF="URL"></A> : Lier un site internet.
<A HREF="./index.htm"></A> : Lier un document.
<IMG SRC="./image1.jpg" BORDER="?"></A> : Afficher une image.
<A HREF="mailto:l.helou@free.fr"></A> : Lien vers une adresse mail. (exemple)
4] Arrière-plan
<TD BGCOLOR="#123456"></TD> : Définir la couleur de fond. (dans body ou td)
<STYLE Background="VotreImage.jpg"> : Définir une image de fond. (dans body)
Nota : une fois votre site internet crée et mis en ligne, vous pouvez nous envoyer l'adresse de celui-ci; nous l'afficherons peut-être dans une rubrique à venir.
[Nécessaire : l'adresse de votre site internet, votre prénom, votre ville, et un petit commentaire en 2/3 lignes]
