Scribd Logo
Importer

Bienvenue sur Scribd !

  • 64 vues

    Séance1 HTML

    Transféré par

    soumaya bargaoui
    Le document décrit les bases du langage HTML en définissant des termes comme la page web et la structure HTML5. Il explique les différentes balises comme <html>, <head>, <body> et leurs rôles respectifs dans la structure d'un document HTML.

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PPTX, PDF, TXT ou lisez en ligne sur Scribd

    Séance1 HTML

    Transféré par

    soumaya bargaoui
    64 vues16 pages
    Le document décrit les bases du langage HTML en définissant des termes comme la page web et la structure HTML5. Il explique les différentes balises comme <html>, <head>, <body> et leurs rôles respectifs dans la structure d'un document HTML.

    Titre original

    séance1 html

    Copyright

    © © All Rights Reserved

    Formats disponibles

    PPTX, PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Le document décrit les bases du langage HTML en définissant des termes comme la page web et la structure HTML5. Il explique les différentes balises comme <html>, <head>, <body> et leurs rôles respectifs dans la structure d'un document HTML.

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PPTX, PDF, TXT ou lisez en ligne sur Scribd
    Télécharger au format pptx, pdf ou txt
    64 vues16 pages

    Séance1 HTML

    Transféré par

    soumaya bargaoui
    Le document décrit les bases du langage HTML en définissant des termes comme la page web et la structure HTML5. Il explique les différentes balises comme <html>, <head>, <body> et leurs rôles respectifs dans la structure d'un document HTML.

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PPTX, PDF, TXT ou lisez en ligne sur Scribd
    Télécharger au format pptx, pdf ou txt
    sur 16

    COMMUNICATION ET

    TECHNOLOGIES
    INTERNET
    Objectifs

    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).
    INTRODUCTION AU LANGAGE HTML

    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

    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 : définition

     (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 (>)
     On distingue deux types de balises :

    les balises en paires

    Les balises orphelines


    LES BALISES EN PAIRES

     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 ORPHELINES

     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.
    Structure d’un document HTML

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset = "UTF-8">
    <title>
    Le titre de la page
    </title>
    </head>
    <body>
    Contenu de la page
    </body>
    </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 BALISE COMMENTAIRE

     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.
    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


    DÉCOUVRONS QUELQUES BALISES:

    Balise Rôle

    <p> …</p> Début et fin du paragraphe


    <br /> Saut de ligne
    <h1> </h1> Créer des titres
    <h6> </h6>

    <strong> Mettre le texte en valeur: exemple gras


    <mark> surligner le texte
    <ul>  listes non ordonnées ou listes à puces
    <li>……</li> délimite un élément de la liste
    </ul>

    <ol> liste ordonnée


    <li>……</li>
    </ol>.

    Vous aimerez peut-être aussi