Réaliser un site

Etape 1 : la première page

Pour réaliser un site WEB, il suffit d'utiliser le "Bloc-note" sur un PC ou "TextEdit" sur Mac. Mais pour disposez de façon plus confortable pendant la programmation des pages HTML, il est préférable d'utiliser un logiciel consacré pour cet objectif.


Vous êtes prêt pour écrire les premières balises HTML !

Accès explications de la vidéo 1

Aide : 

Voici ci-contre, la structure de base de tout fichier HTML .
Vous pouvez faire un copier-coller pour démarrer plus rapidement.
<!DOCTYPE html><html>
  <head>    <meta charset="utf-_8">  </head>
  <body>      </body></html>

Etape 2 : Ecrire des titres, du texte, sauter des lignes

Les pages HTML sont lues comme dans un programme, pas à pas, du haut vers le bas.  Le navigateur saura ce qu'il a à faire en lisant les balises HTML. 

Généralement les informations affichées sont écrites entre deux balises :

Le texte entre ces deux balises sera affiché à l'écran comme un titre de niveau 1 !

Accès explications de la vidéo 2

Etape 3 : Mettre des images

Toutes les images contenues dans une page Web sont des images totalement indépendantes contenues dans chacune dans un fichier image différent.

Pour que l'affichage soit rapide, on utilise des fichiers compressés du format JPEG, PNG ou GIF. 

Accès explications de la vidéo 3

Etape 4 : Mettre du style

Pour modifier l'aspect de la page (couleur du texte, du fond de la page, de la taille etc...), il est préférable de réaliser un autre type de fichier : une feuille de style CSS.

Cette feuille de style permettra d'afficher toutes les pages d'un site avec un même style ! 

Accès explications de la vidéo 4


Etape 5 : Créer des liens

Une page web sans lien vers une autre page n'est pas vraiment une page web.

Dans cette dernière partie, vous allez commencer à créer un site digne de son nom !

Accès explications de la vidéo 5


Site presque professionnel

Voici 3 vidéos vous permettant la réalisation d'un site quasiment professionnel qui s'adapte à toutes les tailles d'écrans. On parle de site "responsive".



PS : Vous pouvez accélérer la vitesse de lecture des vidéos

Site pour la construction de page HTML

Première partie

Deuxième partie

Troisième partie