Apprendre à coder sur pierre-giraud.com

DES COURS COMPLETS ET GRATUITS POUR TOUS

SOMMAIRE

Introduction

  1. Présentation du cours
  2. HTML/CSS - Introduction
  3. HTML/CSS - Définitions et rôles
  4. HTML/CSS - Versions
  5. HTML/CSS - Travail en local
  6. HTML/CSS - L'éditeur de texte

Les bases en HTML

  1. HTML - Eléments, balises, attributs
  2. HTML - Structure
  3. HTML - Affichage
  4. HTML - Indentation et commentaires
  5. HTML - Titres et paragraphes
  6. HTML - Espaces et retours à la ligne
  7. HTML - Strong, em et mark
  8. HTML - Listes
  9. HTML - Liens internes et externes
  10. HTML - Autres types de liens
  11. HTML - Images
  12. HTML - Validation
  13. Test n°1

Les bases en CSS

  1. CSS - Sélecteurs, propriétés
  2. CSS - Emplacement
  3. CSS - Commentaires
  4. CSS - Sélecteurs simples
  5. HTML/CSS - Id et class
  6. CSS - L'héritage
  7. HTML/CSS - Block vs inline
  8. HTML/CSS - Div et span
  9. Test n°2

Mise en forme de textes

  1. CSS - Font-family
  2. CSS - Propriétés "font-"
  3. CSS - Couleur et opacité
  4. CSS - Propriétés "text-"
  5. CSS - Les espaces
  6. Test n°3

Le modèle des boîtes

  1. CSS - Le modèle des boîtes
  2. CSS - Dimensions
  3. CSS - Bordures
  4. CSS - Marges
  5. CSS - Ombres
  6. CSS - Affichage
  7. CSS - Positionnement
  8. CSS - Flottement
  9. CSS - Alignement
  10. Test n°4

Gestion du fond

  1. CSS - Couleur de fond
  2. CSS - Image(s) de fond
  3. CSS - Dégradés linéaires
  4. CSS - Dégradés radiaux
  5. Test n°5

Les tableaux

  1. HTML/CSS - Créer un tableau simple
  2. HTML - Structurer son tableau
  3. HTML - Améliorer un tableau
  4. Test n°6

Image, audio, vidéo

  1. HTML/CSS - Les images
  2. HTML - L'audio
  3. HTML - La vidéo
  4. HTML - Intégration et sémantique
  5. Test n°7

CSS avancé

  1. CSS - Long hand vs short hand
  2. CSS - Sélecteurs avancés
  3. CSS - Pseudo classes
  4. CSS - Pseudo éléments
  5. CSS - Sprites
  6. CSS - Transitions
  7. CSS - Animations
  8. Test n°8

Formulaires HTML

  1. HTML - Présentation des formulaires
  2. HTML - Créer un formulaire simple
  3. HTML - Les types d'input et les listes
  4. HTML - Les attributs des formulaires
  5. HTML/CSS - Organiser et mettre en forme un formulaire
  6. Test n°9

Responsive design

  1. HTML/CSS - Introduction au responsive
  2. HTML - Le viewport
  3. CSS - Les media queries
  4. Test n°10

Création d'un site perso (cv)

  1. Présentation de l'exercice
  2. Création des parties "fixes" du site
  3. Création de la page accueil.html
  4. Création des autres pages du site
  5. Conclusion de l'exercice et du cours

Conclusion de l’exercice et du cours

L’importance de la préparation

Nous venons donc de créer un site complet en HTML et en CSS, qui pourra vous servir de site personnel ou de CV interactif.

Une nouvelle fois, l’objectif n’était pas de faire quelque chose d’extrêmement compliqué ou perfectionné, mais simplement un site fonctionnel et assez joli.

Comme vous avez pu le constater, le « début » du site a été beaucoup plus long à créer que la fin. Cela, une nouvelle fois, est dû au fait que nous avons réutilisé beaucoup de codes déjà créés dans nos dernières pages.

J’espère donc à ce niveau que vous avez bien compris tout l’intérêt et l’importance d’une bonne préparation en amont ; l’importance de ne se lancer dans le code immédiatement mais de bien réfléchir à ce que l’on souhaite auparavant.

Progresser grâce à la pratique

Vous êtes à présent totalement armé au niveau théorique en HTML et en CSS.

Cependant, on ne devient développeur qu’en développant.

Je vous encourage donc tout d’abord à refaire les différents exemples de ce cours si jamais vous n’êtes pas à l’aise avec certains d’entre eux puis tout simplement à pratiquer et à pratiquer encore.

En effet, vous devez vous confronter aux difficultés pour progresser, et non pas les esquiver.

En ce sens, n’hésitez pas à modifier le code du site que l’on vient tout juste de créer, à l’enrichir et à le perfectionner afin de rendre le site totalement conforme à vos attentes.

Mettre son site en ligne

Une fois votre site terminé, vous voudrez peut être le mettre en ligne afin que tout le monde puisse y accéder.

Pour cela, vous devrez acheter un nom de domaine ainsi qu’un espace serveur.

N’hésitez pas à consulter la section « hébergement » de ce site afin de faire le bon choix et de bien installer votre site !

Conclusion et remerciements

Merci à tous d’avoir suivi ce cours !

Comme vous avez pu le voir, celui-ci est véritablement complet et vous a été fourni gratuitement.

N’hésitez donc pas en contrepartie à partager ce site à vos amis ou à me soutenir (via l’onglet dédié). Toutes ces aides sont très appréciées et me permettent de continuer à vous proposer des cours de cette qualité.

Encore merci et à bientôt pour un prochain cours !

Chapitre précédent