T ECHNOLOGIES WEB CHAPITRE I : L E LANGAGE HTML Amani JARRAYA & Mohamed Mohsen 1.
Internet & langage HTML [email protected]
description
Transcript of Internet & langage HTML [email protected]
Internet & langage HTML
2009 - 2010 1
Institut Supérieur de Gestion de Tunis
3ème Année IAG
2
Références
D.Mailliet,Cours Internet
Laurent Candillier,Cours HTML
Stefan Münz, 27/01/2003, http://fr.selfhtml.org
Barbria Manel Internet & langage HTML
3
Objectifs du cours
Connaitre les notions de base sur Internet
Présenter le langage HTML
Développer des sites web
Barbria Manel Internet & langage HTML
4
Plan du cours
• Définition• Les protocoles• Les services
• Définition• Quelques balises
Le réseau Internet :1
Le langage HTML2
Barbria Manel Internet & langage HTML
5
Internet : Définition
C'est un réseau international d'ordinateurs qui communiquent entre eux grâce à des protocoles d'échange de données standards.
Développé dans le milieu des années 1970 par la DARPA( Defense Advanced Research Projects Agency ) pour interconnecter les systèmes informatiques de l’armée
Barbria Manel Internet & langage HTML
6
Les protocoles:
Internet fonctionne suivant un modèle en couches où les éléments appartenant aux mêmes couches utilisent un protocole de communication pour s'échanger des informations.
Un protocole est un ensemble de règles qui définissent un langage afin de faire communiquer plusieurs ordinateurs.
Exemples : TCP/IPHTTPDNSSMTP
….Barbria Manel Internet & langage HTML
7
Le protocole TCP/IP (1)TCP/IP (Transmission Control Protocol / Internet Protocol) définit les règles que les ordinateurs doivent respecter pour communiquer entre eux sur le réseau Internet.Il provient des noms des deux protocoles TCP et IP
Protocole IP:Ce protocole se charge du routage de chaque paquet vers sa destination où une adresse IP unique est attribuée à chaque ordinateur.
Barbria Manel Internet & langage HTML
8
Le protocole TCP/IP ( 2)
Protocole TCP :Se charge de la communication entre les applications c’est-à-dire entre les logiciels utilisés par les ordinateurs.
Lors d'une communication à travers le protocole TCP, les deux machines doivent établir une connexion.
Barbria Manel Internet & langage HTML
9
Le protocole HTTP(1)
Le protocole HTTP (HyperText Transfer Protocol) est le protocole le plus utilisé sur Internet . Il permet un transfert de fichiers hypertextes(essentiellement au format HTML) localisés entre un client et un serveur Web Utilise les adresses URL (Uniform Ressource Locator)
La forme d’une adresse URL : http:\\www.serveur.suffixe
Barbria Manel Internet & langage HTML
10
Le protocole HTTP(2)
Fonctionnement du protocole HTTPBarbria Manel Internet & langage HTML
11
Les services (1) Le World Wide Web (WWW): Le Web (la toile d'araignée) est une application qui utilise le réseau Internet, et rend possible la recherche d'informations sur les divers sites grâce à l'utilisation des navigateurs et les adresses URL. Un navigateur est un logiciel qui permet d'accéder aux différentes ressources sur internet.Exemples : Internet Explorer Mozilla FireFox NetScape ….
Barbria Manel Internet & langage HTML
12
Les services (2)
La messagerie électronique : Le courrier électronique (e-mail) permet la transmission personnelle de messages et de fichiers d'un expéditeur à un destinataire grâce à des adresses e-mail protégées par des mots de passe . La forme d’une adresse e-mail: [email protected] Le protocole SMTP ( Sample Mail Transfer Protocol):Envoi des courriels électroniques Le protocole POP( Post Office Protocol):Réception des courriels électroniques
Barbria Manel Internet & langage HTML
13
Les services (3)
File Transfer Protocol (FTP):C’est un service d’Internet permettant de
télécharger des fichiers à partir du serveur.
Autres services : Internet Relay Chat (IRC) Forums de discussion Le commerce électronique …
Barbria Manel Internet & langage HTML
14
Langage HTML : Définition
HTML : Hyper Text Markup Language est né en 1989 par Tim Berners Lee
C'est un langage de balisage qui permet de mettre en forme des pages html : apparence et présentation
Un document HTML peut incorporer du texte, des images, de l'animation et du son.
Barbria Manel Internet & langage HTML
15
Les balises
Une balise (tag) est une commande codée qui indique une action concernant la mise en page, la mise en forme ou la structure logique d’un document.
Structure d’une balise:< balise attribut1 = " valeur " … > xxx </balise>
Remarques :Certaines balises n’ont pas de balise de fermetureIl faut respecter la logique d’imbrication
Barbria Manel Internet & langage HTML
16
Les éditeurs HTML1- Le mode graphique: repose sur le principe de WYSIWYG c.à.d. la création se fait d’une façon visuelle. 2 - Le mode texte ( ou code ) : l’éditeur HTML est considéré comme un simple éditeur de texte où la génération de code se fait ligne par ligne.Exemples des éditeurs HTML:
Macromedia DreamWeaver Netscape Navigator Gold Microsoft Frontpage Symposia …
17
Structure de base d’un document HTML
<html> <head> <TITLE> ………... </TITLE> </head> <body> ……….. </body> </html>
Titre du document
Contenu du document
Entête du document
Barbria Manel Internet & langage HTML
18
Les textes et paragraphesBalises Fonctions Exemple de code Résultat
<B>….</B> Texte en gras
<B>Mon premier cours </B> Mon premier cours
<I>…...</I> Texte en italique
<I>Mon premier cours </I> Mon premier cours
<U>….</U> Texte souligné
<U>Mon premier cours </U> Mon premier cours
<p>….</p> Début d’un paragraphe
Mon premier<p>cours</p> Mon premier
cours<BR> Retour à la
ligneMon premier <BR> cours Mon premier
cours
Barbria Manel Internet & langage HTML
19
Les listes
Code HTML : <UL><LI>Mon premier élément de liste<LI>Mon deuxième élément de liste</UL>
Résultat :
· Mon premier élément de liste· Mon deuxième élément de liste
Code HTML :
<OL><LI>Mon premier élément de liste<LI>Mon deuxième élément de liste</OL>
Résultat :
1. Mon premier élément de liste2. Mon deuxième élément de liste
Listes numérotées <OL>Listes à puces <UL>
Type {circle,square}Type {A,a,i,I} Start
20
Les titres
Exemple de code Résultat
<H1>Mon titre en H1</H1> Mon titre en H1<H2>Mon titre en H2</H2> Mon titre en H2<H3>Mon titre en H3</H3> Mon titre en H3<H4>Mon titre en H4</H4> Mon titre en H4
<H5>Mon titre en H5</H5> Mon titre en H5
<H6>Mon titre en H6</H6> Mon titre en H6
Barbria Manel Internet & langage HTML
21
Les tableaux<TABLE> et </TABLE> :
Marquent le début et la fin d'un tableau<TR> et </TR> :
Servent à définir une ligne du tableau <TD> et </TD>:
Servent à définir une cellule du tableau<TH> et </TH> :
Servent à définir un titre de chaque colonne<CAPTION> et </CAPTION>:
Servent à définir un titre pour le tableau Barbria Manel Internet & langage HTML
22
Les liens hypertextes : Liens externes
La création des liens hypertextes se fait avec la balise :
<A href = ″adresse cible ″> texte du lien </A>
L'adresse cible peut être un lien vers : Un site extérieur Une adresse e-mail Un fichier sur le même serveur
Barbria Manel Internet & langage HTML
23
Les liens hypertextes : Liens internes
Des liens vers des endroits précis dans le même document html, appelés les ancres ou les pointeurs.1 - Insérer une ancre :Nommer l’endroit où l’utilisateur veut accéderen utilisant la balise < a name = ″ nom ″></a>2 – Pointer vers cette ancre : Se fait par la création d’un lien an ajoutant le nom de
l’ancre : <A href = ″ #nom ″>ancre</A> Barbria Manel Internet & langage HTML
24
Travail à faire :
Comment créer des formulaires en HTML
Barbria Manel Internet & langage HTML