Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o

C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML Le HTML (HyperText Markup Language) est un format de présentation de données permettant de créer des pages web pouvant être lues dans des navigateurs. C'est un langage de description de données, et non un langage de programmation. Il est figé c.à.d. qu'une fois Qu’est ce que le HTML ? 2 langage de programmation. Il est figé c.à.d. qu'une fois le document chargé dans le navigateur, il ne répond à aucune action de l'utilisateur sur le contenu de la page. Ce langage est pourvu d'un système de balisage qui va permettre de structurer le document. Il utilise une Grammaire à base de Marqueurs ou Balises C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML Une balise HTML est un élément que l'on va ajouter au texte à afficher pour dire au navigateur de quelle manière l'afficher. Elle n'est pas affichée telle quelle dans le navigateur, elle est interprétée par celui-ci. syntaxe: Balises HTML syntaxe: <BALISE> (Balise standard ) - Une balise est toujours délimitée par les signes < et > - Chaque balise ouverte doit être fermée, cependant il existe des exceptions exemple : <html> </html> 3 C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML Attributs d’une balise Attributs d’une balise: - Ce sont des informations complémentaires caractérisant une balise. - Une balise peut comporter de zéro à plusieurs attributs. Balises HTML forme: nom_attribut="valeur" exemple : <html lang="fr"> 4 C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML Deux types de balises : balises simples Balises dites "vides": ne contiennent aucune autre balise HTML Ces balises n'ont pas besoin d'être fermées. exemple <img src="adresse_de_l’image"> (insertion d’une image) Balises simples – balises doubles <img src="adresse_de_l’image"> (insertion d’une image) balises doubles Deux balises ouvrantes/fermantes, entre lesquelles sont situées d'autres balises ou du texte. La balise fermante: identique à la balise ouvrante. contient un "/" pour indiquer la fermeture. exemple: <p> ici du texte ou tout autre balise </p> (paragraphe) 5 C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML Document HTML de base <html> <head> <title> … </title> Structure d’un document HTML la balise <html>. Elle encadre l'ensemble des autres balises. <head>: va contenir tout l'en-tête de la page (Informations diverses: <title> … </title> </head> <body>  </body> </html> 6 la page (Informations diverses: auteur, titre, version, scripts, variables ... ) entre les <body>: contenu ou corps du document. C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML L’entête du document - Head La balise <head>: balise structurelle comme <html> et <body>. Elle contient d'une part le titre du document (inclu dans la balise TITLE), mais également les déclarations comme la feuille de style ou les divers meta tags et également les 7 feuille de style ou les divers meta tags et également les fonctions javascript. Les meta-balises permettent de référencer un site web. L’objectif du référencement est de rendre visible un site web sur les moteurs de recherche afin de permettre aux internautes de le connaître ou le retrouver facilement. C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML L’entête du document - Head Les balises dans le <HEAD> d'un document html <TITLE> permet de donner un titre à une page, qui sera affiché dans le résultat des moteurs de recherche <BASE> permet d'indiquer la base des liens des frames par l'attribut Target, pour diriger vers une frame <LINK> pour indiquer les différents liens avec la page en cours 8 <LINK> pour indiquer les différents liens avec la page en cours et les liens concernant cette page <SCRIPT> permet d'insérer des javascripts <STYLE> permet d'insérer des styles css ( Cascading StyleSheets =feuilles de style en cascade ) <META> permet de donner le maximum de renseignements sur les pages pour pouvoir bien les référencer et bien les classer par les moteurs de recherche C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML L’entête du document - Head Les balises dans le <HEAD> d'un document html Le titre de la page entre les balises <title> et </title> Très important : Apparaît dans la barre de titre du navigateur. 9 Apparaît dans la barre de titre du navigateur. Son contenu sera affiché en titre des résultats de la recherche dans les moteurs de recherche ---> mettre le maximum de mots-clefs importants. C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML L’entête du document - Head exemple: <HTML> <HEAD> <TITLE>cours HTML – GIE 1ère année</TITLE> 10 10 <TITLE>cours HTML – GIE 1ère année</TITLE> </HEAD> </HTML> C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ HTML L’entête du document - Head Les balises dans le <HEAD> d'un document html La balise META - Balises insérées dans l'entête d'une page Web. - Elles sont invisibles pour l'internaute. - Elles renseignent le moteur sur la description du site, 11 11 - Elles renseignent le moteur sur la description du site, les mots clés, la langue utilisée sur la page, sur l'auteur du site … Les attributs de META NAME , CONTENT , LANG , HTTP-EQUIV <META NAME="Author" LANG="fr" CONTENT=" Nadir ali "> C o u r s d ’ HTML C o u r s d ’ HTML C o u r s d ’ uploads/s1/ courshtml-id2089.pdf