À propos du cours
POURQUOI APPRENDRE LE HTML ET LE CSS ?
Que vous vouliez créer un site web , ou utiliser un CMS comme wordpress ou développer des applications web, vous aurez besoin obligatoirement de passer par ces langages ! En effet le Html et le CSS sont exclusifs et n’ont pas de concurrent vous allez donc obligatoirement devoir passer par eux pour effectuer certaines opérations.
Le HTML et le CSS sont deux véritables standards en informatique qui n’ont à l’heure actuelle aucun concurrent.
De plus, les langages HTML et CSS vont se trouver à la base de tout projet web car ils ont un rôle qui les rend incontournables : les navigateurs sont des programmes qui ont été construits pour pouvoir lire du code HTML au départ et qui ne peuvent aujourd’hui lire que du code HTML, CSS et nous allons donc nous appuyer sur ces langages (et sur le HTML en particulier) pour pouvoir afficher nos pages.
En conclusion quel que soit votre projet web (blog, site e-commerce, application mobile, etc.), vous devrez forcément utiliser du HTML et du CSS.
DESCRIPTION DE LA FORMATION
Dans un premier temps, vous apprendrez les bases de ces langages :
- Utiliser un éditeur de code
- Créer votre première page internet
- Apprendre a utiliser les éléments HTML
- Styliser les éléments HTML grâce aux propriétés CSS
- Le concept de boite
Une fois que vous aurez acquis les bases, vous apprendre des fonctionnalités avancées :
- Utiliser les sélecteurs avancés en CSS
- Apprendre les boites flexibles (flexbox)
- Utiliser les grilles (Css layout grid)
- Les pseudo-classes et les pseudo-éléments
- Les transitions et les animations CSS
- Le Responsive Web Design (Média queries)
- Et bien d’autres fonctionnalités
Ensuite, pour mettre en application toutes vos compétences, nous réaliserons un site internet de présentation (adaptable à votre profil), puis nous le publieront en ligne chez un hébergeur gratuit afin de partager votre profil au plus grand nombre sur la toile !
Tous les chapitres sont enregistrés en HD 1080p pour que vous puissiez tout voir clairement pendant le cours. (vous pouvez regarder les previews gratuits.).
Je répondrai personnellement à vos questions si vous en avez, et je fournirai autant d’aide que possible pour vous aider à maîtriser le Html et le CSS.
N’attendez plus et cliquez sur Suivre ce cours en haut à droite. C’est parti !
Qu’allez-vous apprendre ?
- Réaliser un site internet avec le HTML et le CSS
- Apprendre les éléments HTML
- Styliser les éléments Html avec le Css
- Exploiter la sémantique dans vos pages web
- Utiliser les pseudo-classes et les pseudo-éléments
- Maitriser le concept de boite flexible (Flexbox)
- Utiliser les sélecteurs Css
- Utiliser les grilles Css (Grid Layout)
- Publier un site web chez un hébergeur
Contenu du cours
Introduction
-
Pourquoi vous devez apprendre le Html et le Css
10:47
Découverte du Html
-
Comment fonctionne votre navigateur Web
05:47 -
Les bases du langage HTML
16:36 -
Créer votre première page Html
12:35
Apprendre le HTML
-
L’éléments HTML Head
10:47 -
Les éléments textuels
10:58 -
Élément titre
04:35 -
Éléments liste
04:12 -
Les images
13:19 -
Liens hypertextes
15:23 -
Les tableaux
11:18 -
Les médias vidéo et audio
13:15 -
Les commentaires
04:35 -
Envoyer un courrier électronique
02:11 -
Contexte de navigation imbriqué
06:21 -
Conteneur générique div et span
07:41 -
Les formulaires
28:06 -
Validation de code W3C
07:45 -
Inspecteur
12:18
Les bases du CSS
-
Syntaxe du CSS
05:39 -
Comment rédiger du Css dans vos pages Html
09:18 -
Les commentaires
04:18 -
Introduction aux sélecteurs CSS complexes et combinateurs
18:09 -
Les attributs class id et les sélecteurs CSS associés
08:46 -
Feuilles de style en cascade & héritage
15:27 -
Les éléments HTML div et span en CSS
08:57
Mise en forme de texte en CSS
-
Gestion de la police (font-family)
10:29 -
Les propriétés CSS de Police
10:46 -
Les propriétés CSS de Texte
11:46 -
Interlignes et espacements de Texte
03:49 -
Couleur et transparence de Texte
07:19
Concept de boite CSS
-
Les boites en CSS
20:24 -
Les unités de mesures
05:58 -
Largeur minimale et maximale d’un élément
04:36 -
Les éléments flottants
10:28 -
Types d’éléments HTML block et inline
10:32 -
Positionner les éléments (position).
15:11 -
Ordre des différentes couches (z-index)
05:26 -
Calcul de la taille d’un élément (box-sizing)
05:36 -
Arrondir les bordures (border-radius)
06:28 -
Exercice pratique Positionnement
01:00 -
Exercice pratique Correction
05:29
CSS utilisation avancée
-
Sélecteurs Css Avancés
10:58 -
CSS Diner (jouer avec le Css)
00:00 -
Les pseudo-classes
09:41 -
Les pseudo-éléments
06:23 -
Les transitions en CSS
10:48 -
Les animations en CSS
16:00
La propriété Background en Css
-
Définir une image d’arriére plan (background-image)
06:44 -
Répétition de l’arrière plan (background-repeat)
02:42 -
Origine de l’arrière plan (background-origin)
05:06 -
Définir la position de l’arrière plan (background-position)
04:00 -
Définir la taille des images d’arrière-plan (background-size)
05:23 -
Définir la façon dont l’arrière-plan s’étend (background-clip)
05:55 -
Fixer la position de l’arrière plan (background-attachment)
03:10 -
Ajouter un dégradé linéaire a l’image de fond (linear-gradient)
04:04 -
Propriété raccourcie background
03:30
Modèle de boite flexible (flexbox Css)
-
Modèle de boite flexible (flex-direction)
05:19 -
Répartition des éléments flexible (justify-content)
05:16 -
Alignement sur l’axe secondaire (align-items)
05:37 -
Retour a la ligne des flex-items (flex-wrap)
04:07 -
Espacement sur l’axe secondaire (align-content)
02:56 -
La propriété raccourcie flex-flow
01:46 -
Ordre d’apparition des flex items (order)
05:38 -
Facteur d’expansion d’un élément flexible (flex-grow)
07:31 -
Facteur de rétrécissement d’un élément flexible (flex-shrink)
04:24 -
Taille initiale principale pour un élément flexible (flex-basis)
05:22 -
La propriété raccourcie flex
05:53 -
Exercice pratique boites flexibles
02:59 -
Correction de l’exercice
05:28 -
Apprendre flexbox en s’amusant
00:00
Les médias queries (responsive design)
-
Découverte des médias queries
07:15 -
Création d’un layout simple
12:43 -
Responsive design (média queries)
09:33
CSS Grid layout (modèle de disposition en grille)
-
Présentation et terminologie des grilles Css
06:24 -
Création d’une grille
07:42 -
Unités de mesure fractionnée (fr)
06:33 -
Espacements entre les lignes et les colonnes d’une grille.
04:15 -
Alignement Horizontale et Verticale des items-grid
05:47 -
Alignement Horizontale et Verticale d’un item-grid
05:47 -
Alignement Horizontale et Verticale dans grille
04:42 -
Emplacement d’un élément sur la grille
08:17 -
Zones de grille nommées
09:34 -
Contrôle de l’algorithme de placement automatique
08:53 -
Définir la taille d’une colonne/ligne de grille créée de façon implicite
04:46 -
Apprendre les grilles Css en s’amusant
00:00
Réalisation d’un site internet personnel de présentation
-
Les nouveaux éléments à valeur sémantique du HTML5
06:59 -
Maquette du site
04:15 -
Entête du site
08:51 -
Barre de navigation
09:12 -
Disposition du contenu de la page (grid-css-layout)
05:50 -
Pied de page du site
05:15 -
Génération des pages du site
04:47 -
index contenu aside : Informations
17:27 -
Index contenu aside : Atouts
16:58 -
Adaptation de l’élément pour Mozilla Firefox
05:00 -
Index contenu section : A propos de moi et Recherche
06:10 -
index contenu : boite de compétences
08:28 -
Portfolio
13:48 -
Curriculum Vitae
12:17 -
Contact
13:04 -
Personnaliser l’icone du site (favicon)
03:09 -
Responsive design du site (médias queries)
17:02
Héberger votre site web
-
Publier son site en ligne
06:58 -
Souscription chez un hébergeur
09:31 -
Présentation de l’interface d’administration et terminologie
08:58 -
Transfert du site chez l’hébergeur (ftp)
09:35