Transcription of Apprendre le langage Html
1 1 Apprendre le langage ambuleNotre objectif dans l' laboration de cette formation consacr e la cr ation de pages Web et donc au langageHtml a t la simplicit de l'expos et le souci de fournir des bases saines pour une tude et une utilisation pluspouss n'avons nullement la pr tention d' tre exhaustif et d' tre "LA" r f rence. Nous savons pertinemment quenotre synth se est tr s subjective et que nous ferons hurler les puristes. Nous esp rons cependant vous fairecomprendre et appr cier le langage Html et vous donner l'envie d'en Apprendre plus au sujet de la publication 1 : Le Web parle HtmlHTML est le langage universel utilis pour communiquer sur le Web. Votre information sera ainsi transport e surcette gigantesque toile de r seaux interconnect s qu'est Internet, pour aboutir sur l'ordinateur de votre lecteurgr ce un programme appel navigateur ou Vous avez donc deux interlocuteurs :1.
2 Le browser de votre lecteur2. et votre lecteur lui-m logiciel, que l'on appelle un browser, vous permet de surfer sur le Net et d'afficher sur votre cran les "pages"qu'il a intercept es. Il y a, h las, beaucoup de marques et de types de browsers diff rents. Des simples, desarcha ques ou des sophistiqu Les plus connus sont Netscape dans sa version 2, 3 et 4 ainsi Internet Explorerde Microsoft mais il en existe beaucoup d' Chaque browser a sa propre fa on de la diff rence de votre traitement de texte pr f r qui restitue exactement votre document sur une feuille depapier avec votre police de caract res et votre mise en page, vous ne saurez jamais exactement ce que le browserde votre lecteur du bout du monde affichera sur l' cran de En HTML, vous n'avez pas la ma trise totale de votre transiter le plus rapidement possible sur les lignes t l phoniques, on a adopt un format de texte tr scompact mais aussi (par cons quence) peu sophistiqu.
3 C'est le bon vieux format de texte pur et dur, sansfioritures du Bloc-notes ou Notepad de Windows par exemple. Et de plus ce format ASCII a t amput d'un bit(7 bits au lieu de 8) ! Vous serez donc priv de certains caract res sp ciaux comme le pour lesquels il faudrapasser par des codes Mais r compense supr Html est un langage universel qui s'adapte toutes les plate-formes que ce soit Windows, Macintoch, Unix, plus du texte adress votre lecteur, il vous faudra inclure des instructions pour le browser de celui-ci. Cesinstructions seront diff renci es de votre texte par les signes < et > par exemple <html>. Ces "instructions"s'appellent des tags ou des vous crirez les balises de votre page HTML, il faudra garder l'esprit :- qu'une balise marque une action pour le browser (ce qu'il doit ).
4 - que les attributs pr cisent les modalit s de cette action (comment il doit le ).Chapitre 2 : Vos premiers Vous avez besoin: d'un diteur de texte tout simple comme par exemple le Bloc-notes ou Notepad de Windows ou toutautre quivalent dans votre syst me d' d'un browser soit Netscape Navigator (payant) que vous pouvez cependant t l charger gratuitementau site de Netscape ( ) ou sur les CD de certains mensuels informatiquessoit Microsoft Explorer (gratuit galement) t l charger ( ) ou dans Vous n'avez pas besoin: d' tre connect pour crire, voir et peaufiner vos pages Html. d'avoir le dernier diteur Html sans doute performant mais co teux qu'il sera toujours tempsd'adopter lorsque vous aurez us vos petits doigts sur vos premi res pages.
5 Nous pensons ClarisHome Page, Frontpage de Microsoft, Hotdog, Hotmetal, WebExpert ou Netscape Editor ainsi qu'auxdizaines d'autres diteurs que vous rencontrerez sur le ConseilsLe langage Html tant un ensemble de balises et d'attributs, il nous para t utile sinon indispensable de lespasser en revue et surtout de les visionner au moins une fois car : si les diteurs Html vous faciliteront grandement la t che, ils ne sont pas toujours parfaits surtout lorsdes modifications, annulations ou suppressions en cours de travail. Il vous faudra bien alors vousplonger dans le code source pour corriger les dysfonctionnements. les codes source de vous pages pr f r es sont disponibles (et sans copyright). Il est alors possible des'en inspirer pour reprendre le proc d sans avoir r inventer le monde.
6 Ces m mes diteurs Html vous proposeront des termes comme" En-t te, Heading, Cell spacing,Numered " qui sont propres au langage Html. vous aurez besoin d'une connaissance pointue du Html pour inclure les codes du Javascript ou duVBscript dans vos 3 : Le document Html Voici vos premi res balises ou tags :<HTML>Ceci est le d but d'un document de type HTML.</HTML>Ceci est la fin d'un document de type HTML.<HEAD>Ceci est le d but de la zone d'en-t te(prologue au document proprement dit contenantdes informations destin es au browser).</HEAD>Ceci est la fin de la zone d'en-t te.<TITLE>Ceci est le d but du titre de la page.</TITLE>Ceci est la fin du titre de la page.<BODY>Ceci est le d but du document proprement dit.</ BODY>Ceci est la fin du document proprement dit.
7 Vous aurez remarqu qu' chaque balise de d but d'une action, soit <..>, correspond (en toutelogique) une balise de fin d'une action </..>. Vous noterez aussi que les balises ne sont pas "case sensitive". Il est donc quivalent d' crire<HTML>, <html>, <Html>, Faisons ensemble notre premier document Html:- Ouvrir l' diteur de Ecrire les codes Html suivants:<HTML> <HEAD> <TITLE>Document Html minimum</TITLE> </HEAD> <BODY> </BODY> </HTML>3- Enregistrer le document avec l'extension .html ou . Ouvrir le Afficher le document via le menu File/Open Admirer votre premier document est vide (et c'est normal) mais tout fait op rationnel! Il faudra maintenant lui fournir votre information l'int rieur des balises <BODY> </BODY>.
8 Remarquez que votre "TITLE" est pr sent dans la fen tre vos ventuelles modifications, il n'est pas n cessaire de rouvrir chaque fois le navigateur. Retourner dans l' diteur de texte (sans fermer le navigateur). Modifier les codes Html. Enregistrer le fichier. Utiliser la commande Reload du browser ou si celui-ci est paresseux cliquer dans la barre "Location"et faire "Enter".Chapitre 4 : Le texteTout document Html contiendra en majorit du texte. Voyons comment l'agr menter par quelques balises l [Bold]<B>..</B> <STRONG>..</STRONG>D but et fin de zone en grasItalique[Italic]<I>..</I> <EM>..</EM>D but et fin de zone en italiqueTaille de caract re[Font size]<FONT SIZE=?>..</FONT>D but et fin de zone avec cettetailleCouleur decaract re[Font color]<FONT COLOR="#$$$$$$"> </FONT>D but et fin de zone en couleurA la ligne[Line break] <BR>Aller la ligneCommentaires[Comments] <!
9 -- ** -->Ne pas afficherCentrage[Center]<CENTER> </CENTER>CentrerOuvrir l' diteur de texte<HTML> <HEAD> <TITLE> </TITLE> </HEAD> <BODY>texte simple<BR> <B>texte en gras</B> <BR> <STRONG>texte en gras</STRONG> <BR> <I>texte en italique</I> <BR> <EM>texte en italique</EM> <BR> <B> <I>texte en gras et en italique</I> </B> <BR>4<FONT SIZE=5>texte</FONT> <FONT COLOR="#0000FF">en bleu</FONT> <!--C'est fini--> </BODY> </HTML>- Ouvrir le browserQuelques commentaires s'imposent; Le texte tout simple s' crit sans balises. Il sera repris par le browser avec la police et taille de caract reschoisies dans sa configuration par d faut. Le browser affiche le texte qu'on lui "dicte" en passant la ligne lorsque celui-ci atteint le bord de lafen tre. Pour le forcer passer outre cette r gle de conduite et faire un saut la ligne comme vous lesouhaitez, il faut une instruction particuli re.
10 C'est la balise <BR>. Celle-ci repr sente une actionponctuelle et n'a donc pas besoin de balise de fin. Le m me browser ne tient compte que d'un seul espace entre les mots. Ainsi pour lui<FONT SIZE=5>texte</FONT> <FONT COLOR="#0000FF">en bleu</FONT> est quivalent <FONT SIZE=5>texte</FONT> <FONT COLOR="#0000FF">en bleu</FONT> Il n'est pas rare d'utiliser plusieurs balises pour un m me l ment de texte. Il faut veiller bien lesimbriquer. Ainsi <B> <I>..</I> </B> est correct et <B> <I>..</B> </I> risque de vous cr er des ennuis. La taille dans <FONT SIZE=?> peut tre indiqu e de deux fa ons :1. avec un nombre de 1 7. La valeur par d faut tant de fa on relative par rapport la valeur par d faut (ici 0). Soit -3 -2 -1 0 +1 +2 +3. Pour les puristes , les balises <I> et <EM>, <B> et <STRONG> ne sont pas totalement verrez en poussant plus avant votre tude du langage Html que <EM> et <STRONG>appartiennent aux d finitions structurales (style logique) dont l'apparence d pend des options reprisesdans la configuration du browser.
