Les langages
L’objectif
Nous allons voir quels sont les langages qui permettent de créer des pages web, des exemples simples de syntaxe et leur utilisation dans la conception des sites web.
Le langage HTML
1. L’état des lieux
Le langage HTML est le langage fondateur des sites web. HTML est l’acronyme de HyperText Markup Language, Langage à Balise HyperTexte en français. C’est le langage qui permet de créer les sites web, de décrire leur contenu.
Le langage HTML est actuellement défini par le WHATWG (Web Hypertext Application Technology Working Group) qui est un regroupement de différents acteurs travaillant sur les technologies web. Voici l’adresse web du site du HTML : https://html.spec.whatwg.org/multipage/. Il n’y a pas de version à proprement définie, puisque le travail de ce groupe se veut « vivant » et il évolue régulièrement au fil du temps. Les développeurs web doivent se tenir régulièrement au courant des nouveautés du HTML.
2. Les éléments HTML
Le langage HTML est un langage à balises dont le composant de base est l’élément. Un élément HTML permet d’indiquer quel est le type de contenu que vous souhaitez afficher dans la page web. Les éléments HTML permettent de décrire la structure du contenu des pages web.
Pour tout type de contenu utilisable, il y a un élément HTML dédié. Si vous souhaitez insérer un contenu de type paragraphe, vous devez utiliser l’élément HTML p (p pour paragraphe). Si vous souhaitez insérer une image, utilisez l’élément img (img pour image). Si vous souhaitez insérer un tableau, utilisez l’élément table (table pour tableau).
Les éléments HTML s’écrivent avec une syntaxe à balises. Pour la plupart des éléments HTML, vous avez une balise d’ouverture, un contenu textuel et une balise de fermeture. Prenons un exemple précis. Nous voulons insérer un paragraphe de texte, l’élément HTML est p. Les éléments sont constitués de trois parties :
-
La balise d’ouverture, avec le nom de l’élément encadré par les caractères < et >, <p> dans notre exemple.
-
Le contenu texte.
-
La balise de fermeture, avec le nom de l’élément précédé par le caractère / et encadré...
Les CSS
1. L’état des lieux
Avant 1999, quand un designer de sites web voulait effectuer la mise en forme et la mise en page de ses créations web, il devait le faire dans le code HTML. C’est-à-dire qu’il fallait « mélanger » la description du contenu et la mise en forme, le tout dans un joyeux fatras ! Ceci ne facilitait pas les mises à jour des mises en forme et des mises en page.
Avec le HTML 4, en décembre 1996, sont apparues les CSS, les Cascading Style Sheets, ou feuilles de style en cascade dans la langue de Molière. Les CCS sont édités par le W3C (https://www.w3.org) qui un est consortium de différents acteurs du web et qui fut à l’origine du HTML.
Les feuilles de style ont pour objectif de séparer la description du contenu qui incombe au HTML, de la mise en forme et de la mise en page. Nous avons ainsi deux langages avec des rôles bien définis, bien distincts. Actuellement, ce sont les CSS 3 qui prévalent.
Les CSS3 fonctionnent avec des modules spécialisés. Nous n’avons plus une seule et « énorme » norme, mais plusieurs dizaines de modules qui évoluent indépendamment les uns des autres.
L’utilisation des feuilles de style CSS présente les avantages suivants :
-
séparation claire entre le contenu, la mise en forme et la mise en page ;
-
possibilités...