Programme_HTML_CSS
Programme_HTML_CSS
site internet)
Méthode pédagogique :
Selon les préférences du stagiaire, la formation peut s’effectuer : par téléphone, par webconference
et/ou en présentiel.
Objectifs de la formation :
Créer des sites responsives.
Maîtriser les bonnes pratiques de programmation HTML CSS.
Développer des interfaces en HTML 5 / CSS.
Préparer le référencement naturel.
Prérequis :
Avoir déjà développé ou participé au développement d’une application professionnelle et avoir une
pratique d’un langage de programmation.
Une évaluation initiale est formalisée par un document en début de formation par le formateur. Ce
document est communiqué au stagiaire et au responsable formation de l'entreprise.
Le formateur s'adapte au besoin et au niveau de l'apprenant grâce à l'évaluation initiale et à la
progression de l'apprenant.
Public :
C’est une solution simple et pédagogiquement optimum pour des populations dispersées, mobiles ou
en recherche de réponses spécifiques.
Inscriptions :
Aucune session spécifique - Entrées et sorties permanentes, sur demande.
Lieu de formation :
Selon la méthode pédagogique choisie, la formation peut se dérouler au domicile du stagiaire, dans
les locaux de l’entreprise ou encore dans un lieu mis à disposition de l’entreprise.
Jeux de rôles, travail sur documents professionnels, exercices de grammaire, études de cas, le temps
estimé pour réaliser ces travaux est de 30 min max en inter session.
Certifications proposées :
TOSA, ENI, ICDL…
Le programme présenté est général suivant les thèmes abordés. Chacune de nos formations est
personnalisée en fonction de vos besoins.
• Qu’est-ce HTML5 ?
• Qu’est-ce CSS3 ?
• Le contenu : titrage et paragraphe
• Balises de titres et de paragraphes (<h1>, … <h6>, <p>)
• Premières décorations CSS : color et background-color
• Alignements de contenus : text-align
• Formats de couleurs (hexadécimal, mots-clés)
• Familles de polices avec et sans empattements : font-family
• Les liens :
• Créer un lien vers une autre page avec l’élément et son attribut href
• Souligner (ou pas) un lien : text-decoration
• Appliquer des marges (internes et externes)
• Introduction au Modèle de Boîte en CSS
• Appliquer une marge sous ou sur un élément
• Les listes :
• Créer une liste d’éléments : <ul> et <li>
• Les puces par défaut et personnalisées
• Vue d’ensemble des tags HTML
• Les composants
• Qu’est-ce qu’un composant ?
• Deviner les composants d’après la maquette
• Mon premier composant : le bouton (avec bordures, notions de flux et pseudo-classes)
• Le composant navigation (avec notion d’héritage et les sélecteurs CSS)
• Les composants du pied de page
• Le bloc info (avec le modèle de boîte suite et fin, width, height, box-sizing)
• Le Composant « Card » (éléments HTML)
• Le Composant de formulaire de contact (éléments HTML du formulaire)
• Qu’est-ce que le Responsive Web Design ?
• Les points de rupture
• Le viewport
• Les CSS Media Queries
• Centrer le contenu dans la page
• Avec les propriétés CSS width et les marges automatiques
• Ajout d’éléments neutres (<div> )
• Les priorités en CSS
• Le modèle Flexbox
• Comment fonctionne Flexbox ?
• Où a-t-on besoin d’appliquer Flexbox sur la maquette ?
• Application pratique : composants « Séjours », « nav » et « footer »
• Le modèle Flexbox
• Comment fonctionne Flexbox ?
• Où a-t-on besoin d’appliquer Flexbox sur la maquette ?
• Application pratique : composants « Séjours », « nav » et « footer »
• Positionnement flottant
• La propriété float
• Les tableaux de données
• Une grille d’éléments (composant “Destinations”)
• Le futur de CSS avec Grid Layout
• Qu’est-ce-que Grid Layout ? (Principes, support, application)
• Composant “Destinations” en Grid Layout
• Les standards
• Votre code passera-t-il au validateur ?
• Notions d’entités HTML
• Les Framework html 5 et CSS
• BOOTSTRAP
• SKELETON
• KICKSTART
• KNACCSS 5(fr)