HTML et CSS : qui fait quoi?

Le langage HTML (HyperText Markup Language) est un langage de balisage hypertexte utilisé pour décrire la structure des pages web; c'est le langage de publication utilisé sur le web. Alors que le HTML fournit la structure de la page, le CSS est responsable de la présentation, de la mise en page du document.

Le W3C (The World Wide Web Consortium), un organisme fondé en 1994, est officiellement chargé de la normalisation de tout ce qui concerne le web, et en particulier des évolutions du langage HTML et de ses variantes comme les CSS.

Il existe de nombreux ouvrages de référence, des guides en ligne, des tutoriels et des forums spécialisés qui permettent d'apprendre le langage HTML et d'en suivre l'évolution; certains sont mentionnés sur la page La création d'un site web. Vous trouverez par exemple des explications plus détaillées concernant le HTML sur le site Comment ça marche.

Les fichiers HTML

Il existe deux méthodes pour créer des fichiers HTML :

• L'utilisation d'éditeurs visuels (WYSIWYG — What You See Is What You Get — ou éditeur HTML tel-tel, en français) qui permettent de créer des pages web en plaçant des objets et des contrôles, le logiciel se chargeant de créer le code HTML. Cette solution n'exige donc pas l'apprentissage du langage HTML, mais les possibilités offertes demeurent parfois limitées.
• L'apprentissage du langage HTML/CSS et l'édition du code HTML à l'aide d'un éditeur de texte. Cette méthode permet non seulement de développer des pages web beaucoup plus sophistiquées, mais offre aussi un bien meilleur contrôle sur le résultat final.

Le code source

Le code source d'une page web est un ensemble d'instructions originales (le plus souvent du HTML) écrites dans un langage compréhensible par les humains, permettant la lecture et l'affichage par un navigateur web. Le code source de la page correspond donc à l'agencement des lignes de code HTML (texte formaté avec des balises HTML) sous la forme d'un simple fichier texte. Le navigateur interprète ces instructions qui déterminent l'apparence et les fonctionnalités de la page web affichée.

L'affichage du code source

Il est possible de visualiser le code source d'une page web en cliquant, selon le navigateur utilisé, sur le menu « Affichage » ou « Outils », puis en choisissant « Source » ou « Code source de la page », ou « Développement » ou « Outils de développement », puis « Code source de la page »...

On peut aussi simplement faire un clic droit sur la page (c'est-à-dire avec le bouton droit de la souris) et sélectionner l'option correspondante dans le menu contextuel qui apparaît.

Voir la feuille de style d'un site ou d'une page

Si un site ou une page fait appel à une feuille de style externe pour sa mise en forme, il est possible de récupérer celle-ci afin de la consulter. Dans le code source de la page, il faut d'abord repérer la ligne suivante :

<link rel="stylesheet" type="text/css" href="nom_de_fichier.css" />

Il suffit ensuite de modifier l'URL dans la barre d'adresse en ajoutant le nom du fichier avec son extension .css. Si, par exemple, dans le code source du site http://www.maboite.qc.ca/, le nom de la feuille de style était « mise_en_page.css », il faudrait taper dans la barre d'adresse http://www.maboite.qc.ca/mise_en_page.css et faire OK ou Entrée pour afficher la feuille de style en question.

La désactivation du clic droit

Certains webmestres choisissent de désactiver le clic droit afin de bloquer l'accès au code source de leurs pages ou d'empêcher la copie des images. Outre le risque de faire fuir les internautes, il s'agit d'une pratique discutable. D'abord, restreindre l'accès aux ressources va à l'encontre de l'esprit même d'Internet en tant qu'espace de partage et de communauté. Ensuite, une telle décision suppose que l'ensemble du site est une création originale (scripts, code source, images, etc.), sans aucun « emprunt » à d'autres sites ou à d'autres sources. Enfin et surtout, le menu contextuel ouvert par le clic droit ne se limite pas à l'option d'affichage du code source et à l'option de copie des images : empêcher son ouverture, c'est nuire à l'ergonomie du site en rendant indisponibles des options utiles au confort de navigation et en interférant avec les préférences et les habitudes de l'internaute.

En réalité, il s'agit d'une protection illusoire puisque la plupart des scripts qui interdisent le clic droit peuvent être contournés :

• Dans le menu « Affichage»  du navigateur, il suffit de sélectionner « Afficher la source » pour avoir accès au code de la page affichée. Si le site utilise des cadres (frames), les adresses des pages des différents cadres sont accessibles et peuvent ensuite être chargées individuellement.
• Sur les claviers Windows, il est possible d'accéder au menu contextuel avec la touche Menu . Cette touche permet en effet d'afficher le menu contextuel, en remplacement du clic droit de la souris.
• Dans Internet Explorer, Firefox et d'autres navigateurs, il suffit d'ajouter view-source: devant l'adresse URL de la page, puis de faire Entrée ou OK pour voir le code source.
• Il est aussi possible de désactiver temporairement JavaScript dans les options du navigateur pour interdire provisoirement l'exécution des scripts, dont ceux qui empêchent le clic droit.

En ce qui concerne spécifiquement la copie des images, la protection s'avère encore là difficile à assurer. En effet, les images, tout comme les textes, les fichiers JavaScript, les animations Flash, etc., sont enregistrées dans le dossier des fichiers temporaires hors connexion (fichiers Internet temporaires) et donc accessibles comme n'importe quel fichier de l'ordinateur. On peut aussi faire une copie d'écran et, ensuite, utiliser un logiciel graphique pour découper l'image.

Avec Firefox, il est possible d'afficher les « informations sur la page » à partir de la barre de menus et de voir ainsi tous les fichiers qui la composent; il suffit dès lors de sélectionner les fichiers désirés, puis de les enregistrer.

Et ce ne sont là que quelques-unes des façons permettant de contourner les restrictions du clic droit...