Différences entre les versions de « Introduction au langage html »

De Wikip
toross>WikiAdmin
m (1 version importée)
 
(2 versions intermédiaires par 2 utilisateurs non affichées)
Ligne 1 : Ligne 1 :
{{Introduction
#REDIRECTION [[Introduction aux langages de balisage généralisé basés sur SGML : XML et HTML]]
|texte=Le langage HTML (Hypertext Markup Language)
|auteurs=Arthur Torossian
|index=Informatique
}}
{{PliGlobalBtns}}
== Un fichier texte ==
{{par|Le terme générique de texte se réfère à un exemple de matériau écrit ou parlé où ce dernier a été transcrit d'une certaine manière.[https://fr.wikipedia.org/wiki/Syst%C3%A8me_d%27%C3%A9criture#Texte,_%C3%A9criture,_lecture_et_orthographe]
}}
 
{{par|En informatique le matériau d'écriture est le fichier. Un [http://fr.wikipedia.org/wiki/Fichier_texte fichier texte] ou {{m|fichier plat}} ou {{m|fichier texte brut}} ou
{{m|fichier texte simple}} est un fichier dont le contenu représente uniquement une suite de caractères qui comprend également des caractères non visibles tels que l'{{dq|espace}}, la {{dq|fin de ligne}} et la {{dq|tabulation}}.
}}
 
{{Ex|
{{code|lang=text|code=
Il était une fois une marchande de foie
qui vendait du foie dans la Ville de Foix.
Elle se dit «ma foi c'est la première fois
que je vends du foie dans la ville de Foix !»
}}
}}
 
{{par|Le fichier texte est le format le plus simple pour représenter un texte dans un fichier. Ce type de fichier s'édite très simplement avec des logiciels que l'on trouve sur tous les système d'exploitation; exemple : ed, edit, notepad, notepad++, vi, etc.}}
 
{{Exo
|1={{PliPar
|id=20190709-143518
|text=
<div>{{hr}}Nous avons
* 26 lettres ↦ 52
* 16 lettres accentués ↦ 32 
* 2 ligatures ↦ 4
* le c cédille {{dq|ç}} ↦ 2
* les caractères de ponctuations ↦ 19 (+2)
Ce qui nous fait 109 (+ 2; le tilde et le tréma se combine avec d'autres lettres pour les langues étrangères, on ne vas pas les compter ici)
{{code|lang=text|code=
A a B b C c D d E e F f G g H h I i J j K k L l M m
N n O o P p Q q R r S s T t U u V v W w X x Y y Z z
À à Â â  É é È è Ê ê Ë ë
Î î Ï ï Ô ô Ù ù Û û Ü ü Ÿ ÿ
Æ æ Œ œ
Ç ç
’ — – - . , … : ; ? ! « » “ ” ( ) [ ] ~ ¨
}}
Source : [https://fr.wikipedia.org/wiki/Alphabet_fran%C3%A7ais]
{{hr}}</div>
|info=<div>Quel est le nombre de caractères nécessaire pour écrire le français ? (cliquer sur le symbole suivant pour voir la réponse)</div>
}}
|2=20190705-163531}}
<hr>
 
{{par|Toute donnée gérée par un ordinateur est stockée sous la forme de suites de {{mm|0}} et {{mm|1}}. Et donc un fichier texte sera stocké sous forme de suite de {{mm|0}} et {{mm|1}}. Il faudra dans tous les cas définir un codage pour passer d'un caractère, qui est un [[signe]] à une suite binaire et d'une suite binaire à des caractères.
}}
 
{{Exo|1=
{{PliPar
|id=20190708-130924
|text=<div>{{hr}}
* 0 ↦ 0 ↦ 0 
* 1 ↦ 1 ↦ 1
* 2 ↦ 10 ↦ 2
* 8 ↦ 1000 ↦ 8
* 9 ↦ 1001 ↦ 9  (TB tabluation  en code ASCII)
* 10 ↦ 1010 ↦ a  (LF Line Feed (saut de ligne) en code ASCII)
* 13 ↦ 1101 ↦ d  (CR Carriage Return (retour chariot) en code ASCII)
* 16 ↦ 1 0000 ↦ 10
* 32 ↦ 10 0000 ↦ 20
* 64 ↦ 100 0000 ↦ 40
* 128 ↦ 1000 0000 ↦ 80
* 127 ↦ 111 1111 ↦ 7f
{{hr}}</div>
|info=Essayez de convertir, dans cet exercice, les nombres décimaux(base 10) suivants en binaire(base 2) et en hexadécimal(base 16: 0…9,a,b…f) ?<div>0; 1; 2; 8; 9; 10; 13; 16; 32; 64; 128; 127;</div>
}}
}}
 
{{Exo|1=
{{PliPar
|id=20190709-143603
|text=<div>{{hr}}
: 4 
: en effet nous avons :
: 0 ↦ 0000
: 1 ↦ 0001
: 2 ↦ 0010
: 3 ↦ 0011
: 4 ↦ 0100
: 5 ↦ 0101
: 6 ↦ 0110
: 7 ↦ 0111
: 8 ↦ 1000
: 9 ↦ 1000
: a ↦ 1010
: b ↦ 1011
: c ↦ 1100
: d ↦ 1101
: e ↦ 1110
: f ↦ 1111
On peut remarquer aussi que {{mathJ|1=2^4 = 16}} (voir des cours de dénombrement pour le calcul du nombre de combinaisons, arrangements, etc.)
{{hr}}</div>
|info=<div>Il faut combien de chiffres binaires pour représenter un chiffre hexadécimal ?</div>}}
|2=20190709-133240}}
 
{{Exo|1=
{{PliPar
|id=20190709-133241
|text=<div>{{hr}}
: 2 
: en effet un bit est représenté par un chiffre binaire, un octet c'est 8 bits et un chiffre hexadécimal représente 4 bits (voir exercice {{clink|20190709-133240}}) et donc il nous faut 2 chiffre hexadécimal {{mathJ|1=2 \times 4 = 8}}.
 
Les chiffres hexadécimaux sont pratiques pour écrire des suites d'octets (contenu binaire quelconque).
 
Par exemple la suite d'octets suivante :
{{code|lang=text|code=
4c 61 20 76 69 65 20 65 73 74 20 62 65 6c 6c 65 2e 0a
}}
Si le codage est l'ASCCI représente le texte suivant:
{{code|lang=text|code=
La vie est belle.
}}
Le dernier octet qui n'est pas visible est le code 0a (10 en décimal) qui est interprété en code ASCII comme un saut d'une ligne (LF line feed)
{{hr}}</div>
|info=<div>Il faut combien de chiffres hexadécimales pour représenter un octet ?</div>
}}
}}
 
{{par|
Le plus célèbre de codage est [https://fr.wikipedia.org/wiki/American_Standard_Code_for_Information_Interchange ASCII] qui est une suite de paquets de 8 bits, mais ASCII n'utilise que 7 bits sur ces 8 bits.
}}
 
{{Ex|Les caractères visibles du code ASCII
{{code|lang=text|code=
!"#$%&'()*+,-./
0123456789:;<=>?
@ABCDEFGHIJKLMNO
PQRSTUVWXYZ[\]^_
`abcdefghijklmno
pqrstuvwxyz{|}~
}}
Ces 95 caractères imprimables/visibles d'ASCII sont apparus en 1960 qui suffisent à priori à écrire tout type de texte en anglais, pour le français nous avons vu dans l'exercice {{clink|20190705-163531}} qu'il nous faut au moins 109 caractères et sans parler des caractères de type {{dq|#$%&*+-}} ou même {{dq|€}}.
}}
 
{{Ex|L'art [https://fr.wikipedia.org/wiki/Art_ASCII ASCII] :
<source lang="text">
          (__)                     
          (oo)                                         
    /-------\/      __        O            \O/         
  / |    ||      /o)\      /|\            |         
  *  ||----||      \(o/      / \            / \         
    ~~    ~~                                   
      Vache    Yin/Yang  Personne  Personne contente
 
          \                (\_/) (\___/)
(\___/)    \ /\    ()_()  (^_^) (='.'=)    _[ ]_     
(='.'=)    ( )    (='.'=)  (>$<) ( U U )  \('o')/     
(")_(")  .( o ).  (")_(")  (/ \) (")_(")    ( : ) 
        Cinq exemples de lapins          Bonhomme de neige   
</source>
}}
 
{{Ex|D'autres tel que Toyoda Masashi (toyoda@is.titech.ac.jp) ont même créé un logiciel qui produit une animation (un train qui passe) avec du ASCII :
{{youtube
|title=sl command sous Linux
|desc=display animations aimed to correct users who accidentally enter sl instead of ls.
|address=https://www.youtube.com/watch?v=6Shpg50U9W4
}}
}}
 
{{Ex|
L'écriture suivante {{dq|{{mm|ABC}} }} en code ASCII sera codée de la façon suivante:
* en base 10 {{dq|{{mm|65 66 67}}}};
* en base 16 {{dq|{{mm|41 42 43}}}};
* en base 2 {{dq|{{mm|0100·0001 0100·0010 0100·0011}}}}.
}}
 
{{par|Le problème du codage ASCII est qu'il ne convient qu'à l'écriture anglaise. Pour le français il ne permet pas d'écrire les caractère accentués par exemple. Afin d'adopter une écriture universelle l'encode UTF-8 a été spécifié qui est toujours basé sur un paquets de 8 bits, mais un caractère peut être code avec 1 ou plusieurs paquet. De plus [https://fr.wikipedia.org/wiki/UTF-8 UTF8] est compatible avec le codage ASCII.
}}
 
{{Ex|
L'écriture suivante {{dq|{{mm|naître}} }} en code UTF8 sera codée de la façon suivante:
* en base 16 {{dq|{{mm|6e 61 c3 83 c2 ae 74 72 65}}}};
* en base 2 {{dq|{{mm|0110·1110 0110·0001 1100·0011 1000·0011 1100·0010 1010·1110 0111·0100 0111·0010 0110·0101}}}};
* comme un texte ASCII {{dq|{{mm|naître}}}}.
On peut noter que le caractère {{dq|{{mm|î}} }} est codé sur 4 paquets de 8 bits (4 octets) :
* en base 16 {{dq|{{mm|c3 83 c2 ae}}}};
* en base 2 {{dq|{{mm|1100·0011 1000·0011 1100·0010 1010·1110}}}};
}}
<hr>
 
{{par|
* Système d'écriture
*: https://fr.wikipedia.org/wiki/Système_d'écriture
* convertisseur de UTF8
*: https://cafewebmaster.com/online_tools/utf8_encode
* Convertisseur d'hexadécimal en binaire
*: https://codebeautify.org/hex-binary-converter
* ASCII
*: https://fr.wikipedia.org/wiki/American_Standard_Code_for_Information_Interchange
}}
 
== Un fichier binaire ==
{{par|
En informatique, un {{m|fichier binaire}} est un fichier qui n'est pas un fichier texte.
}}{{par|
De nombreux formats de fichiers binaires stockent une {{m|partie}} de leurs données sous forme de texte (une suite de caractères), le reste servant à interpréter, formater ou afficher ce texte.
}}{{par|
Par extension de langage, on appelle « {{m|binaire}} » tout fichier qui n'est pas interprétable sous forme de texte : c.a.d. une image, un son ou encore un autre fichier compressé.
}}{{par|
Autre définition: c'est aussi un terme spécifique à l'informatique où l'on part d'un {{m|code source}} ({{m|texte}}) pour générer un logiciel sous forme de {{m|fichier exécutable}} ou ({{m|binaire}}); dans ce contexte {{dq|1=binaire = code exécutable}}.
}}
 
{{Ex|Voici un exemple de fichier binaire, une image jpg 2x2 pixels remplie de blanc.
 
La partie gauche contient la position en octet du premier octet de la ligne, au contre nous avons 16 octets suivis de leur équivalent en code ASCII, si le code n'est pas visible alors il est représenté par {{dq|.}}.  Le dernier octet qui a pour valeur {{mm|0a}} se trouve à la position 21b (en hexadécimal), si la première position est 0.
 
Cette vue a été obtenu avec le logiciel {{m|evim}} sous Linux.
 
Une partie de ce fichier binaire est au format texte : {{dq|Created with GIMP}} !
{{code|lang=text|code=
0000000: ffd8 ffe0 0010 4a46 4946 0001 0101 0048  ......JFIF.....H
0000010: 0048 0000 fffe 0013 4372 6561 7465 6420  .H......Created
0000020: 7769 7468 2047 494d 50ff db00 4300 0806  with GIMP...C...
0000030: 0607 0605 0807 0707 0909 080a 0c14 0d0c  ................
0000040: 0b0b 0c19 1213 0f14 1d1a 1f1e 1d1a 1c1c  ................
0000050: 2024 2e27 2022 2c23 1c1c 2837 292c 3031  $.' ",#..(7),01
0000060: 3434 341f 2739 3d38 323c 2e33 3432 ffdb  444.'9=82<.342..
0000070: 0043 0109 0909 0c0b 0c18 0d0d 1832 211c  .C...........2!.
0000080: 2132 3232 3232 3232 3232 3232 3232 3232  !222222222222222
0000090: 3232 3232 3232 3232 3232 3232 3232 3232  2222222222222222
00000a0: 3232 3232 3232 3232 3232 3232 3232 3232  2222222222222222
00000b0: 3232 32ff c200 1108 0002 0002 0301 1100  222.............
00000c0: 0211 0103 1101 ffc4 0014 0001 0000 0000  ................
00000d0: 0000 0000 0000 0000 0000 0006 ffc4 0014  ................
00000e0: 0101 0000 0000 0000 0000 0000 0000 0000  ................
00000f0: 0000 ffda 000c 0301 0002 1003 1000 0001  ................
0000100: 7e7f ffc4 0014 1001 0000 0000 0000 0000  ~...............
0000110: 0000 0000 0000 0000 ffda 0008 0101 0001  ................
0000120: 0502 7fff c400 1411 0100 0000 0000 0000  ................
0000130: 0000 0000 0000 0000 00ff da00 0801 0301  ................
0000140: 013f 017f ffc4 0014 1101 0000 0000 0000  .?..............
0000150: 0000 0000 0000 0000 0000 ffda 0008 0102  ................
0000160: 0101 3f01 7fff c400 1410 0100 0000 0000  ..?.............
0000170: 0000 0000 0000 0000 0000 00ff da00 0801  ................
0000180: 0100 063f 027f ffc4 0014 1001 0000 0000  ...?............
0000190: 0000 0000 0000 0000 0000 0000 ffda 0008  ................
00001a0: 0101 0001 3f21 7fff da00 0c03 0100 0200  ....?!..........
00001b0: 0300 0000 109f ffc4 0014 1101 0000 0000  ................
00001c0: 0000 0000 0000 0000 0000 0000 ffda 0008  ................
00001d0: 0103 0101 3f10 7fff c400 1411 0100 0000  ....?...........
00001e0: 0000 0000 0000 0000 0000 0000 00ff da00  ................
00001f0: 0801 0201 013f 107f ffc4 0014 1001 0000  .....?..........
0000200: 0000 0000 0000 0000 0000 0000 0000 ffda  ................
0000210: 0008 0101 0001 3f10 7fff d90a            ......?.....
}}
}}
 
== Le marquage d'un texte ou balisage (en anglais on parle de tag) ==
{{par|Très vite les informaticiens ont voulu faire évoluer les fichiers au format texte.
}}{{par|
L'une des techniques les plus puissante pour faire évoluer le fichier texte est l'utilisation de balises.
}}{{par|
Le grand avantage de celle-ci est que le fichier reste éditable avec les éditeur des fichiers textes, on dit qu'il est humainement éditable. 
}}{{par|
Ce qui revient à dire que le fichier reste au format texte et non binaire.
}}
{{par|
Les langages de balisage représentent une classe de langages spécialisés dans l'enrichissement d'information {{m|textuelle}}.
}}
 
{{par|
Les {{m|balises}} sont des unités syntaxiques délimitant une {{m|séquence de caractères}} ou {{m|marquant une position}} précise à l'intérieur d'un flux de caractères (par exemple un {{m|fichier texte}}).
}}
 
{{par|
L'inclusion de balises permet de {{m|structurer}} le contenu d'un document de type {{m|texte}}.
}}
 
{{Ex|
Prenons l'exemple d'un texte d'un document à imprimer écrit dans le langage LaTeX  :
{{code|lang=latex|code=
\documentclass{beamer} % animation
\usepackage[utf8]{inputenc}
\usepackage[francais]{babel} 
\title{Introduction à la logique mathématique}
\author{Arthur Torossian}\institute{École des Torossians}
\date{10 octobre 2018} 
\begin{document}
  \begin{frame}
  \titlepage
  \end{frame}
  \begin{frame}
\onslide<4->{ Et c'est facile.}
\begin{itemize}
    \item<1-> premier élément de liste,
    \item<2-> deuxième élément de liste,
    \item<3-> troisième élément de liste. 
  \end{itemize}
  \end{frame}
\end{document}
}}
Le texte {{dq|pur}} contenu dans ce fichier LaTeX e est :
{{code|lang=text|code=
Introduction à la logique mathématique
Arthur Torossian École des Torossians
10 octobre 2018
Et c'est facile.
  premier élément de liste,
  deuxième élément de liste,
  troisième élément de liste. 
}}
En latex les balises commencent avec le caractère anti-slash {{dq|\}}, pour écrire ce caractère dans la partie texte, hors balise, on le répète deux fois :  {{dq|\\}}. {{mm|\begin{document} }} est une balise du langage LaTex.
|20190710-131116}}
 
{{par|
Cette structure est compréhensible par un programme informatique, ce qui permet un traitement automatisé du contenu. Le logiciel LaTex transforme le fichier texte balisé de l'exemple {{clink|20190710-131116}} pas seulement en un beau document mais aussi avec des informations supplémentaires incluses telles que le contenu d'un index, ou tables des matières, etc.
}}
 
{{par|
La structuration avec traitement automatisé permet également de dissocier le présentation d'un document texte de son contenu. Ainsi un même texte sera présenté adapté pour un petit écran de téléphone portable alors que sue l'écran d'un ordinateur la présentation sera plus sophistiquée. Latex peut très générer, à partir de la même source balisée, un livre, des transparents avec des animations ou même des pages html.
}}
 
{{par| voir aussi [http://fr.wikipedia.org/wiki/Langage_de_balisage langage de balisage]}}
 
{{par|
Avant de parler de {{m|HTML}} il faut parler en général des partageant la même base de balisage  {{m|SCGML}}, {{m|XML}}, etc.
}}
=== La partie commune des langages basée sur le SCGML : Standard Generalized Markup Language ===
{{par|1=
Les spécifications du SGML se trouvent sur [https://www.iso.org/standard/16387.html iso], les documents ISO (Organisation internationale de normalisation) sont payants.
}}
==== Les balises SGML XML HTML ====
{{Def
|1=
Une balise est un texte commençant le symbole {{m|<}}(plus petit), suivi du {{m|nom}} de balise puis une partie optionnelle destinée aux attributs et se termine se termine par le symbole {{m|>}}(plus grand). 
|2=|3=balise}}
{{RDo|Il est fortement recommandé de n'utiliser que des lettres non accentuées pour former les noms des balises.
 
Pour les plus curieux, les règles de nommage sont spécifiées dans la norme [https://www.iso.org/standard/16387.html ISO].
 
Sinon on peut adopter suivre les règles moins strictes suivantes :
# les noms doivent obligatoirement débuter par une lettre ou un underscore {{dq|_}};
# les noms peuvent contenir des lettres, des chiffres ou des caractères spéciaux;
# les noms ne peuvent pas contenir d'espaces;
# on évitera les caractères - , ; . < et > qui peuvent être mal interprétés dans vos programmes.
}}
{{Ex|
{{code|colNb=70|lang=gml|code=
<jeSuisUneBalise>
}}
}}
{{par|1=
En SCGML on distingue deux types de balises; les {{dq|ouvrantes}} et le {{dq|fermantes}}
}}{{par|1=
Dans l'exemple du langage de LaTeX la balise {{mm|\begin{document}}} et la balise {{mm|\end{document}}} sont les équivalentes d'une balise ouvrante et fermante.
}}{{par|1=
Le texte contenu entre ces deux balise prend alors une signification, ainsi on passe de la syntaxe à la sémantique.
}}{{par|1=
L'équivalent en SGML de cette exemple serait :
{{code|colNb=70|lang=gml|code=
<document>La vie est belle.</document>
}}
Dans ce cas là la sémantique du texte {{dq|La vie est belle.}} est {{dq|document}}.
}}
 
{{Def
|1=
Les attributs sont des couples (nom, valeur) reliés entre eux par le symbole égal {{dq|1==}}. La valeur, un texte quelconque, est délimitée par les double ou simple quottes ; {{dq|"valeur"}} ou {{dq|'valeur'}} .
Les attributs suivent donc la syntaxe suivante :
{{code|colNb=70|lang=xml|code=
attributeName2="AttributeValue2"
}}
par exemple :
{{code|colNb=70|lang=xml|code=
color="green"
}}
Et la structure générale d'une balise est :
{{code|colNb=70|lang=xml|code=
<baliseName
  attributeName1="AttributeValue1" 
  attributeName2='AttributeValue2'
  …
  attributeNameN="AttributeValueN"
>
}}
Pour mettre des double-quottes dans les attributs on peut utiliser les {{dq|références de caractère}} (voir [https://fr.wikipedia.org/wiki/Liste_des_entit%C3%A9s_caract%C3%A8re_de_XML_et_HTML])
{{code|colNb=70|lang=xml|code=
<gangster name="George &quot;Shotgun&quot; Ziegler">
}}
ou plus simplement pour certains cas favorables :
{{code|colNb=70|lang=xml|code=
<gangster name='George "Shotgun" Ziegler'>
}}
|2=|3=attributs d'une balise}}
 
{{Def
|1=
Une balise dite ouvrante si après le symbole {{m|<}} de début de balise n'est pas suivi par le caractère {{dq|{{mm|/}}}}.
|2=|3=balise ouvrante}}
{{Ex|1=
La balise suivante nommée {{dq|city}} est ouvrante :
{{code|colNb=70|lang=xml|code=<city name="Paris">}}
|2=|3=}}
{{Ex|1=
La balise suivante nommée {{dq|city}} n'est pas ouvrante :
{{code|colNb=70|lang=xml|code=</city>}}
|2=|3=}}
 
{{Def
|1=
Une balise dite fermante est un texte commençant le symbole {{m|<}}, suivi de {{m|/}}, suivi du nom de balise et se terminant par le symbole {{m|>}}.
{{code|colNb=70|lang=xml|code=
</baliseName>
}}
|2=
|3=balise fermante}}
{{Ex|1=
{{code|colNb=70|lang=xml|code=
</city>
}}
|2=|3=}}
 
{{Def
|1=Une balise ouvrante et fermante est une balise ouvrante qui ne se termine pas par {{m|>}} mais par {{m|/>}}.
{{code|colNb=70|lang=xml|code=
<baliseName attributeName1="AttributeValue1" 
            attributeName2="AttributeValue2"
            …
            attributeNamen="AttributeValuen"/>
}}
|2=
|3=balise ouvrante et fermante}}
{{Ex|1=
{{code|colNb=70|lang=xml|code=
<city name="Paris"/>
}}
|2=|3=}}
 
{{Def|Un nœud est l'ensemble du texte commençant par une balise ouvrante et se terminant par la balise correspondante fermante. Le nom du nœud est le nom de la balise correspondante
|Nœud|Nœud}}
{{Ex|1=Un nœud appelé city :
{{code|colNb=70|lang=xml|code=
<city id="AR32"> <name>Paris</name> … </city>}}
|2=|3=}}
{{Def|L'en-tête d'un nœud est l'ensemble des attributs de la balise.
|En-tête de nœud|En-tête de nœud}}
{{Def|Le corps d'un nœud est la partie du texte qui se trouve entre la balise ouvrante et la balise fermante correspondante.
|Corps de nœud|Corps de nœud}}
{{Rq|Le corps d'un nœud où la balise est ouvrante et fermante possède un corps vide.}}
{{Rq|Le corps de nœud peut aussi contenir d'autres nœuds. L'en-tête et le corps d'un nœud définissent sa structure. Cette  structure est arborescente. }}
{{Ex|1=
{{code|colNb=70|lang=xml|code=
<russian_doll name="Galina">
    <russian_doll name=" Anastasiya">
        <russian_doll name=" Marta"/>
    </russian_doll>
</russian_doll>
}}
|2=|3=Les poupées russes}}
{{Rq|Dans certains cas un élément d'un nœud peut se mettre soit sous la forme d'un attribut ou soit sous la forme d'un nœud (à définir quand on spécifie la grammaire de la structure). Cela peut être le cas par exemple pour nommer un nœud.}}
{{Ex|1=
{{code|colNb=70|lang=xml|code=
<city name="Paris"> … </city>
}} ou
{{code|colNb=70|lang=xml|code=
<city> <name>Paris</name> … </city>
}}
|2=|3=}}
 
== Un fichier HTML minimal ==
{{Def|1=
 
|2=|3=HTML}}
{{par|Rappelons qu'un fichier HTML est un [[#Un_fichier_texte|fichier texte plat]] auquel on donne une structure à l'aide de balises définies avec des suite de caractères en commençant avec le caractère {{m|<}} et se terminant le caractère {{m|>}}.}}
{{Ex|1=
{{code|colNb=70|lang=html4strict|code=
<!DOCTYPE html>
<html>
    <head>
        <meta
          http-equiv="Content-Type"
          content="text/html;charset=UTF-8" />
        <title></title>
    </head>   
    <body>
    </body>
</html>
}}
|2=htmlminimal}}
{{par|Un fichier HTML commence par la ligne {{mm|<!DOCTYPE html>}} qui précise que le fichier est bien un fichier HTML; cette information peut servir aux logiciels qui lisent ce fichier.}}
{{par|Le contenu d'un fichier HTML est organisé comme un arbre (structure arborescente) où les nœuds jouent le rôle du tronc et des branches. Il contient donc une unique racine ou tronc le nœud {{mm|<html>}}. Le nœud racine se divisent en deux branches; sa tête ({{mm|<head>}}) et son corps ({{mm|<body>}}). On peut les représenter par :
{{code|colNb=70|lang=text|code=
html
├── body
└── head
}}
}}
{{par|Le nœud - on emploie en général le mot balise à la place de nœud - de l'exemple {{clink|htmlminimal}} permet de préciser l'encodage des caractères du fichier texte.
 
Hélas c'est l'histoire de l'informatique qui explique pourquoi l'on doit préciser l'encodage mais il faut le préciser car sinon le caractère «{{m|é}}» par exemple ne s'affichera probablement pas correctement dans un navigateur. Dans notre cas, nous avons choisi l'encodage {{mm|UTF-8}} qui est le plus généralisé et universel.
 
Il faut aussi, et c'est aussi important, configurer votre éditeur pour utiliser cet encodage afin qu'il enregistre le fichier en utilisant cet encodage.
 
Notons que «{{m|é}}» est encodé avec l'encodage {{mm|UTF-8}} avec avec deux nombres {{mm|195}} suivi de {{mm|169}} alors qu'avec l'encodage {{mm|iso-8859-1}} il sera codé avec le seul nombre {{mm|233}}.
}}

Version actuelle datée du 26 décembre 2023 à 11:27

Rediriger vers :

Récupérée de « https://wiki.bht.fr/index.php?title=Introduction_au_langage_html&oldid=4521 »