Bonjour !

• Bruno Bord
• 37 ¾ ans
• Développeur web depuis 2001
• Dev 1.0 (Izarbel)
• remplace Nadine Couture au pied levé, merci d'être indulgent

(une) définition

Capacité d’échange de données et de services entre systèmes en dépit de leurs différences (hétérogénéité)

Autrement dit...

Les systèmes parlent la même langue

• Faire communiquer des "entités" (gens / matériels)
• Échanger des données
• Partager des services

C'est un programme qui attend (on dit aussi "écoute") des instructions et qui rend des services.

(par extension, on désigne aussi la machine physique sur laquelle tourne le programme)

• Afficher une page web (serveur HTTP Apache, Nginx)
• Partager des fichiers (Samba, FTP, Netware)
• Proposer des données (Bases de données MySQL, Postgresql, Oracle,...)
• Envoyer des emails (SMTP)
• Recevoir des emails (POP / IMAP)
• ...

C'est un programme qui adresse des requêtes au serveur et en réceptionne les réponses.

(par extension, on désigne aussi la machine sur laquelle tourne le programme)

• Outlook, Thunderbird (emails)
• Chrome, Firefox, Internet Explorer (web)
• Skype
• ...

• UDP
• TCP
• IP
• SSH
• SMTP
• (S)FTP
• POP
• IMAP
• HTTP(S)

• Discutés et Approuvés (W3C, IETF,...)
• Normés et documentés (RFCs)
• Distincts (chaque outil sa tâche)

• Règles de formatage
• Ordre d'envoi / réception (qui parle en premier et ce qu'il dit)
• Gestion des succès / échecs (pourquoi ça a pas marché)
• (éventuellement) gestion de la sécurité (cf. SSH, HTTPS...)

• LAN : Local Area Network
• WAN : Wide Area Network
• TCP : Transmission Control Protocol
• IP : Internet Protocol
• ADSL: Asymmetric Digital Subscriber Line
• WWW: World Wide Web

Vous en faites tous les jours

• Facebook
• Twitter
• Wikipedia
• Google (search, maps, mail,...)

Internet, mais pas web

• MSN
• MMS
• VoIP
• Télé par l'ADSL (streaming)
• Bittorrent
• Mail (spam)

Client: Hey, serveur? Tu as pas la page d'accueil de estia.fr ?
Serveur: Ouaip, bouge pas, je te l'envoie.
Client: Super. Oh dis-moi, je vois au moins trois images et des feuilles de style, tu peux pas me les envoyer aussi ?
Serveur: Allez, zou. C'est du jpeg, du png et du css hein ?
Client: Cool, merci. Bon, je peux afficher ça sur l'écran, merci.

< EOT >

Client: GET /
Serveur: 200 OK. (index.html) text/html
Client: GET /image1.jpg
Client: GET /image2.jpg
Client: GET /image3.png
Client: GET /joli.css
Serveur: 200 OK. (joli.css) text/css
Serveur: 200 OK. (image2.jpg) image/jpeg
Serveur: 200 OK. (image3.png) image/png
Serveur: 200 OK. (image1.jpg) image/jpeg
Client: ...

< EOT >

• 20x: tout va bien
• 30x: bien, mais c'est la porte à côté
• 40x: erreur du client
• 50x: oooops, l'erreur est chez nous

• Texte (presque) brut
• des liens
• vous connaissez : navigation sur Wikipedia, par ex.

Extension de la notion d'hypertexte à toutes les formes de media

• images,
• sons,
• animations,
• meta-informations,
• styles,
• scripts...

• Décentralisation des ressources (une page composée à partir de media éparpillés)
• Texte enrichi (vs. texte "brut")
• Accessible via les réseaux

• World
• Wide
• Web
• Consortium

W3C's primary activity is to developing protocols and guidelines that ensure long-term growth for the Web. W3C's standards define key parts of what makes the World Wide Web work.

(source: http://www.w3.org/Help/)

• groupement des acteurs du web
• normes et recommendations
• groupes de travail
• le présent et...
• le futur !

http://www.estia.fr/web-pratique/a-venir.html

Protocole

http://www.estia.fr/web-pratique/a-venir.html

• En anglais, "scheme"
• ftp://ftp.inria.fr/pub
• file:///home/tui/public_html/index.html
• https://mail.google.com/

TLD

http://www.estia.fr/web-pratique/a-venir.html

• TLD == Top-Level Domain
• pays : .fr, .uk, .ie, .it...
• autres : .com / .net / .gov / .edu / .biz...

Domaine

http://www.estia.fr/web-pratique/a-venir.html

Autres exemples :

• mozilla.org
• nasa.gov
• perdu.com

Serveur

http://www.estia.fr/web-pratique/a-venir.html

• Généralement le nom de la machine physique
• le "www" peut souvent être ignoré
• cas : http://fr.yahoo.com/
• autre cas : http://ceci.est.toutafait.possible.com/

news.bbc.co.uk

• le TLD ?
• le domaine ?
• c'est quoi "news" ?

Chemin

http://www.estia.fr/web-pratique/a-venir.html

• peut être "/" (racine)
• ne représente pas forcément un chemin physique

Arguments

http://www.example.com/this/is/?argument=1&other=abcd

• utilisé pour le passage de variables (langages de script)
• inconvénient : un peu laid, mal-lisible

Ancres

http://www.example.com/#p1
http://en.wikipedia.org/wiki/Anchor#Overview

• références au sein d'une page (paragraphe, section...)
• ne recharge pas la page si on reste avec la même URL "racine"

• Internet Map - Wikipedia "Tree of routing paths through a portion of the Internet as visualized by the Opte Project"
• C-3PO - Wikipedia
• Interconnexion 3, Interconnexion 4, Interconnexion 12 - Bruno Bord
• Internet + Web - Bruno Bord
• Ring Topology - Wikipedia
• Tree Topology - Wikipedia
• Bus Topology - Wikipedia
• Star Topology - Wikipedia
• Tim Berners-Lee - Wikipedia
• Lego bricks - patrick h. lauke