Structure et présentation HTML


21 octobre 2020
Aucun commentaire

HTML

HTML (Hypertext Markup Language) est le langage de balisage reconnu utilisé dans la création de pages Web. Il définit la composition des pages Web en utilisant le balisage. Les éléments HTML sont les unités principales des pages HTML et sont indiqués par des balises. Les balises HTML étiquettent des parties de contenu telles que des en-têtes, des paragraphes et des tableaux. Les navigateurs n’affichent pas les balises HTML, mais elles sont utilisées en arrière-plan afin de fournir le contenu de la page.

Balises HTML

Les balises HTML sont des noms d’élément entre crochets. Les balises HTML viennent généralement par paires. La première balise d’une paire est la balise de début et la deuxième balise est la balise de fin. La balise de fin est écrite comme la balise de début, mais avec une barre oblique insérée avant le nom de la balise. La balise de début est parfois également appelée balise d’ouverture et la balise de fin, balise de fermeture.

Tous les documents HTML doivent commencer par une déclaration de type de document: <! DOCTYPE html>. Le document HTML lui-même commence par <html> et se termine par </html>. La partie visible du document HTML se situe entre <body> et </body>.

Les balises HTML ne sont pas sensibles à la casse.

Attributs HTML

Tous les éléments HTML peuvent avoir des attributs, qui fournissent des informations supplémentaires sur l’élément, et sont toujours spécifiés dans la balise de début. Ils viennent généralement par paires nom / valeur.

CSS

CSS (Cascading Style Sheets) définit la manière dont les éléments HTML doivent être présentés sur un écran, des papiers ou d’autres supports donnés. Cela économise beaucoup de travail au développeur, car il peut contrôler la mise en page de plusieurs pages Web simultanément.

Façons d’ajouter du CSS aux éléments HTML

  • Inline – utilisé pour appliquer un style unique à un seul élément HTML. Il utilise l’attribut style d’un élément HTML.
  • Interne – utilisé pour décrire un style pour une page HTML. Il est indiqué dans la section <head> d’une page HTML, dans un élément <style>.
  • Externe – utilisé pour définir le style de plusieurs pages HTML à l’aide d’un fichier CSS externe. Vous pouvez modifier l’apparence d’un site Web entier en modifiant un fichier. C’est la manière la plus courante d’ajouter du CSS aux éléments HTML.

Structure vs présentation

La composition d’une page Web peut être considérée comme un mélange des quatre éléments suivants:

  • Contenu est le terme général utilisé pour tous les éléments d’information affichés par le navigateur, tels que le texte, l’audio, les images fixes, l’animation, la vidéo, le multimédia et les fichiers appartenant à des pages Web. Il ne nécessite aucun balisage ou style de présentation supplémentaire pour relayer pleinement son message.
  • La structure est le nom donné à la pratique consistant à utiliser le HTML dans le contenu pour transmettre de la substance, et aussi pour définir comment les blocs d’informations sont structurés les uns par rapport aux autres. Exemples: « Ceci est une liste », (i, d, k), « Ceci est un titre et un sous-titre », (<h1>, <h2>,…, <h6>), « Cette section est liée à, » (<a>), etc.
  • La présentation du style fait référence à tout ce qui concerne la façon dont le contenu et la structure sont présentés. Les exemples incluent la taille, la couleur, les marges, les bordures, la disposition, l’emplacement, etc.
  • Le comportement ou l’interactivité est la mise en œuvre d’un script côté client pour générer un flux d’informations bidirectionnel entre la page Web et ses utilisateurs. JavaScript en est un exemple.

La plupart du temps, il est difficile de distinguer clairement le contenu de la structure. Par exemple, la balise <img>, en tant qu’élément structurel, est utilisée pour produire du contenu graphique. En pratique, la composition d’une page Web peut simplement être considérée comme un mélange de trois éléments: la structure, la présentation et le comportement.

Les termes suivants sont souvent utilisés en correspondance les uns avec les autres: séparation du contenu et de la présentation, séparation du sens et de la présentation, et séparation de la structure et de la présentation. Néanmoins, tous ces termes font essentiellement référence à la séparation du contenu (qui est rendue significative par la structure et la présentation), ou reconnaissent simplement la séparation de la structure (HTML) et de la présentation (CSS) d’une page Web donnée.

L’objectif principal de HTML 4.01 est la séparation de la structure et de la présentation, comme spécifié dans la section 2.4.1 de HTML 4.01.