Web Design

Html5 & Css3, créer les pages web interactives

Objectifs pédagogiques

À l’issue de ce programme, vous maîtriserez la conception de pages web modernes grâce à l’emploi d’HTML5 et de CSS3. Vous acquerrez les compétences nécessaires pour organiser vos contenus en utilisant les éléments et balises propres à HTML5, tout en appliquant les méthodes de mise en page offertes par CSS3. Ces techniques vous permettront de créer des interfaces esthétiques, réactives et optimisées pour l’ensemble des dispositifs numériques.

Public concerné

Développeurs, responsables de projets web ainsi que toute personne impliquée dans la création et la maintenance de sites internet via un système de gestion de contenu (CMS).

Prérequis

Connaissances de base en HTML et CSS.

Accessibilité

Les formations sont accessibles aux personnes en situation de handicap.
Un accompagnement spécifique peut être mis en place après étude des besoins.

Modalités d'évaluation

Le formateur évaluera la progression des participants à l’aide de méthodes telles que des QCM, des mises en situation et des activités pratiques. Les participants passeront également un test de compétences avant et après la formation afin de vérifier l’acquisition de ces compétences.

1) Introduction
• Distinctions fondamentales entre HTML et CSS.
• Évolutions apportées par les versions HTML5 et CSS3.
• Présentation des outils de développement.

2) Balises HTML fondamentales
• Structure d’un document HTML : éléments <doctype>, <html>, <head>, <body>.
• Concepts de balises et d’attributs.
• Balises d’en-tête : <title> et <meta>.
• Intégration de feuilles de style et de scripts : <link> et <script>.
• Balises de mise en forme textuelle : titres, paragraphes, citations.
• éléments de mise en valeur sémantique (<strong>, <em>, <mark>).
• Liens hypertextes : balise <a>.
• Gestion des images : <img>, <figure>, <figcaption>.
• Création de listes : <ul> et <ol>.
• Construction de tableaux : <table>, <tr>, <th>, <td>.
• Balises génériques <div> et <span>.
• Balises sémantiques : <nav>, <section>, <article>, <aside>, <header> et <footer>.
• Recommandations essentielles pour l’accessibilité (référentiels WCAG/RGAA) : attributs
alt, scope, etc.

3) Intégration de contenus multimédias
• Utilisation des iframes.
• Intégration de vidéos et de fichiers audio.
• Prise en compte de l’accessibilité des médias (compatibilité, sous-titrage, navigation au
clavier, etc.).

4) Sélecteurs et propriétés CSS fondamentaux
• Structure d’une règle CSS.
• Différents types de sélecteurs.
• Utilisation des pseudo-classes.
• Définition des couleurs.
• Propriétés relatives aux arrière-plans.
• Propriétés communes : dimensions, bordures, marges et espacements internes.
• Propriétés de mise en forme du texte : couleur, alignement, police, décoration, graisse,
taille.
• Unités de mesure : px, em, rem, vw, vh.
• Effets avancés : ombres, dégradés, texte en colonnes, bordures arrondies.

5) Techniques de positionnement en CSS
• Positionnement statique.
• Propriété `display`.
• Positionnements relatif, absolu et fixe.
• Propriétés `float` et `clear`.
• Modèles de mise en page Flexbox et Grid Layout.

6) Introduction au Responsive Design
• Dimensionnement avec des unités flexibles.
• Notion de viewport.
• Utilisation des media queries.
• Alternative : système de grille CSS.

7) Création de formulaires
• Éléments de formulaire : `<form>`, `<input>`, `<textarea>`, `<select>`, `<option>`.
• Labels et leur association aux champs.
• Améliorations HTML5 pour les formulaires : nouveaux types de champs et attributs.
• Validation native via HTML (types et attributs).
• Configuration de l’envoi : méthodes GET/POST, attribut `action`.
• Bonnes pratiques HTML pour la sécurité (OWASP, ANSSI).
• Recommandations HTML pour l’accessibilité (WCAG/RGAA).

8) Animations avec CSS3
• Transformations (rotation, translation, mise à l’échelle, déformation).
• Effets de transition.
• Création d’animations.
• Respect des préférences utilisateur (`prefers-reduced-motion`).

L’accès à la formation s’effectue après :
  • une prise de contact via le formulaire d’inscription ou par e-mail,
  • une analyse du besoin et du niveau du participant (audit réaliser par téléphone ou visio),
  • la validation de l’inscription par l’organisme de formation.

L’inscription est réputée acquise dès lors que l’audit téléphonique est réalisé, que le devis et la convention soient signés. Un délai minimum obligatoire de 11 jours ouvrés entre la validation de l’inscription et la date théorique d’entrée en formation du stagiaire.

Cours pratique en présentiel ou à distance, dans nos locaux.

Tarif : 1000€ H.T.
uniquement par virement bancaire

3 jours soit 21 heures
Café, thé, chocolat chaud & viennoiseries sont offerts.

Dates :
– du 20/05/26 au 22/05/26 (en présentiel)
– du 22/06/26 au 24/06/26 (à distance)

Formation dans nos ou vos locaux, à distance ou sur mesure.

Dans la même catégorie

Autres formations

Webflow, créer des sites sans être informaticien

Web Design

Sharepoint, utilisateur/contributeur

Web Design

WordPress, gérer un site web d’entreprise

Web Design

Sharepoint, concepteur

Web Design