Formation HTML / XHTML Nord

• Coder en HTML / XHTML en respectant les standards du web
• Mettre en forme son site avec des feuilles de style CSS

Formation HTML / XHTML / CSS - Le programme

Le matériel et les logiciels

• Ressources nécessaires
• Quel éditeur choisir ?

Éditeur HTML (Freeware)

• Weaverslave
• Notepad ++

Éditeur CSS (Freeware)

• Top Style lite

Structure de base d'un document HTML

• La balise HTML
• La balise HEAD
• La balise BODY

Les meta informations / la balise HEAD

• DOCTYPE
• Les balises TITLE, META, KEYWORD, DESCRIPTION, REFRESH ...
• Quelles sont les balises utiles pour le référencement de votre site web ?

Mettre en forme du texte

• Le formatage du texte
• Les entêtes
• La police, taille, couleur, gras, italique, souligné, centré
• Les listes ordonnées, les listes à puce
• Les espaces insécables, les sauts de ligne ...
• Les paragraphes

Ma première page web

• Utiliser des tableaux ou des calques
• Que choisir ?

Les tableaux (TABLE)

• Insertions de tableaux
• Insertion de lignes et colonnes
• Fusionner, fractionner des lignes et colonnes
• Les principaux attributs
• Développer votre site avec des tableaux

Les calques (DIV)

• Insérer la balise DIV
• Positionner la balise DIV
• Mettre en forme la balise DIV
• Développer un site en utilisant la balise DIV

Les liens hypertexte

• Création de lien hypertexte sur du texte
• Vers un fichier local, vers une page web, vers un serveur ftp
• Création de lien vers messagerie (mailto)
• Création de lien hypertexte sur des images
• Les principaux attributs

Les images

• Insertion d'images
• Les formats d'images du web
• Les contraintes liées aux images
• Les images de fond
• Les principaux attributs

Les médias

• Insertion de flash

Mise en forme avec les feuilles de styles CSS

• Créer une feuille de style CSS
• Attacher une feuille de style à un document
• Créer des règles (Classe, balise)
• Appliquer les styles aux éléments

Les modèles (Templates)

• Créer un modèle
• Créer une région répétée
• Créer une page basée sur un modèle

Les cadres (Obsolète)

• Insertion de cadres
• Gestion de frames
• Les problèmes liés aux frames

Les formulaires

• La balise form
• Champ de texte
• Zone de texte
• Liste déroulante
• Case à cocher
• Boutons radio
• Bouton envoyer, rétablir

Valider votre code source

• Valider votre code XHTML
• Valider vos feuilles de style CSS

Annexes

• Les caractères spéciaux
• Les couleurs du web