Semaine 1 : Introduction à XHTML, Structure de base et syntaxe

Objectifs : Introduction à XHTML, balises de base, structure d'un document XHTML valide.

Jour 1 (6h) : Introduction à XHTML

 Théorie :

o Qu'est-ce que XHTML et ses différences avec HTML ?

o Syntaxe XML et son importance dans XHTML.

o Structure de base d'un document XHTML (Déclaration, html, head, body).

o Les balises de structure : div, span, p, h1 à h6, a, ul, ol, li.

 Exercices :

1. Créer une page XHTML avec la structure de base.

2. Ajouter un titre, une description, et une liste d'éléments dans le corps de la

page.

3. Créer des liens et des images dans une page XHTML.

Jour 2 (6h) : Formulaires et Tables en XHTML

 Théorie :

o Utilisation des formulaires (form, input, textarea, select).

o Création et utilisation des tables (table, tr, td, th).

o Attributs des balises input (type, name, value, etc.).

 Exercices :

1. Créer un formulaire de contact avec des champs pour le nom, l'email et le

message.

2. Créer une table avec des données structurées (par exemple, liste d'articles
avec nom, prix, et description).

3. Ajouter un formulaire de recherche avec un champ de texte et un bouton de

soumission.

Semaine 2 : Introduction au CSS - Mise en forme basique

Objectifs : Introduction au CSS, sélection de balises, mise en forme des éléments.

Jour 3 (6h) : Introduction à CSS

 Théorie :

o Introduction au CSS et à son utilisation dans un fichier externe.

o Sélecteurs CSS : élément, classe, id.

o Propriétés CSS : color, background-color, font-family, font-size, margin,

padding.

 Exercices :

1. Appliquer une couleur d'arrière-plan à la page.

2. Styliser un texte en utilisant différentes propriétés (color, font-size, font-

weight).

3. Modifier la couleur de fond des cellules d'un tableau.

Jour 4 (6h) : Mise en page avancée avec CSS

 Théorie :

o Positionnement des éléments : static, relative, absolute, fixed.

o Modèle de boîte CSS (box-model).

o Flexbox : présentation des conteneurs flexibles.

 Exercices :

1. Créer une mise en page de base avec une barre de navigation en haut et une
section de contenu principale en dessous.

2. Créer une mise en page responsive en utilisant Flexbox (par exemple, une
grille d'articles).

3. Utiliser position pour superposer du contenu, par exemple, une boîte modale.

Semaine 3 : Techniques avancées en CSS

Objectifs : Mise en page avancée, animations CSS.

Jour 5 (6h) : Animations et transitions CSS

 Théorie :

o Introduction aux animations CSS (@keyframes).

 o Transitions CSS pour les effets interactifs.

 Exercices :

1. Créer un bouton avec un effet de survol (hover) qui change de couleur.

2. Ajouter une animation pour faire apparaître un élément en fondu.

3. Animer un logo pour le faire tourner avec une animation CSS.

Jour 6 (6h) : Responsive Design avec Media Queries

 Théorie :

o Introduction aux Media Queries.

o Création d'un design responsive.

 Exercices :

1. Créer un design mobile-first qui ajuste la taille du texte et des images en

fonction de la largeur de l'écran.

2. Créer un menu de navigation qui devient un menu hamburger sur les petits
écrans.

3. Créer une grille responsive avec des images de différentes tailles.

Semaine 4 : Introduction à PHP

Objectifs : Introduction à PHP, traitement de formulaires et variables.

Jour 7 (6h) : Introduction à PHP et Variables

 Théorie :

o Qu'est-ce que PHP ? Intégration de PHP dans un fichier HTML.

o Variables et types de données en PHP.

o Structures conditionnelles (if, else).

 Exercices :

1. Créer un script PHP qui affiche un message personnalisé en fonction de

l'heure de la journée.

2. Créer un formulaire PHP qui récupère et affiche les valeurs des champs (nom,
email).

Jour 8 (6h) : Formulaires et Gestion des Données en PHP

  Théorie :

o Récupérer les données d'un formulaire avec $_POST et $_GET.

o Validation des données soumises.

 Exercices :

1. Créer un formulaire de contact qui envoie les données via POST et affiche un
message de confirmation.

2. Ajouter une vérification pour s'assurer que le champ email contient une
adresse email valide.

Semaine 5 : Bases de données avec PHP et MySQL

Objectifs : Introduction à la gestion des bases de données avec PHP.

Jour 9 (6h) : Connexion à une base de données MySQL avec PHP

 Théorie :

o Introduction à MySQL et à l’utilisation de mysqli ou PDO en PHP.

o Créer une base de données et une table en MySQL.

 Exercices :

1. Créer une base de données simple avec une table utilisateurs (id, nom, email).

2. Créer un script PHP qui se connecte à la base de données et affiche les

utilisateurs.

Jour 10 (6h) : Insertion et Mise à jour dans la base de données

 Théorie :

o Insérer des données dans une base de données avec INSERT.

o Mise à jour des données avec UPDATE.

 Exercices :

1. Créer un formulaire permettant d'ajouter un utilisateur à la base de données.

2. Créer une page qui permet de modifier un utilisateur dans la base de

données.

Semaine 6 : PHP avancé et intégration complète

Objectifs : Gérer des sessions, des cookies, et intégrer des fonctionnalités avancées en PHP.

Jour 11 (6h) : Sessions et Cookies en PHP

 Théorie :

o Utilisation des sessions pour gérer les utilisateurs connectés.

o Création et gestion des cookies en PHP.

 Exercices :

1. Créer une page de connexion avec gestion de session.

2. Créer un panier d'achats simple utilisant les sessions pour stocker les articles.

Jour 12 (6h) : Projet de fin de cours

 Exercice :

o Créer un site web complet (page d'accueil, page de connexion, page de

contact) utilisant XHTML pour la structure, CSS pour la mise en forme, et PHP
pour la gestion des formulaires et de la base de données.

o Ajouter une fonctionnalité de login sécurisé avec sessions PHP et affichage

dynamique des utilisateurs.