HTML Programmation (Basics)

Aujourd’hui, les technologies web prennent une place prépondérante dans notre vie quotidienne. Le web, selon nous, remplacera sûrement le livre physique tel qu’on le connaît et la formation telle qu’on la vie aujourd’hui. Il devient donc important d’être en mesure de participer à la création de pages web et de comprendre comment elle sont construites. Cette formation introduit le participant à des technologies qui lui permettront de créer et de styliser ses propres pages web.

Upcoming session

No date suits you?

Notify me when a session is added.

  • Duration: 3 days
  • Regular price: $1,410
  • Preferential price: $1,290
  • Course material included

Course outline

Module 1 : HTML5 et CSS3 - Une introduction

Langues d'enseignement

Cette formation peut être diffusée en français ou en anglais

Préalables

Aucune connaissance particulière n’est nécessaire pour suivre cette formation.

Méthode pédagogique
Cette formation contient plusieurs exercices de création de pages web.
Cette formation utilise plusieurs stratégies d'apprentissage dont:
  • Présentations théoriques;
  • Démonstrations;
  • Des ateliers pratiques et des exercices;
  • Des défis;
  • Des échanges.
Matériel inclu :
Manuel théorique, exercices et ateliers pratiques

Objectifs

Après cette formation, le participant devrait être en mesure de pouvoir travailler sur les éléments suivants :
  • HTML
  • CSS
  • Tableaux
  • Formulaires
  • Images
  • Listes

Contenu

Introduction
  • Présenter comment fonctionne le web
  • Présenter les rôles du client (navigateur web) et du serveur (serveur web)
  • Présenter comment est servie une page web Statique
  • Présenter ce que sont les technologies HTML5 et CSS3
  • Présenter comment est servie une page web dynamique
  • Ajouter de la vie dans la partie cliente au moyen de JavaScript
Créer une première page web
  • Choisir un éditeur
  • Présenter la structure ce base d'une page web
    - Sélectionner un standard pour notre page web (doctype)
  • Construire une page modèle de base
  • Styliser notre modèle de base
  • Déployer ses pages web auprès d’un serveur web pour les visualiser dans un navigateur
  • Présenter la notion d’URL
  • Visualiser d’une page web au moyen d'un navigateur client
  • Visualiser le code de la page web présente dans le navigateur web
Construire un site web adaptatif - responsive
  • Définir un site web adaptatif
  • Identifier pourquoi on devrait toujours construire des sites web adaptatifs
Présenter la structure de base d'une page web
  • Présenter la structure de base d'une page web
  • Construire une première page web
Présenter la structure de base de la syntaxe HTML
  • Présenter la structure des balises HTML et comment bien les utiliser
  • Ajouter des attributs aux balises HTML
  • Ajouter des commentaires dans une page Web pour commenter ou pour soustraire temporairement une section de code HTML de notre page web
  • Utiliser l'indentation du code pour rendre le code HTML plus simple à lire et à maintenir
Présenter la structure de base de la syntaxe CSS
  • Présenter la structure de base et les composants des règles de styles CSS
  • Présenter les notions de sélecteur, propriété et valeur
Tester et valider nos pages web
  • Tester une page web au fur et à mesure
  • Valider le code HTML avec un validateur reconnu
  • Corriger les erreurs
Paramétrer la section entête d'une page web
  • Ajouter un titre à la page
  • Assigner une icône favicon à notre page
  • Ajouter des métadonnées
Ajouter du contenu à la section body d'une page web
  • Présenter les différents éléments HTML simples et les utiliser
    - Balises titres et textes
    - Balises pour créer des liens
Ajouter du Style à notre code HTML
  • Présenter les méthodes pour ajouter du style à une page web
  • Utiliser des rustines pour ajouter de la compatibilité entre navigateurs
  • Utiliser les classes et les ID pour structurer nos styles
Styliser nos pages webs avec CSS
  • Ajuster les grandeurs des éléments HTML
  • Présenter les différents unités de mesure disponibles
  • Ajuster la couleur des éléments HTML
  • Assigner des styles à des balises HTML
  • Assigner des styles à des combinaisons de balises HTML
  • Assigner des styles via des attributs, des classes et des ids
  • Présenter les pseudo-classes et pseudo-éléments
  • Comprendre la notion de cascade dans les styles
  • Utiliser la console de développeur de Chrome pour identifier d'où provient les styles appliqués
  • Choisir une police de caractères
  • Ajouter du texte et le styliser
Disposer les éléments HTML avec CSS
  • Présenter le modèle de boîte utilisé pour positionner les éléments HTML
  • Ajuster les différents paramètres de la boîte contenant un élément HTML
  • Ajuster l'espace entre les éléments HTML
  • Ajouter des bordures et un fond à un élément HTML
Structurer nos pages web au moyen de colonnes, et autres
  • Positionner les éléments au moyen de float
  • Utiliser les marges
  • Présenter différentes méthodes de positionnement
Travailler avec des listes et des liens
  • Présenter les différentes listes disponibles
  • Construire des liste à un ou plusieurs niveaux d'imbrication
  • Ajuster le format des listes
  • Créer des liens pour naviguer
  • Créer un menu ou barre de navigation
Construire des pages adaptatives à la surface de visualisation
  • Présenter comment passer d’un design à largeur fixe à celui d’un design fluide
  • Paramétrer le meta viewport de manière à ce que les appareils mobiles soit bien traités
  • Travailler avec la notion de media query de manière à permette à nos pages web de s’ajuster à la surface de présentation disponibles (@media only screen)
Travailler avec des images
  • Choisir un type d’image
  • Inclure une image dans une page web
  • Ajuster la dimension de l’image
  • Positionner l’image
  • Ajouter une légende à l’image
  • Créer un favicon
Travailler avec des tableaux
  • Introduire la terminologie et les balises pour construire un tableaux
  • Ajouter du style à nos tableaux
  • Ajouter une légende à un tableau
  • Fusionner des lignes et des cellules
  • Imbriquer des tableaux
Travailler avec des formulaires
  • Présenter la structure de base d’un formulaire
  • Présenter les champs d’un formulaire et leur codage
  • Disposer les constituants d’un formulaire
  • Valider les données
  • Transmettre les données du formulaire au serveur
Varia (audio et video)

Surround yourself with the best

Pierre-Edouard Brondel
Pierre-Edouard Brondel
Trainer and Desktop Application Consultant
Renowned as an educational expert in the IT and office technology field who has accumulated more than 25 years of experience, Pierre-Édouard is first and foremost passionate about human capital.
Marc Maisonneuve
Marc Maisonneuve
Trainer and Professional Efficiency Consultant
Frédéric Paradis
Frédéric Paradis
Certified Trainer and Cloud Architect
As a certified Microsoft trainer, Frédéric describes himself as a Cloud magician who easily navigates the mythical space between technology and reality.
Luc Labelle
Certified Trainer and IT Consultant
Recognized by his peers as an inspiring coach, trainer, and consultant, Luc is able to transfer his knowledge to benefit his teams.
Be aware of trends, innovations and best practices, every month.
Confidentiality
Training center accredited by Emploi-Québec, Accreditation : 0051460
GST : 141582528 – QST : 1019557738
© 2020 AFI
AFI Expertise

The AFI experience brought to you by Edgenda

At AFI, our focus is to offer you relevant training and impactful learning experiences in line with your transformation approach. Do you need support for your approach? Check out Edgenda’s services: Edgenda.com