Formation HTML5, CSS3, l’essentiel

Objectif opérationnel :

L’objectif de cette formation est de créer des pages web interactives grâce au langage HTML et aux feuilles de style CSS.

Objectifs pédagogiques :

• Connaître la structure d’une page Web et ses composants (balises, texte, images, formulaires, listes, hyperliens…)
• Écrire des scripts serveurs simples avec PHP
• Utiliser des feuilles de style CSS
• Insérer du code JavaScript et HTML

Cette formation HTML et CSS s’adresse à toute personne ayant à réaliser des pages HTML.

Pour suivre cette formation HTML et CSS, les participants doivent connaître le fonctionnement d’un naviGustur et maîtriser l’environnement micro-informatique.

Rappels du fonctionnement d’un serveur Web et du dialogue NaviGustur/Serveur Web

• Présentation de l’URL et localisation d’un document Le protocole HTTP Les autres protocoles tels que FTP, TELNET, etc…

Le format des documents

• Le format HTML Les différents types de format Les formats texte, image, vidéo

Présentation du protocole http

• Principe du protocole Les différents types de requêtes (GET, POST, etc..)

Généralités du HTML

• Structure type d’une page HTML Format des commandes Exemple de message

Structure d’un document HTML

• Les balises principales HTML L’instruction !DOCTYPE Les balises BDO, INS et DEL

L’en-tête HTML

• la balise META La reconnaissance par les moteurs de recherche

Les styles de Paragraphe

• Les en-têtes de paragraphe Les sauts de paragraphe Formatage des textes Les balises DIV et SPAN Le formatage des textes par balises Les séparateurs graphiques Exemples

Les hyperliens

• Les liens hypertexte Les autres types de liens

Les listes

• Les listes à puce Les listes numérotées Les listes de définition Les listes de menu et répertoire Les listes imbriquées Exemples

Travaux pratiques
Mise en oeuvre des techniques acquises

Les styles

• les styles physiques les caractères Les caractères accentués Les styles logiques Les modifications de fonte : BASEFONT Les balises FONT Exemples

Les images et les couleurs

• L’insertion d’images Les formats GIF, JPEG, PNG La balise IMG La balise OBJECT et PARAM Le fond d’écran Les images de fond

Les images réactives

• Définition d’une image réactive Les coordonnées Les server-side imagemap (zones sensibles) Les client-side imagemap

Les tables

• Définir une table Les balises de définition de table et leurs attributs TABLE, TH, TR, TD, etc…

Les formulaires

• Définition d’un formulaire La balise INPUT La balise SELECT La balise TEXTAREA La balise BUTTON La balise FIELDSET

Travaux pratiques
Réalisation de divers formulaires

Notions de PHP

• Définition des scripts CGI Présentation du langage PHP Principes du langage PHP Les fonctions PHP Ecriture de scripts pour les formulaires Envoyer un e-mail à partir d’un formulaire PHP

Travaux pratiques
Exemple de script PHP

Les feuilles de style CSS

• Présentation des feuilles de style Définition d’un style La balise LINK La notion de cascade Les attributs des styles exemples de feuilles de style

Travaux pratiques
Utilisation des feuilles CSS

Les calques

• Présentation et définition des calques Mise en place des calques avec les feuilles de style Utilisation des balises DIV et SPAN Les layers La balise ILAYER et NOLAYER

JavaScript : intégration de scripts

• Présentation de JavaScript La balise SCRIPT Les attributs événementiels Masquer le script JAVASCRIPT La balise NOSCRIPT

Travaux pratiques
Insertion de code JavaScript
Intégration de scripts DHTML (Dynamic HTML)

Quelle que soit la technologie que vous utilisiez, ou que vous allez utiliser, le langage HTML est un passage obligé. En effet, JAVA, .NET, PHP ou autre langage ou architecture, en dernier ressort, génèrent du HTML. C’est dire l’importance de ce langage et la nécessité de la connaître.

Au cours de cette formation HTML, vous allez apprendre à décrire et réaliser des pages Web comprenant du texte mis en forme et structuré, des images, des formulaires. Le multifenêtrage sera également couvert, les hyperliens, ainsi qu’une introduction aux scripts serveur de type PHP. L’insertion de code javascript ainsi que DHTML sera également couverte.