Sommaire: Cours création d’un site web avec kompoZer
1Rudiments sur le langage HTML.
1.1Structure d’une page web :
1.2Le langage des pages Web.
2Préparation du site web
3Utilisation d’une feuille de style.
3.1Définition des blocs dans la feuille de style.
3.2Modification des blocs dans la feuille CSS
3.3Attribution de styles aux balises html (titre, paragraphe et liens)
3.4Attribuer un style à un élément (paragraphe, titres) dans KompoZer
4Modifier la page modele.html
5Créer les pages du site
6Insérer une image.
6.1Recherche de l’image
6.2Insertion de l’image
7Insérer un lien.
8Visualiser la page en cours d’élaboration
Extrait du cours création d’un site web avec kompoZer
1 Rudiments sur le langage HTML
Ouvrir KompoZer ; donner un titre à la page :
Format > Titre et propriétés de la page dans la zone Titre, écrire essai
Écrire quelques mots.
Cliquer sur l’onglet Source.
Vous obtenez le code source de la page. Un simple éditeur de texte permet de réaliser une page HTML.
1.1 Structure d’une page web :
Une page Web est partagée en deux sections essentielles :
➢ l’entête de la page (ou head) et
➢ le corps de la page (ou body).
Repérer ces deux sections dans votre page web entre <head> et </head> entre <body> et </body>
L’entête de la page ou head
Dans l’entête sont inscrits toutes les données nécessaires à la bonne compréhension de la page par le navigateur. On y trouve :
➢ la version du langage HTML que vous utilisez,
➢ les données meta qui précisent le nom de l’auteur, l’encodage des caractères (européens, asiatiques, arabes), le titre de la page.
Identifier la balise qui indique le titre de la page.<title>
➢ les langages de scripts extérieurs ou internes auxquels vous faîtes appel (JavaScript,CSS, etc.). (Voir plus loin utilisation d’une feuille de style)
Le corps de la page ou body C’est à l’intérieur de cette section que vous écrirez vos pages.
1.2 Le langage des pages Web
Le langage HTML établit l’ensemble des balises qui transforment un texte brut en un texte stylisé avec paragraphes, images, etc.
Exemples de texte brut avec leurs balises de transformation :
<b>texte en gras</b>
Les marqueurs ont en général la forme suivante :
<>: pour ouverture d’une balise qui transformera le texte brut ;
</>: pour fin de la transformation du texte brut. Àl’intérieur de ces balises,
vous y glissez toutes les commandes de styles et de typographies possibles et imaginables (dans la limite de la possibilité du langage HTML, bien sûr).
Dans l’exemple proposé, l’effet de la balise <b>est de mettre en caractère gras le texte entre les deux balises.
Certaines balises sont utilisées très fréquemment, en particulier avec les feuilles de style : titres, paragraphe et liens.
…….
Si le lien ne fonctionne pas correctement, veuillez nous contacter (mentionner le lien dans votre message)Cours création d’un site web avec kompoZer (301 KO) (Cours PDF)
