wie_funktioniert_das_internet

Werbung
Wie funktioniert
das Internet?
Internet = Netz der Netze
Teilnetze

LAN:
Local area network

WLAN:
Wireless LAN

MAN:
Metropolitan area
network

WAN:
Wide area network

GAN:
Global area
network
Rollenverteilung
Clients (z.B. Browser)
... stellen Anfragen


Server
... stellen Dienste oder
Dokumente zur Verfügung (sind immer
online)

Router
... sind Teil mehrerer
Netze und weisen den
Informationspaketen
ihren Weg
Zugang zu einer Webseite
<htm
l>
<hea
d>
(Web) Host,
stellt Speicherplatz auf
WWW-Server
...
Provider,
stellt Zugang
zum Internet
(Leitung und
Adresse)
(Web) Host,
</he
ad>
stellt evtl. weitere Dienste
zur Verfügung, z.B. email,
PhP, Datenbanken, etc.
<bod
Wie komme ich ins Internet?
Durch eine
Verbindung
(z.B. mit Modem,
Router, Funk, ...)
zu meinem
Provider, der einen
Router im
WAN/GAN
betreibt
Browser

auch WWW-Browser oder
Web-Browser genannt




Ein Browser ist ein
Computerprogramm, mit dem
man sich im World Wide Web
(WWW) bewegen und
WWW-Seiten darstellen kann
- Ähnlich wie man zum
Betrachten von Textdateien ein
Textverarbeitungs-programm
benötigt.


Internet Explorer
Mozilla Firefox
Safari (Apple)
Opera
Google Chrome
World Wide Web (WWW)
auch W3 oder schlicht Web genannt
Das WWW ist nur einer von vielen Diensten im Internet!
Das World
Wide Web ist eine riesige Sammlung von
Dokumenten. Diese sind auf Computern auf der ganzen Welt
gespeichert und können Querverweise auf andere
Dokumente enthalten (Links oder Hyperlinks).
Für die eindeutige Adressierung eines Dokuments im
WWW benötigt man eine URL
Zum Darstellen des Dokuments braucht man einen Browser
URL (Uniform Resource Locator)

Ein System, mit dem man den Pfad zu jedem
Dokument im WWW angeben kann:
http://www.gymkirchenfeld.ch/aktuell/aktuell_matur08.html
Protokoll Server
Domainname
TLD Ordner
Dateiname
Top Level Domain

Der erste Teil bezeichnet einen bestimmten Computer
(äquivalent zur IP), alles nach dem ersten Backslash ist
ein normaler Pfad auf diesem Computer
IP: 193.246.253.248
Der restliche Pfad
http://www.gymkirchenfeld.ch/aktuell/aktuell_matur08.html
Protokolle
http://www.gymkirchenfeld.ch/aktuell/aktuell_matur08.html


Kommunikation zwischen
Computern
ist festgelegt durch
Protokolle
Beispiel:






A: Hallo Bob
B: Hallo Alice
A: Wie spät ist es?
B: 9:45 Uhr
A: Danke, tschüss
B: Tschüss

Wichtige Protokolle der
TCP/IP Familie:





HTTP / HTTPS
Webseiten abrufen
Verschlüsseltes HTTP
FTP
Dateien herunterladen
POP3
Mailbox abrufen
SMTP
Mail versenden
IMAP
Mails verwalten
Der Reihe nach:

Ein Benutzer gibt in der Adressleiste des Browsers eine
URL an – und dann...
DNS (Domain Name Service) – auch ein Dienst des Internet
DNS Server

... löst URL in eine IPNummer auf

Client
(z.B. Browser)
... stellen Anfragen
Router

Router
... weisen den
Informationspaketen an
Kreuzungen ihren Weg
http://www.dnstools.ch/visual-traceroute.html
Client und Server begrüssen sich (HTTP), ...

WWW Server
... schickt HTML-Seite
an Client

Client
... stellen HTMLSeite dar
HTML, die Sprache des Internet
“Die Hypertext Markup Language [..] ist eine
textbasierte Auszeichnungssprache zur Strukturierung
von Inhalten wie Texten, Bildern und Hyperlinks in
Dokumenten.”
Wikipedia, Hypertext Markup Language, (23.8.2010),
http://de.wikipedia.org/wiki/Hypertext_Markup_Language

Die “Auszeichnung” (Markup) geschieht durch Tags,
welche die ausgezeichneten Elemente einschliessen
z.B.:
<i>Hallo</i>

Hallo
Grundgerüst
<!DOCTYPE ... >
<html>
<head>
...
</head>
<body>
...
</body>
</html>
Reines Textdokument: z.B. mit
dem Windows Notepad erstellt
Dateiendung nicht .txt sondern
.html
Lässt sich mit Browser öffnen.
Dieser interpretiert die HTMLElemente und stellt die Seite dar.
HTML-Elemente



Werden gekennzeichnet durch Tag: <tagname>
Die meisten HTML-Elemente benötigen schliessende
Tags: </tagname>
Verschachtelung möglich:



<tag1>...<tag2>...</tag2>...</tag1>
<tag1>...<tag2>...</tag1>...</tag2>
Aber gemäss definierten Regeln
Übliche Tags im Body-Element




Paragraph:
<p>...</p>
Zeilenumbruch:
<br />
Bereich:
<span>...</span>
Überschriften:
<h1>...</h1>
<h2>...</h2>

Tabellen:
<table>
<tr>
<td>...</td>
<td>...</td>
</tr>
<tr>
<td>...</td>
<td>...</td>
</tr>
</table>
Tags im Body mit Attributen

Bild:
<img src="bild.jpg" alt="Bild“ />
(„bild.jpg“ = relativer Pfad)

Link:
<a href="http://www.sbb.ch">...</a>

...
Aufgabe Bild und Link

Erstelle eine kleine HTML-Webseite:
<html>
 Überschrift
<head>
 Text
...
 2-3 Bilder
</head>
 Eine kleine Tabelle
<body>
 Einige passende Links
...
 Lokal abspeichern und im Browser betrachten
</body>
</html>
Links:
 http://www.w3schools.com/tags/default.asp
 http://de.selfhtml.org/html/index.htm
Wenn HTML nicht ausreicht...

Client side (plugins)



JavaScript
Flash
....

Server side



PhP (Datenbanken)
Perl
...
Zusammengefasst
Herunterladen