HTML & CSS : la base du Web

Jean-Marc Lecarpentier

 

HTML & CSS : la base du Web

Le projet SGML (Standard Generalized Markup Language) dans les années 70 a inauguré tout un courant de réflexion qui cherche à distinguer le contenu des documents de leur mise en forme. Destiné aux éditeurs pour permettre de ré-utiliser la saisie typographique (sur photocomposeuse) pour des éditions diverses (grand format, poche, extraits magazine, ... puis plus tard éditions électronique), SGML n'était pas adapté à la présentation directe sur écrans, ni surtout au bourgeonnement inventif lié à la mise en pages web de millions de documents
HTML (HyperText Markup Language) a permis l'explosion du web grâce à sa grande simplicité. La connaissance se transférait par simple analyse du travail des autres concepteurs (la « culture de la rue »... électronique évidemment). HTML est adapté à la présentation de documents interconnectés sur un écran. Pour l'enregistrement, la circulation et la sauvegarde des données elles-mêmes, le format XML (eXtended Markup Language) a fixé des règles pour un cadre de travail évolutif, permettant le travail d'échange de données, notamment entre entreprises (B2B -- Business To Business).
Les « feuilles de style » permettent de transformer un document balisé en diverses présentations (écran, impression, ...). L'encodage des caractères UTF-8 permet l'internationalisation des documents électroniques.

Travail personnel

Objectifs

Cette première séance de TD/TP est essentielle puisque l'on met en place l'environnement de travail que l'on utilisera tout au long des TP et les outils de base de la création web (HTML, CSS) ainsi que les bases du développement web avec la création et la validation de pages.

Mise en place de l'environnement de travail

Installer l'extension Firebug pour Firefox : http://getfirebug.com/. Activer les différentes fonctionnalités de Firebug et explorez les menus en inspectant divers sites.

Première page HTML

Il s'agit de réaliser une page HTML + CSS qui ressemble au mieux au modèle. Les images et le texte sont fournis dans cette archive.

Vous devez obtenir des fichiers valides qui sont acceptés par le validateur du W3C

Structure de page et HTML5

Utiliser le contenu de la page Wikipedia sur l'America's Cup (sans le menu gauche) pour créer une page utilisant les éléments HTML5 de structuration (article, section, nav, aside, figure, etc).

Attention le document DOIT être validé avant de poursuivre

Ajouter du style CSS pour mettre en forme le document.

 
Tim Berners Lee, créateur de HTTP et HTML. A l'origine du Web, il dirige maintenant le W3C C'est avec Mosaic, premier navigateur graphique que le web pris réellement son essor en 1993
 
Fermer