Pour apprendre le langage HTML

Introduction :
Voici ce que vous devez savoir avant de continuer :

Tout d' abord, il faut prciser que le langage HTML est relativement simple mais que celui-i impose au programmeur une logique et une rigueur qu' il est de son devoir de respecter. Son travail va consister crire, dans un logiciel de traitement de texte ( pour nous, Wordpad ou le Bloc note ) son texte en y placant consciencieusement des balises ( = des instructions ) qui lui permettront de formater son texte, c' est dire, changer la couleur de son texte, changer sa structure, et y implanter des images par exemples. Il existe deux types de balises, les "conteneurs" et "vnement". Toutes s' crivent encadres des chevrons "<" et ">". Les balises conteneurs sont des balises qui s' utilisent par paires et encadrent une zone du document, par exemple le dbut et la fin d' une squence en gras ( < b > et < /b > ). Les balises vnement s' utilisent en solo, comme la balise < hr > qui affiche une ligne de sparation. Biensr ces balises apparaiteront sur votre traitement de texte ( format *.txt ) mais pas sur votre pas web ( format *.htm ou *.html ). Petite anecdote, j'ai du ajouter un espace entre les chevrons et ce qui est crit l' interieur pour pouvoir afficher les balises de mes exemples juste au dessus. Si je n' avais pas ajouter ces espaces, les balises ne se seraient pas afficher et auraient formater mon texte... Toute page dbute par une dclaration qui ne sera pas affiche par le navigateur, mais qui lui permet de dterminer la nature du document afficher. Chaque page web se composera donc ds le dbut par la balise < HTML > et se finira par la balise < /HTML >, dernire balise qui en fait n' est pas ncessaire. A l' interieur de cet encadrement, on distinguera deux parties : L' en-tte signale par les balises < head > et < /head >, le corps o se trouvera le contenu de votre page encadr par les balises < body > et < /body >. Dans l' en-tte, on incorpore des balises complexes dont on ne se souciera pas mais il faut savoir que les balises < title > et < /title > sont importantes car elles afficheront le titre du document tout en haut gauche du document, dans la petite barre bleu... on aura donc : ---------BLOC NOTE------------(Indique le dbut du bloc note.A ne pas crire comme instruction!)

< html > < head >< title >Vous mettez le titre de la page ii.< /title >< /head > < body > Vous mettez le contenu de votre page ii. < /body > < /html > ---------FIN BLOC NOTE--------(Indique la fin du bloc note.A ne pas crire comme instruction!) Incorporez dans le bloc note ces instructions. Vous avez donc un fichier TXT. Il vous suffit de le renommer maintenant en HTM ou HTML selon votre prfrence. Cette modification d' extension va permettre de visualiser le contenu de votre document par votre navigateur et de se rendre compte du rsultat final. Bon, ca, c' est une page web embryonaire! Toute ces pages doivent pourtant contenir ce minimum d' instruction. Dans la partie II du sommaire, savoir, PRESENTATION DES BALISES HTML, nous allons vous prsenter les diffrentes balises qui se placent cette fois dans le corps du document, c' est dire entre les balises : < body > et < /body >. Voil, c' est la fin de l' introduction.

Les Balises :

PRESENTATION DES BALISES

Voici ce que vous attendez tous, les balises qui vont vous permettre de controler vos crits et mettre en oeuvre vos quatres volontes. En effet, ii rside la partie non pas la plus difficile mais dirons nous, la plus tranquille qu' il puisse exister sauf qu' il va falloir que vous connaissiez par coeur ces instructions... Voil, mais ceci va se faire normalement, force de manipulations, tout a ne sera qu' une simple formalite. ( Si vous avez lu l' intro. )

Tout d' abords, veuillez tlcharger le fichier suivant, c' est un fichier d' aide sur les balises, trs pratique, compter dans votre trousse outils. -FICHIER AIDE-

Toutes les balises qui vont vous tres prsentes vont ltres selon un schma prcis. Nous allons vous les regroupes par catgories...Voyez plutt.

FORMATAGE DU TEXTE

* < b > et < /b > TEXTE EST EN GRAS --------------------->salut * < u > et < /u > TEXTE EST SOULIGNE-------------------->salut * < s > et < /s > TEXTE EST BARRE------------------------>salut * < i > et < /i > TEXTE EST EN ITALIQUE------------------->salut * < tt > et < /tt > POLICE TYPE MACHINE A ECRIRE--------->salut * < big > et < /big >TEXTE EN GROS CARACTERES---------->salut * < small >et < /small >TEXTE PETIT CARACTERES---------->salut * < sub > et < /sub >TEXTE PLACE EN INDICE-------------->salut * < sup > et < /sup > TEXTE PLACE EN EXPOSANT---------->salut * < pre > et < /pre > TEXTE ECRIT EN PREFORMATE---------> salutca va? Il affiche mme les retours la ligne.

* < hX > et < /hX > X=1,2,3 ou 4 jusqu' a 6. Permet de formater vos titres. AVEC H1 :

A
AVEC H2 :

A
AVEC H6 :
A

Remarque : comme cette balise sert formater son ou ses titres de document, remarquez qu' aprs la balise < /h6 > ( balise de fermeture ),tout le texte va la ligne. On pourrait dire que la balise de fin < /h6 > agit comme un < br > ( voir plus bas ). Il est donc inutile pour aller la ligne d' ajouter < br > aprs les balises en < hX > et < /hX >. * < font color=XXXXXX > et < /font > PERMET DE METTRE SON TEXTE EN COULEUR. LE X corespond des chiffres ou lettres, de 0 a 9 et de A F ( du plus clair au plus fonc ), en fait, de 0 F. Les 2 premiers X permettent de mettre du rouge, les 2 X suivants, du vert, les 2 derniers, du bleu. Faites des combinaisons avec les nombres et chiffres et crez des couleurs jamais vues encore! A la place des X peuvent tres crites des couleurs, en Anglais. Par exemple : < font color=blue > donne Salut< font color=green > donne Salut< font color=red > donne Salut Les autres couleurs peuvent elles aussi fonctionnes. Exemple avec les couleurs: < font color=FF0000 > donne Salut. Voici les diffrentes couleurs que vous pouvez placer tel quel dans la balise:

noir = black marron = maroon vert = green olive = olive bleu marine = navy pourpre = purple bleu/vert = teal gris = gray argent = silver rouge = red citron = lime jaune = yellow bleu = blue fuchsia = fuchsia vert bouteille = aqua blanc = white

CARACTERES SPECIAUX

* < hr > AFFICHE UNE LIGNE. Exemple : Mais cette balise peut tre modifie. < hr size=10 width=75% align=center > donne : Noter que le chiffre en pourcentage peut tre remplac par un nombre, nombre qui exprime des pixels. A la place de "Align" peut tre crit "left" ou "right". * < p > PERMET DE FAIRE UN NOUVEAU PARAGRAPHE. Exemple: "Salut < p > ca va ?" donne: "Salut ca va ?" Cette balise peut elle aussi tre modifie avec l' attribut "align" comme pour < hr >.

* < br > PERMET D' ALLER A LA LIGNE. Plusieurs < br > la suite peuvent permettre de passer plusieurs lignes.

Comment publier sa page web

PUBLICATION
Bon, en fait, il n'y a pas vraiment de mthode prcise car selon l'hbergeur, les mthodes peuvent varier. On remarque cependant une similitude :

Premierement, il faudra vous inscrire sur le site de l'hbergeur choisit. Vous disposerez donc des services complmentaires comme e-mail perso, ETC... Ensuite, vous allez engager la procdure d'obtention du pseudo et mot de passe pour votre site ( si ce n'est pas dj fait ). Cela veut dire que vous devrez trouver un nom de site ( le plus souvent celui - ci correspond au pseudonyme qu' il vous est demand l' inscription ou lors de la procdure de mise en service de votre site ). Vous devez disposez de 3 renseignements : - URL FTP, adresse pour le logiciel FTP ( voir troisiemement ). Exemple, pour multimania, son adresse internet est www.multiania.com et son adresse FTP est : ftp.multimania.com - Votre pseudo qui vous servira aussi pour le logiciel FTP, il est par exemple, pour multimania le nom de votre site et pseudonyme en mme temps. Exemple, l' URL de mon site est www.multimania.com/bennyz, et j'ai comme pseudo pour le FTP, "bennyz". - Il vous faut ensuite votre mot de passe qui servira encore pour le logiciel FTP qui vous est donn avec votre pseudo... Troisimement, vous devez disposer d'un logiciel FTP ( File Transfert Protocol ) qui va vous permettre de transfrer vos fichiers HTML et autres vers le serveur de l'hbergeur. Votre site pourra donc tre visionn sur le net mondial. Vrifiez cependant que votre page d'acceuil s'appelle INDEX.HTM ou INDEX.HTML. Si ce n' est pas le cas, votre page d' acceuil ne sera pas dtcter. Il est donc impratif que votre page d'acceuil se nomme INDEX.

Je vous conseil CUTEFTP pour dmarrer. Voici un petit aperu de mon logiciel FTP, vous pourrez voir sur cette image ou vous devez indiquer les renseignement concernants votre site. Moi j' utilise BPFTP ( c'est pratiquement le mme que CUTEFTP ). Vous pouvez tlcharger CUTEFTP ii : CUTEFTP

Gnralement, en tout cas pour multimania, votre mot de passe et pseudo vous sont retourns par mail ce qui permet d'viter la perte ou oublie du mot de passe. Pour mettre en ligne vos pages, vous faites glisser vos fichier qui son sur votre disque dur vers le serveur de l' hbergeur comme indiqu sur le dessin. Pour les personnes non entraines au FTP, il peuvent s'adresser moi, car si vous le voulez, je pourrais mettre en ligne vos pages moi mme la condition que vous me donniez les trois renseignements pour le logiciel FTP.