Formation et pratique du numérique


Création d’un site web

  29 huillet 2021

Pour réaliser un site web, il faut d'abord avoir une bonne connaissance du langage XHTML ainsi que le langage CSS et les feuilles de style afin que le site ainsi créé puis être interprété parfaitement avec les navigateurs modernes. Les sites ainsi réalisés doivent conforment aux normes du W3C.

Le World Wide Web Consortium (W3C) développe des standards internationaux pour le web : HTML, CSS et bien d’autres. Les standards web du W3C sont appelés Recommandations du W3C.

Pour la réalisation de ce site, nous nous sommes rapprochées des sites de w3school :

Pour l’étude des langages HTML et CCS voir le site de w3schools.com

Pour les exemples et la création des modules voir le site W3Scools How To

Pour créer un site web les principales étapes sont :

Création d’un espace web avec W3shool.com

Pour la création de votre premier site web, nous avons choisi une création entièrement en ligne sur le site "Spaces" de w3shool.com qui convient parfaitement pour la création d’un premier site web. Ainsi la formation, la création complète du site et sa diffusion sont faites avec un seul et unique site.

Vous devez donc créer un compte sur le site de w3schools.com

Ainsi vous pouvez créer votre espace, nous avons ici choisi de démarrer avec une page blanche.

Nous pouvons alors continuer avec la création de notre site en lui attribuant l’adresse web de la forme : xxxxx.w3space.com qui sera l’URL de votre site.

Toutes les actions seront ainsi faites en ligne à partir de votre espace.

Trois pages ont donc été créé automatiquement :

Enfin nous avons la possibilité d’ajouter des pages, des vidéos, des images, etc., en cliquant sur le bouton "Upload files" et ajouter une nouvelle page en cliquant sur le bouton "New file".

Création de la page index.html

Pour créer cette page, nous allons modifier l’un des modèles de la rubrique How To de w3school : Mobile Navigation Bar

En cliquant sur le bouton "Try it Yourself" nous pouvons alors modifier la présentation de notre page index.html

Vous devez ensuite copier tous les codes CSS contenus entre les balises style dans la page styles.css.

Vous copier ensuite la totalité des codes dans la page index.html puis vous supprimer les codes CSS de la partie style, car il sont inutiles à cause de la liaison avec la feuille styles.html.

En cliquant sur le bouton "preview", vous visualiser cette page index.htlm.

Création du contenu de la page

Pour créer le contenu de la page, vous devez ajouter les titres, les sous-titres et également des modules que vous pouvez créer à partir du site How To de W3shools

Ce module est représenté dans l’exemple ci-dessus par le cadre rouge. Les codes html du module doivent toujours être dans une boîte <div> avec la class= "row"