Helma Spona - HTML & CSS Schnellkurs

Der Webserver liefert den HTML-Code der angeforderten URL an den Browser.

Der Browser analysiert und interpretiert den erhaltenen Code und stellt ihn entsprechend der Browsereinstellungen, und eventuell vorhandenen Plug-Ins entsprechend dar.

Möchten Sie eine Webseite im Internet veröffentlichen, bedeutet dies also, Sie müssen die dazu notwendigen HTML- und Grafikdateien, auf dem Webserver speichern, denn nur dann, können die Browser der Besucher die Seite von dort anfordern und abrufen. Dazu verwenden Sie wiederum ein FTP-Programm.

Um mit diesem aber die Website veröffentlichen zu können, brauchen Sie Zugang zu einem Webserver, auf dem Sie die Seite veröffentlichen. Den bekommen Sie in der Regel, indem Sie Webspace bei einem Provider mieten.

Damit Sie auch Ihre Zwischenergebnisse, Übungen und Aufgaben veröffentlichen können und sie sich so im Forum besser diskutieren lassen, sollten Sie sich vorab um einen entsprechenden Webspace-Provider kümmern. Generell lassen sich kostenlose, durch Werbung finanzierte Angebote von kostenpflichtigen unterscheiden. Den kostenlosen ist in der Regel gemeinsam, dass Sie sich nicht aussuchen können, welche Werbung eingeblendet wird. Es kann also genauso gut sein, dass auf Ihrer Seite Werbung für Porno-Hotlines erscheint, wie Werbung für Ihre Konkurrenz, falls Sie eine geschäftliche Website einrichten möchte. Darüber hinaus können Sie oftmals nicht einmal die Position der Werbung bestimmen und müssen somit bei dem Layout Ihrer Website darauf Rücksicht nehmen.

Daher sollten Sie kostenlose werbefinanzierte Angebote nur dann wählen, wenn Sie die paar Cent für kostenpflichtige Angebote nicht aufbringen möchten oder können.

Bei den kostenpflichtigen Angeboten finden Sie im Prinzip schon für ein paar Cent im Monat Anbieter, die entsprechend guten Service liefern, und ausreichend viel Speicherplatz und eine Domain zur Verfügung stellen. Für eine einfache Website die vielleicht eine kleine Bildergalerie beinhaltet und ansonsten HTML und CSS nutzt, wie dies die meisten private und kleinere geschäftliche Websites tun, reichen Webspace-Angebote aus, die folgende Bedingungen erfüllen.

100 MB Speicherplatz

1 Domain

1 E-Mail-Postfach mit E-Mail-Adresse

10 GB Traffic

Als Traffic wird im Zusammenhang mit Webspace-Tarifen der Datenverkehr bezeichnet, der durch Ihre Website verursacht wird, wenn Benutzer Daten an Ihre Website senden, aber vor allem, wenn der Browser die einzelnen Dateien abruft. Je kleiner die Dateien sind und je weniger Besucher Ihre Website hat, desto weniger Traffic erzeugt sie. Überschriften Sie das im Tarif enthaltene Traffic-Volumen, wird der zusätzliche Traffic in der Regel zusätzlich berechnet.

Möchten Sie später Ihre Website erweitern und auch serverseitige Skripte und eventuell eine Datenbank verwenden, ist es optimal, wenn Ihr Webspace PHP als serverseitige Skriptsprache und eine MySQL oder SQL-Datenbank beinhaltet. In der Regel können Sie bei einem guten Provider aber jederzeit Ihren Tarif aufstocken, um mehr Leistungen zu erhalten.

Sehr gute Provider, die für alle Zwecke passende Tarife haben listet die folgende Tabelle auf. Zu den angegebenen Preisen pro Monat für die Tarife kommen oftmals allerdings noch Einrichtungsgebühren, die in der Regel einmal anfallen und meist unter 20 € liegen.

Tabelle 1: Preiswerte Tarife der Marktführer

Mein Favorit ist seit Jahren Hosteurope. Die Tarife sind nicht nur preiswert und zuverlässig, auch der E-Mail- und Telefonsupport ist vorbildlich. Achten Sie gerade für den Anfang darauf, dass keine extrem teuren Hotline-Nummern angeboten werden, auf die Sie dann angewiesen sind. Das kann schnell ins Geld gehen, wenn Sie mal Hilfe benötigen.

Achten Sie darauf, einen Tarif mit FTP-Zugang zu buchen und keinen Tarif, mit dem Sie ausschließlich vorgefertigte Homepagevorlagen oder so genannte Homepagebaukästen nutzen können. Ein FTP-Zugang ist die unbedingte Voraussetzung dafür, dass Sie eigene HTML-Dateien hochladen können.

Websites werden mithilfe von HTML oder XHTML erstellt, außer es kommen serverseitige Programmier- und Skriptsprachen zum Einsatz. Diese sind nicht Thema des Kurss und werden daher nicht weiter behandelt.

XHTML ist wie HTML eine Auszeichnungssprache, die alternativ zu HTML verwendet werden kann, um Webseiten zu erstellen. Die Abkürzung steht für Extensible Hypertext Markup Language. XHTML verwendet dazu weitgehend die gleichen Elemente auch wenn es feine Unterschiede gibt. Wo notwendig, wird nachfolgend auf die Unterschiede hingewiesen.

Wenn es um Aussagen geht, die auf HTML und XHTML zutreffen wird nachfolgend die Bezeichnung (X)HTML verwendet, die "HTML und/oder XHTML" bedeutet.

Die Formatierung sollte bei modernen Websites mithilfe von CSS erfolgen. HTML sorgt für den Inhalt und den Aufbau der Website, CSS für die Formatierung. Die Darstellung übernimmt der Browser des Benutzers, indem er den (X)HTML-Code und den CSS-Code, so gut es geht, interpretiert und darstellt.

Und genau hier liegt das erste Problem. Der Browser "interpretiert" den Code der Seite. Das führt dazu, dass es Differenzen bei der Darstellung des gleichen Codes in verschiedenen Browsern und sogar verschiedenen Browsern gibt. Das ist ein wichtiger Aspekt bei der Gestaltung von Websites. Darüber hinaus sollten Sie aber, insbesondere wenn Sie eventuell aus dem Print-Bereich kommen noch weitere Aspekte des Mediums "Internet" beachten.

Das Internet ist ein ganz besonderes Medium. Anders als Papier bietet es kein definiertes Format, das heißt keine Größe, die man beim Design berücksichtigen kann. Layouten Sie beispielsweise ein Prospekt in A4-Größe und kennen die Anforderungen der Druckerei, können Sie daran Ihr Layout anpassen. Sie wissen dann, welche und wie viele Farben Sie nutzen können, welche Seitenränder Sie mindestens einhalten müssen und wie klein die Schrift sein darf, um noch gut lesbar zu sein.

All das kennen Sie beim Webdesign nicht. Die Besucher haben unterschiedliche Auflösungen, Monitore, Betriebssysteme und Browser. Das alles wirkt sich darauf aus, wie eine Seite beim Betrachter dargestellt wird, ob er alles lesen kann, ob die verwendeten Schriftarten vorhanden sind oder vielleicht viel zu kleine Ersatzschriftarten genutzt werden.

Aus all diesen Gründen sollten Sie sich von dem Gedanken verabschieden, dass eine gute Webseite auf jedem Rechner gleich aussehen muss. Vielmehr muss eine gute Seite folgende Anforderungen erfüllen:

Die Inhalte sollten auf allen Rechnern und mit jedem Browser lesbar sein.

Die Seite sollte barrierefrei und auch für Screenreader zugänglich sein.