Scribd Logo
Importer

Bienvenue sur Scribd !

  • SNT TH3 - Le Web - Activité 3 - ORDI Ecriture Dune Page WEB

    Transféré par

    mehjademaria008
    21 vues6 pages

    Titre original

    SNT TH3 - Le Web - Activité 3 - ORDI Ecriture dune page WEB

    Copyright

    © © All Rights Reserved

    Formats disponibles

    PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Signaler ce document

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    21 vues6 pages

    SNT TH3 - Le Web - Activité 3 - ORDI Ecriture Dune Page WEB

    Transféré par

    mehjademaria008

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    sur 6

    Sciences Numériques et Technologie

    Classe de seconde - enseignement commun

    THEME 3 : Le Web

    Activité 3 : Ecriture d’une page WEB

    Activité 3 : Ecriture d’une page WEB - Ordinateur

    Livre pages 62 et 63

    Durée : 2 « séances groupe » de 2 heures = 4 heures

    Activité Numérique AN1


    Création de votre page Web

    HTML

    Choisir un thème que vous appréciez et rédigez une page Web,


    en utilisant le modèle proposé, sur ce contenu en intégrant :

     Un titre : <h1>….</h1>
     Un paragraphe : <p>….</p>
     Des sous titres : <h2>….</h2>
     Deux images minimum : <img …./> (dont le logo SNT)

    1
    Sciences Numériques et Technologie
    Classe de seconde - enseignement commun

    THEME 3 : Le Web

    Activité 3 : Ecriture d’une page WEB

    Modèle proposé : « TH3 - ma page web.html »

    <!DOCTYPE html>
    <html>

    <head>
    <meta charset="utf-8">
    <title>Ma page Web - SNT Theme 3 - Le WEB </title>
    <link rel="stylesheet" href="style.css">
    </head>

    <body>
    <h1>début de ma page Web</h1>

    <h1>fin de la page Web</h1>


    </body>

    </html>

    Balise HTML permettant de sauter une ligne :


    <br>

    Balise HTML permettant de centrer des élèments :


    <center>.…</center>

    Balise HTML permettant d’insérer une image :


    <img src='SNT_logo01.jpg' alt='logo SNT' width='100' height='66' />

    Balise HTML permettant d’insérer un son :


    <audio controls><source src='musique.mp3'></audio>
    2
    Sciences Numériques et Technologie
    Classe de seconde - enseignement commun

    THEME 3 : Le Web

    Activité 3 : Ecriture d’une page WEB

    Activité Numérique AN2


    Création de votre site Web

    Votre site Web sera constitué de 3 pages Web :

     Votre page Web


     Une page Web 2 illustrant la création de tableaux
     Une page Web 3 illustrant l’utilisation de JavaScript

    Toutes les pages seront liées entre elles par des liens hypertexte
    (ou hyperliens) qu’il faudra coder.

    HTML

    HTML HTML

    Balise HTML permettant de créer des liens hypertexte :


    <a href="TH3 - page web 2.html">vers la page 2</a>

    <a href="TH3 - page web 3.html">vers la page 3</a>

    3
    Sciences Numériques et Technologie
    Classe de seconde - enseignement commun

    THEME 3 : Le Web

    Activité 3 : Ecriture d’une page WEB

    Ensemble de balises HTML permettant de créer des tableaux :

    <table>….</table>

    <tr>….</tr> tr  r : row = une ligne

    <td>….</td>

    <table border=1>
    <tr>
    <td>cellule 1</td>
    <td>cellule 2</td>
    </tr>
    <tr>
    <td>cellule 3</td>
    <td>cellule 4</td>
    </tr>
    <tr>
    <td>cellule 5</td>
    <td>cellule 6</td>
    </tr>
    </table>

    L’attribut « border » permet de créer une bordure autour de


    chaque case du tableau.

    Il est possible d’intégrer une image dans une cellule :


    …
    <tr>
    <td>cellule 5</td>
    <td><img src='SNT_logo01.jpg' alt='logo SNT' width='100' height='66' /></td>
    </tr>
    …

    4
    Sciences Numériques et Technologie
    Classe de seconde - enseignement commun

    THEME 3 : Le Web

    Activité 3 : Ecriture d’une page WEB

    Activité Numérique AN3


    Ajout d’une apparence commune à toutes vos pages
    Création d’un style en langage CSS

    Choisir un thème graphique simple en utilisant le modèle


    proposé.

    Modèle de style CSS proposé : « style.css »

    CSS

    HTML

    HTML HTML

    5
    Sciences Numériques et Technologie
    Classe de seconde - enseignement commun

    THEME 3 : Le Web

    Activité 3 : Ecriture d’une page WEB

    Modèle de style CSS proposé : « style.css »

    body {
    background-color: dodgerblue;
    font-family: "Open Sans", sans-serif;
    padding: 5px 25px;
    font-size: 18px;
    margin: 0;
    color: #B40431;
    }

    h1 {
    font-family: "Open Sans", sans-serif;
    font-size: 54 px;
    }

    h2 {
    font-family: "Merriweather", serif;
    font-size: 24px;
    }

    Vous aimerez peut-être aussi