Pourquoi connaître le langage HTML ?

Pour créer un site Internet, le langage universel est le HTML (HyperText Markup Language) langage de balises permettant de mettre en forme les pages.

Cela peut paraître inutile avec WordPress, que l’on peut utiliser sans toucher à une seule ligne de code.
Il sera cependant intéressant de comprendre le code généré par cet outil, mais aussi de le rectifier ou le modifier en cas de besoin.
Le HTML est un langage simple dont la maîtrise des bases peut rendre de grands services dans la conception des pages avec un code aussi clair et optimisé que possible.

Le paragraphe ci-dessous en HTML

Dans cet article et les suivants, on trouvera les principes de base, illustrés par quelques exemples concrets.

Pour s’entraîner, on pourra utiliser le Bloc-Notes présent dans l’ordinateur.

Toute page HTML est constituée de balises qui permettent de mettre en forme du texte, d’insérer des images ou des éléments animés, de créer des formulaires, etc.
Les balises sont des mots anglais, mais ça reste assez simple !

Les balises HTML sont constituées de code inséré entre les signes < et > :
par exemple une page HTML commence toujours par la balise ouvrante <html> afin d’indiquer au navigateur Internet (Chrome, Firefox, Edge…) qu’il s’agit d’une page Web,
et se termine par la balise fermante </html>.

La plupart des balises ouvrantes doivent être suivies de la balise fermante correspondante mais il existe quelques exceptions appelées balises orphelines.

Exercice 1 : créer une page très simple

  1. Ouvrir le Bloc-Notes
  2. Saisir le texte ci-contre

Les balises <head> </head> gèrent l’en-tête de la page et notamment le titre (ce qui apparaît dans l’onglet du navigateur).
Les balises <body> </body> représentent le corps de la page (son contenu).

Ne pas oublier les balises fermantes !

À l’exception de <html> et </html> qui encadrent la page,
le placement des différentes balises est primordial :
la première balise fermante doit correspondre à la dernière balise ouvrante non fermée
(exemple <head> ; <title> ; </title> ; </head>).

Enregistrer au format exercice-1.html
Double-clic sur le fichier : la page s’ouvre dans le navigateur

Dans le prochain article, cette première page sera un peu améliorée…

Partagez !

Les commentaires sont fermés.