Tag Drei

CSS Reset

Jeder Browser hat seine eigenen Standardwerte zur Darstellung von HTML Elementen. Schriftarten, Grössen, Abstände und Farben können dabei abweichen. Um eine einheitliche Darstellung über alle Browser zu erreichen, setzt man üblicherweise via CSS einige Formatierungen auf einen gemeinsamen Standard zurück.

Einige Standards wurden von der Community entwickelt, wie z.B. Normalize CSS, Mini CSS Reset oder Meyerweb CSS Reset.

Für unseren Kurs erarbeiten wir uns jedoch ein eigenes CSS Reset, beginnend mit:

            * {
  margin: 0;
  padding: 0;
}
        

Das Fundament einer Website

Mit dem aktuellen Wissensstand lässt sich bereits eine Website entwickeln, welche auf Desktop brauchbare Darstellungen ermöglicht. Bis daraus eine effektive Website wird, welche allen Nutzern und Endgeräten gerecht wird, braucht es noch einiges an weiterem Wissen. Aber die Basics der letzten beiden Tage ergeben das Fundament, welches als Grundlage jeder Website dient.

Es ist deshalb an der Zeit, das gelernte in praxisnahen Beispielen anzuwenden und an Erfahrung zu gewinnen.

Meine erste Website

Das "Design"

HTML Layout

CSS Styles

            * {
  margin: 0;
  padding: 0;
}

body {
  font-family: Arial, Helvetica, sans-serif;
  color: white;
}

.container {
  background-color: DodgerBlue;
  padding: 50px;
  width: 800px;
  margin-top: 20px;
}

img {
  width: 100%;
  margin: 20px 0;
}

p {
  font-size: 18px;
}

a {
  font-weight: bold;
  color: black;
}
        

IP-Adresse

Eine IP-Adresse ist eine individuelle Adresse, die ein Gerät im Internet oder auf einem lokalen Netzwerk identifiziert. IP steht für „Internetprotokoll“, wobei es sich um einen Satz von Regeln handelt, der das Format der Daten bestimmt, die über das Internet oder das lokale Netzwerk gesendet werden.

Im Wesentlichen sind IP-Adressen das Erkennungsmerkmal mit dem Informationen auf einem Netzwerk zwischen Geräten gesendet werden können: Sie enthalten Standortinformationen und machen die Geräte zu Kommunikationszwecken zugänglich. Das Internet benötigt ein Verfahren, um zwischen verschiedenen Computern, Routern und Webseiten unterscheiden zu können. Mit IP-Adressen ist dies möglich. Diese bilden einen wesentlichen Teil der Funktionsweise des Internets.

Die IP Adresse deiner aktuellen Internetverbindung ist einfach herauszufinden. Das geht mittels simpler Google-Suche oder mit Services wie iplocation.net, bei der auch gut einen Eindruck über seine digitale Datenspur gewonnen wird.

Domain Name Server (DNS)

DNS heisst Domain Name System und ist für die Namensauflösung eines Domainnamens in eine IP-Adresse zuständig. Menschen kennen Domainnamen wie «sfgbasel.ch», Computer kennen aber nur IP-Adressen mit welchen sie andere Computer im Netzwerk ansprechen können.

Da sich Menschen Buchstaben besser merken können als Zahlen, braucht es ein System, welches «sfgbasel.ch» in «94.230.213.38» umwandeln kann. So kann ein Computer zum entsprechenden Server finden, welcher nachher die Website für «sfgbasel.ch» ausgeben kann.

Internet Seekabel

Wenn wir heute eine amerikanische oder asiatische Website öffnen, machen wir uns keine Gedanken mehr darüber, dass in den meisten Fällen die Daten tatsächlich im entsprechenden Kontinent gelagert sind. Das heißt, Signale müssen binnen von Milisekunden um den halben Erdball reisen. Das ist nur möglich mittels eines globalen Netzwerks an optischen Unterseekabeln mit gewaltigen Bandbreiten.

Wer schon immer mal wissen wollte, wo diese Lebensadern des Internets eigentlich verlaufen, der sollte einen Blick in die Weltkarte werfen. Sie zeigt auf beeindruckende Art, wie viele dieser Kabel den Globus umspannen, und enthält außerdem Informationen über Kapazitäten, Wachstum und Betriebskosten solcher Kabel.

Challenge #1

Nun gilt es ernst, versuche mit dem gelernten Wissen folgende Website nachzubauen. Kommst du nicht weiter, hilft dir bestimmt Inspektor Gadget.

Quellenangabe