Embedded Files
Un site web ou site internet est un ensemble de fichiers organisés en dossiers dans une arborescence stockée sur un serveur. Un serveur est allumé en permanence, ce qui a un coût non négligeable pour la planète.
Les fichiers sont de différents types :
texte
son
photo
vidéo
programme exécutable
Qu'est-ce qu'une page web ?
Une page web est un fichier qui permet de publier :
un contenu (textes, images, vidéos...) : le fond
un style graphique : la forme
Le contenu est écrit en langage HTML (langage à balises dont l'extension du fichier est .htm ou .html)
Le style graphique est écrit en langage CSS (extension du fichier .css)
Le fichier html fait appel par une instruction à un fichier css pour assurer la mise en forme
Arborescence d'un site web
Supprimer la mise en forme d'une page web
Sur le navigateur Mozilla Firefox, on peut faire disparaître la mise en forme d'une page :
Afficher le menu : clic-droit à côté des onglets > Barre de menus
Menu Affichage > Style de la page > Aucun Style
Langage HTML (le contenu avec hierarchie)
Langage HTML (le contenu avec hierarchie)
Code source d'une page web
Code source d'une page web
La page est constituée :
De l'entête : "head"
Du corps : "body"
L'ouverture s'écrit <x> et la fermeture s'écrit </x>
Les principales balises HTML sont :
<html> </html> Début et fin de page
<tittle> </tittle> Titre
<h1> </h1> Titre de niveau 1
<h2> </h2> Titre de niveau 2
<p> </p> Paragraphe
<Strong> </Strong> ou <b> </b> Mise en gras
<u> </u> Souligner
<i> </i> Italique
<br> se situe en fin de ligne : Retour à la ligne
Langage CSS (le style graphique)
Langage CSS (le style graphique)
On aura remarqué l'usage des balises h1 et h2 qui permettent de déclarer des titres de niveaux 1 et 2. Ces titres ont une mise en forme par défaut. Voyons à présent comment on peut améliorer cette mise en forme de ces titres.
Pour cela, il faudrait créer un nouveau fichier style_perso.css et l'enregistrer juste à côté de notre fichier .html. On pourra ensuite l'appeler à l'intérieur de notre page HTML avec la ligne suivante (dans la section <head>) :
<link href="style_perso.css" rel="stylesheet" type="text/css" />
Le résultat sur la page web est immédiat :
A présent, vous avez toutes les informations pour réaliser votre propre page HTML dans l'activité qui suit.
Page updated
Google Sites
Report abuse