Informations générales

Logiciel
HTML - CSS
Référence du Module
IN-WE-DEV-HTML-001
Durée
4,0  Jour(s)
Objectifs
  • Concevoir et développer des applications Web en HTML et CSS
  • Rendre plus attractives des pages Web en utilisant CSS
  • Réaliser un site Web " responsive "
Formule
Présentiel ou distanciel
Public
  • Toute personne souhaitant apprendre à développer des applications Web en HTML
Prérequis
  • Avoir les connaissances de base du Web
Programme
  • Préparer l'environnement de développement
    • Comprendre ce qu’est le « World Wide Web » ? - Clients et serveurs web
    • Comprendre les Adresses IP et la résolution des noms - Serveurs et ports
    • Gérer le client, le serveur et l’éditeur sur la machine de développement
    • Créer un premier fichier « index.html »
    • Vérifier le fonctionnement via le navigateur web
  • Réaliser un site web fondamental
    • Définir HTML - CSS et langages de programmation
    • Modifier le fichier « index.html » 
    • Intégrer des titres et sous-titres dans le code HTML
    • Structurer le contenu « texte »  en paragraphes dans le code HTML
    • Ajouter des commentaires  - des listes dans le code HTML
    • Créer un dossier spécifique pour les images
    • Différencier images bitmap et images vectorielles
    • Vérifier le compatibilité avec les navigateurs web
    • Différencier chemins absolus et chemins relatifs
    • Intégrer des images dans le code HTML
    • Modifier la taille et la résolution des images avec « Gimp »
    • Rogner une image selon une zone de sélection avec « Gimp »
    • Vérifier la compatibilité des « codecs audio » avec les navigateurs
    • Créer un dossier spécifique pour les fichiers audio
    • Intégrer des fichiers audio dans le code HTML
    • Analyser les « attributs »  disponibles avec la balise <audio>
    • Vérifier la compatibilité des « codecs vidéo »  avec les navigateurs
    • Créer un dossier spécifique pour les fichiers vidéo
    • Intégrer des fichiers vidéo dans le code HTML
    • Analyser les « attributs » disponibles avec la balise < video >
    • Intégrer des hyperliens dans le code HTML
    • Créer des pages supplémentaires pour notre site
    • Accéder aux différentes pages via leur URL
    • Créer un menu de navigation dans le code HTML
  • Gérer le style avec CSS
    • Découvrir les couleurs primaires et le système RGB
    • Construire une page web = HTML + CSS
    • Ajouter du code CSS à l'intérieur d'une balise HTML - du document HTML
    • Créer un dossier spécifique pour les fichiers CSS
    • Utiliser un fichier « global.css » pour le style global
    • Créer un lien vers le fichier global.css dans le code HTML
    • Utiliser les variables CSS et de noms de couleurs
    • Créer un dossier spécifique pour les fichiers de polices de caractères
    • Ajouter des polices de caractères dans le code CSS
    • Gérer la couleur de texte et la priorité entre les polices dans le code CSS
    • Compléter le style des titres <h1> à <h2> dans le code CSS
    • Ajouter des classes dans le code CSS
    • Modifier la balise <ol> - <ul> dans le code HTML
    • Ajuster les balises <audio> et <video> dans le code CSS
    • Utiliser le modèle de Boîtes CSS
    • Découvrir HTML5 et les éléments sémantiques
    • Calculer la taille des boîtes standards - Modèle alternatif de boîte CSS
    • Modifier les propriétés CSS « max-width »  et « float »
    • Gérer la partie <header> dans le code HTML - dans le code CSS
    • Gérer un formulaire de contact
    • Gérer du code source avec GIT
  • Réaliser un site web « responsive »
    • Créer une mise en page moderne avec le module CSS « FlexBox »
    • Adapter le code CSS pour la démo « Flex Direction » - « Justify Content »
    • - « Align Items » - « Flex Grow » - « Align Self »
    • Réorganiser les blocs principaux avec FlexBox
    • Gérer le CSS adaptative avec les Media Queries
    • Démontrer les breakpoints avec les Media Queries
    • Gérer le bloc <header> - central - <aside> avec les Media Queries
    • Gérer les polices de caractères - des images avec les Media Queries
    • Adapter le code HTML du formulaire de contact
    • Gérer le formulaire de contact avec les Media Queries
    • Gérer du code avec GIT
Prochaines sessions

Je suis intéressé par cette formation

Vous êtes:

Recherche

Où nous trouver

nos centres de formation

 

Cartes centres de formations Easy-Pro

Bruxelles

  • BRUSSELS CITY STEPHANIE SQUARE

    Avenue Louise, 65
    1050 Bruxelles
    Belgique

Liège

  • BUSINESS PARK - Liège Airport

    Rue de l'aéroport, 50
    4460 Grâce-Hollogne
    Belgique

Charleroi

  • CEME

    Rue des Français, 147
    6020 Charleroi
    Belgique

Marche-en-Famenne

  • CENTRE DE SUPPORT TÉLÉMATIQUE

    Rue des Carmes, 22
    6900 Marche-en-Famenne
    Belgique

Namur

  • CREAGORA

    Rue de Fernelmont, 40
    5020 Namur
    Belgique

Tournai

  • SKYLAB Factory

    Avenue de Maire, 44
    7500 Tournai
    Belgique

Louvain-La-Neuve

  • UNION WALLONNE DES ENTREPRISES

    Rue de Rodeuhaie, 1
    1348 LOUVAIN-LA-NEUVE
    Belgique

Besoin d'un devis?