COMMUNICATION ET TECHNOLOGIES INTERNET Définir les termes: page web, HTML Décou
COMMUNICATION ET TECHNOLOGIES INTERNET Définir les termes: page web, HTML Découvrir la structure de base d’un document HTML5 Découvrir les balises( doctype, racine html, en-tête head et corps body). Objectifs Page Web une page Web est un fichier texte enregistré avec l’extension html (ou htm). INTRODUCTION AU LANGAGE HTML En double cliquant sur ce fichier , le navigateur se lance avec comme contenu le fichier: Le script Html est interprété par le navigateur par défaut tel que : Firefox, Internet Explorer, Google chrome , … INTRODUCTION AU LANGAGE HTML Introduction au langage HTML Un navigateur est un logiciel qui permet de consulter et afficher le web. Il interprète plusieurs langage informatique (html,javascript,css…) afin d’afficher les données téléchargées comme le concepteur de la page le demande (HTML): Hypertext Markup Language Langage de balises qui permet de structurer des pages Le document HTML contient un ensemble de balises tels que, <html>, <body>, <head>, etc Les balises du langage HTML sont inclues entre les signes inférieur (<) et supérieur (>) HTML : définition On distingue deux types de balises : les balises en paires Les balises orphelines Elles s'ouvrent, contiennent du texte, et se ferment plus loin. Voici à quoi elles ressemblent : <titre>CONCEPTION SITE WEB</titre> On distingue une balise ouvrante (<titre>) et une balise fermante (</titre>). LES BALISES EN PAIRES Ce sont des balises qui servent le plus souvent à insérer un élément à un endroit précis (par exemple une image). Il n'est pas nécessaire de délimiter le début et la fin de l'image, on veut juste dire à l'ordinateur "Insère une image ici". Une balise orpheline s'écrit comme ceci : <image /> Notez que le / de fin n'est pas obligatoire. LES BALISES ORPHELINES <!DOCTYPE html> <html> <head> <meta charset = "UTF-8"> <title> Le titre de la page </title> </head> <body> Contenu de la page </body> </html> Structure d’un document HTML DÉCOMPOSONS BALISE PAR BALISE ! <html> • englobe tout le contenu de page • La balise <html> contient nécessairement deux balises définissant l'entête (<head>) et le corps (<body>) du document. <head> • Détermine l’entête du document et contient les méta-informations • Les informations que contient ne sont pas affichées sur la page <body>: • Délimite le contenu de la page • Le contenu est constitué de texte, images et autres éléments qui seront affichés <!doctype> • La balise !DOCTYPE définit la version HTML utilisée par ce document. • Ecriture du DOCTYPE pour le html 5 :<!DOCTYPE html> <meta> • La balise meta fourni des métadonnées sur la page courante. Ces informations ne sont pas visibles, mais sont traitées par les navigateurs et par les moteurs de recherche <title> • La balise title sert à définir le titre de la page web qui sera affiché dans la barre du titre du navigateur. la syntaxe de la balise commentaire est sous la forme suivante : <!-- commentaire --> Les commentaires sont des notes, des informations et des détails qui accompagnent le code source et qui ne s’afficheront pas sur la page web. LA BALISE COMMENTAIRE STRUCTURE D’UN DOCUMENT HTML5 <header> l’en-tête <footer> le pied-de-page <nav> les principaux liens de navigation :Menus du site <section> les parties thématiques de la page <aside> les informations complémentaires <article> Un article provenant d'une autre page Balise Rôle <p> …</p> Début et fin du paragraphe <br /> Saut de ligne <h1> </h1> <h6> </h6> Créer des titres <strong> Mettre le texte en valeur: exemple gras <mark> surligner le texte <ul> <li>……</li> </ul> listes non ordonnées ou listes à puces délimite un élément de la liste <ol> <li>……</li> </ol>. liste ordonnée DÉCOUVRONS QUELQUES BALISES: uploads/Management/ seance1-html 1 .pdf
Documents similaires
-
17
-
0
-
0
Licence et utilisation
Gratuit pour un usage personnel Attribution requise- Détails
- Publié le Nov 16, 2021
- Catégorie Management
- Langue French
- Taille du fichier 0.2258MB