'', ''

''. ''

'' : le contenu est un article. ''

'' : rubriques d'un article. ''

'' : bloc pour un contenu divers. Le crawler ne connait pas l'importance du contenu. * ''

'' : bloc d'information secondaire. Généralement c'est les liens associés (pub, bibliographie, sommaire) * ''

'' : bas de page. ====Paragraphes==== * ''

'' jusqu'à ''

'' (header) : ''

'' désigne le titre de la page et ne doit être présent qu'une seule fois. Attribut ''id'' : désigne un point d'ancrage pour les liens hypertexte, | `h1 header h2 header h3 header h4 header h5 header h6 header` |

h1 header

h2 header

h3 header

h4 header

h5 header

h6 header

| * ''

'' : les paragraphes. A ne pas confondre avec ''
''. | Texte non multi-ligne.

Texte


multi-ligne.

| Texte non multi-ligne.

Texte

multi-ligne.

| * ''
'' : force un retour à la ligne mais sans changer de paragraphe. Par exemple : utiliser ''

'' pour délimiter les couplets et refrains d'une chanson et utiliser ''
'' pour les rimes. | Ligne 1 Ligne 2 | Ligne 1
Ligne 2 | * ''

'' : listes pucées. Début et fin de la liste non numérotée ''

'' (list item). |



  liste ordonnée
    
      liste non ordonnée imbriquée

liste ordonnée
- liste non ordonnée imbriquée

| * ''

'', ''

'' : listes non pucées. Début et fin de la liste sans puce ''

'' (description term) et détails ''

'' (description details). |



  Terme
  Description 1
  Description 2

Terme: Description 1; Description 2

| * ''%%%%'' et ''%%

%%'' et son attribut ''cite'' (n'est pas affiché). | blabla |

blabla

| Il y a ''%%%%'' pour une citation dans un paragraphe. On peut aussi combiner ''%%
%%'' et ''%%%%'' | Text Cite text |

Text

Cite text

| * ''
''. Texte libre à l'intérieur. Met en italique. | jim@example.com +1 (415) 555‑0132 |
Auteur: W3docs team
Contacter à l'auteur
| * '''', '''', '''', '''' : police monospace. Pour faire du multi-ligne, il faut entourer par ''''. Toutes les affichages sont identiques. ''code'' représente du code informatique, ''var'' représente une variable, ''kbd'' représente la commande saisie au clavier, ''samp'' représente la sortie standard. ====Groupes de mots==== * ''%%%%'' : modification du style sans mise en évidence par les crawlers. | Is this a top level heading? | Is this a top level heading? | * '''' (emphasis) : accentuer un mot pour les crawlers. Met également en italique. | I am glad you weren't late. | I am glad you weren't late. | * '''' (important) : accentuer fortement un mot pour les crawlers . Met également en gras. | This liquid is highly toxic. | This liquid is highly toxic. | * '''' (pertinence) pour les crawlers. Met également en surligné. | This liquid is highly toxic. | This liquid is highly toxic. | * Obsolète : '''' (italic), '''' (bold), '''' (underline). Préférer span + CSS. * '''' (lien) : ''%%texte%%''. La documentation de Mozilla indique de mettre le format à l'intérieur du ''''. | MDN Web Docs | MDN Web Docs | On peut ajouter ''#XYZ'' en fin d'adresse Internet pour se positionner à l'emplacement dans la page qui contient l'attribut ''%%id="XYZ"%%''. L'attribut ''title'' ajoute un texte via une tooltip (déprécié, non utilisable sans souris). Le texte du lien doit être une description autonome de l'URL. Mauvais exemple : ''%%Cliquer ici pour télécharger%%''. On peut aussi faire un lien vers un mail : ''%%Send email to nowhere%%''. * ''%%%%'' et son attribut ''cite'' (n'est pas affiché). | blabla | blabla | Il y a '''' pour une citation de tout un paragraphe. * '''' et son attribut ''title'' (abréviation). | Rev. | Rev. | * ''^{'' (exposant) et ''%%_{%%'' (indice). | C₈H₁₀N₄O₂ | C₈H₁₀N₄O₂ | * '''' : pour distinguer l'affichage visuel et l'affichage normalisé. | 20 January 2016 | 20 January 2016 | =====Multimédia===== ====Images==== * '''' : affiche une image | | | Attribut ''alt'' : pour un texte alternatif décrivant l'image. Attributs ''width'' et ''height'' : dimension en pixel. La taille doit correspondre aux dimensions de l'image. Ce n'est pas fait pour redimensionner l'image (sauf taille dynamique dans la page). Si seulement un des deux attributs est indiqué, le ratio de la taille de l'image sera conservé. Attributs ''srcset'' et ''sizes'' : afficher une image spécifique en fonction de la largeur de l'image affichée. Souvent la dimension de l'image dépend de la largeur d'affichage. Dans ''srcset'', il faut mettre la liste des images avec leur dimension. On met ''w'' pour indiquer la largeur (''width'') en pixel. Dans ''sizes'', il y a la largeur (en ''px'') en fonction d'une condition ''CSS''. La première condition vraie est appliquée donc l'ordre est important. * '''' Il permet d'afficher des images de façon dynamique mais de façon plus fine, toujours sur la base de condition ''CSS''. ou encore : [[https://blog.bitsrc.io/why-you-should-use-picture-tag-instead-of-img-tag-b9841e86bf8b|Why You Should Use Picture Tag Instead of Img Tag]] {{ :prog:html:why_you_should_use_picture_tag_instead_of_img_tag_by_chameera_dulanga_bits_and_pieces_14_03_2024_06_56_06_.html |Archive du 25/01/2021 le 14/03/2024}} * ''}}
'' et ''
'' : ajoute un texte lié à l'image. | A T-Rex on display in the Manchester University Museum. | A T-Rex on display in the Manchester University Museum. | * '' | | Attributs sans commentaire : ''width'', ''height'' et ''allowfullscreen''. ''sandbox'' : toujours le mettre quand le widget est compatible (donc pas Google). * ''

Titre
	Mon
1st period	English
Dernier1	Dernier2

Titre
	Mon
1st period	English
Dernier1	Dernier2