(Hyper Text Markup Language) 1ER PARTIE HTML est le langage universel utilisé
(Hyper Text Markup Language) 1ER PARTIE HTML est le langage universel utilisé pour communiquer sur le Web. Votre information sera ainsi transportée sur Internet pour aboutir sur l'ordinateur de votre lecteur grâce à un programme appelé navigateur ou browser. Ce 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. Beaucoup de marques et de types de browsers différents. Internet Explorer de Microsoft Navigator de Netscape Opera. Le traitement de texte qui restitue exactement votre document sur une feuille de papier avec votre police de caractères et votre mise en page Vous ne pouvez jamais savoir exactement ce que le browser de votre lecteur du bout du monde affichera sur l'écran de celui-ci. Par contre, Html est un langage universel qui s'adapte à toutes les plate-formes que ce soit Windows, Macintoch, Unix, ... En plus du texte adressé à votre lecteur, il vous faudra inclure des instructions pour le navigateur de celui-ci. Ces instructions seront différenciées de votre texte par les signes < et > Exemple <html>. Ces "instructions" s'appellent des tags ou des balises. Une balise marque une action pour le browser. ce qu'il doit faire Un attribut comment il doit le faire Besoin Pas besoin D'un éditeur de texte, exemple le Bloc-notes ou Notepad Un browser soit Microsoft Explorer , soit Netscape Navigator D'être connecté pour écrire, voir et vos pages Html. Conseils Les éditeurs Html vous faciliteront grandement la tâche, Mais, ne sont pas toujours parfaits surtout lors des modifications, annulations ou suppressions en cours de travail. Il vous faudra alors bien vous plonger dans le code source pour corriger les dysfonctionnements. Conseils les codes source de vous pages préférées sont disponibles (et sans copyright). Il est alors possible de s'en inspirer pour reprendre le procédé sans avoir à réinventer le monde. Une connaissance pointue du Html, pour inclure dans vos pages les codes de langages particuliers comme du Javascript , VBscript . 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. </HEAD> Ceci est la fin de la zone d'en-tête. Voici vos premières balises ou tags <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. Remarqué qu'à chaque balise de début d'une action, soit < ... >, correspond (en toute logique) une balise de fin d'une action </ ... > Noterez aussi que les balises ne sont pas "case sensitive". Il est donc équivalent d'écrire <HTML>, <html>, <Html>, etc. Premier document Html: Ouvrir l'éditeur de texte Bloc-notes Ecrire les codes Html suivants: Enregistrer le document avec l'extension .html ou .htm. Ouvrir le navigateur. Afficher le document via le menu Fichier Ouvrir ... Vide (et c'est normal) mais tout à fait opérationnel ! Il faudra maintenant lui fournir votre information à l'intérieur des balises <BODY> </BODY>. Remarquez que votre "TITLE" est présent dans la fenêtre du navigateur. Pour vos éventuelles modifications, il n'est pas nécessaire de fermer et ouvrir à chaque fois le navigateur. Modifier les codes Html. Enregistrer le fichier. Utiliser la commande "Actualiser" du navigateur. Tout document Html contiendra en majorité du texte. Voici quelques balises élémentaires. Gras [Bold] <B>...</B> <STRONG> ... </STRONG> Début et fin d'une zone en gras Italique [Italic] <I>...</I> <EM> ... </EM> Début et fin d'une zone en italique Taille de caractère [Font size] <FONT SIZE=?> ...</FONT> Début et fin d'une zone avec cette taille Couleur de caractère [Font color] <FONT COLOR="#$$$$$$"> ... </FONT> Début et fin d'une zone en couleur A la ligne [Line break] <BR> Aller à la ligne Commen taires [Comment s] <!-- commentaire --> Ne pas afficher Centrage [Center] <CENTER> ... </CENTER> Centrer Ouvrir l'éditeur de texte Ouvrir le browser Le texte tout simple s'écrit sans balises. Sera repris par le browser avec la police et taille de caractères par défaut. Ouvrir le browser Le browser affiche le texte qu'on lui "dicte" en passant à la ligne lorsque celui-ci atteint le bord de la fenêtre. Pour le forcer à passer outre à cette règle de conduite et à faire un saut à la ligne comme vous le souhaitez, il faut une instruction particulière. C'est la balise <BR>. Celle-ci représente une action ponctuelle et n'a donc pas besoin de balise de fin. Ouvrir le browser Le même browser ne tient compte que d'un seul espace entre les mots. <FONT SIZE=5>texte</FONT> <FONT COLOR="#0000FF">en bleu</FONT> <FONT SIZE=5>texte</FONT><FONT COLOR="#0000FF">en bleu</FONT> est équivalent à Ouvrir le browser Il n'est pas rare d'utiliser plusieurs balises pour un même élément de texte. Il faut veiller à bien les imbriquer. <B><I>...</I></B> est correct et <B><I>...</B></I> risque de vous créer des ennuis. Ouvrir le browser La taille dans <FONT SIZE=?> peut être indiquée de deux façons : avec un nombre de 1 à 7. La valeur par défaut étant 3. de façon relative par rapport à la valeur par défaut (ici 0). Soit -3 -2 -1 0 +1 +2 +3. Voici les codes de quelques couleurs basiques. Le tag <BLOCKQUOTE>... </BLOCKQUOTE> introduit une citation. Son utilité serait douteuse si le texte de cette citation n'était introduit avec un léger retrait à gauche et à droite. Ce qui est bien pratique pour agrémenter la présentation. Vous savez déjà que les browsers ne reconnaissent qu'un espace entre les mots. Ce qui peut se révéler gênant dans certaines situations. La balise <PRE>...</PRE> affiche un texte dit pré- formaté. Le browser prend ainsi en compte tous les espaces et sauts de ligne définis à l'écran. Le tag <ADDRESS>...</ADDRESS> pour indiquer une adresse (généralement en fin de document). Voici mon adresse avec cette balise : Van Lancker Luc Rue des Brasseurs, 22 7700 Mouscron (Belgium) La balise <U>...</U> souligne le texte. Comme, par convention, les éléments servant d'hyperlien sont soulignés, on évitera le souligner des éléments de texte pour lui donner de l'importance. On préfèrera la mettre en gras ou une couleur de police différente. permettent d'afficher un texte clignotant par la balise <BLINK>...</BLINK> Ce tag est un peu tourné en dérision car il est rapidement ennuyeux. On lui préfèrera une image animée qui peut être débranchée après quelques clignotements. Les tags <SUB>...</SUB> et <SUP>...</SUP> placent le texte respectivement en indice et en exposant. <SUB>escalier</SUB> Escalier <SUP>escalier</SUP> Pour aligner du texte, on a utilisé l'attribut <CENTER>. Il existe une balise permettant d'aligner différents éléments. c'est le tag : <DIV align=left>...</DIV> <DIV align=center>...</DIV> <DIV align=right>...</DIV> Tout document d'une certaine consistance se doit de présenter, par exemple dans la table des matières, les différents niveaux de son exposé. Html a disposé dès son origine d'outils spécialement conçus à cet effet. En-têtes [Heading] <Hn></Hn> avec n=1 à 6 Afficher une en-tête de niveau n et sauter une ligne Liste non- ordonnée [Bullet list] <UL></UL> Afficher le texte sous forme d'une liste non-ordonnée. Liste ordonnée [Numbered list] <OL></OL> Afficher le texte sous forme d'une liste ordonnée. Elément de liste [List items] <LI> Voici un élément de la liste Paragraphe [Paragraph] <P></P> Saut de ligne, insérer une ligne vierge et commencer un paragraphe é est l'un de ces caractères spéciaux utilisés pour représenter le é. Les éditeurs Html vous déchargeront de cette corvée. Les paragraphes et les en- têtes peuvent s'aligner à gauche, au centre ou à droite. <H1 align=left></H1> <P align=left></P> <H1 align=center></H1> <P align=center></P> <H1 align=right></H1> <P align=right></P> Les listes peuvent s'imbriquer: <H4>Les 12 mois</H4> <UL><LI>Les mois du printemps <OL><LI>avril </OL></UL> Html (Hyper Text Markup Language) est un langage hypertexte (et hypergraphique) qui vous permet en cliquant sur un mot, généralement souligné (ou une image) de vous transporter; vers un autre endroit du document. vers un autre fichier Html situé sur votre ordinateur. vers un autre ordinateur situé sur le Web. La syntaxe de ces liens entre plusieurs pages, est simple mais entraînera de nombreux commentaires : <A HREF="URL ou Adresse">...</A> Lien externe Tout ordinateur situé sur le réseau Internet possède une adresse ou une URL [Universal Ressource Locator]. Le langage Html permet d'accéder à toutes les machines et toutes les ressources du Net. Pour peu qu'Internet vous soit familier, ce sont les adresses du type : http://serveur/chemin.../fichier pour le Web ftp://serveur/chemin.../fichier pour le téléchargement mailto:utilisateur@hôte pour le courrier électronique Lien local L'organisation classique et plus que conseillée d'un site Web consiste à regrouper l'ensemble des éléments de celui-ci (fichiers htm, images, ...) dans un même répertoire. Vous pourrez ainsi "transporter" aisément votre site pour le présenter sur un autre ordinateur et surtout pour le charger sur un serveur. Cette façon de procéder est la plus aisée et vous évitera pas mal de problèmes. L'adresse du lien sera alors tout simplement fichier.htm Lien mixte Nous entendons par là un lien vers un fichier situé à un autre endroit de votre ordinateur (et donc non situé dans le répertoire de votre site). En effet, il est peu uploads/Litterature/ html-1.pdf
Documents similaires
-
18
-
0
-
0
Licence et utilisation
Gratuit pour un usage personnel Attribution requise- Détails
- Publié le Oct 20, 2021
- Catégorie Literature / Litté...
- Langue French
- Taille du fichier 0.6784MB