Tipps für ihre Website:

HTML-Kurs: Eine praxisnahe Einführung
HTML ist zwar keine Programmiersprache, sodass Sie es leicht und schnell erlernen können, bietet aber dennoch eine Menge Möglichkeiten. Dieser Kurs zeigt die grundlegenden Möglichkeiten von HTML auf und erklärt anhand kurzen und einfachen Beispielen, wie HTML funktioniert und wie Sie es für sich nutzen können.

Warmup - was brauche ich?

Beschäftigt man sich das erste Mal mit HTML, ist das erste Problem: "HTML schön und gut, aber wie und wo?". Wie immer gibt es viele Möglichkeiten, eine HTML-Seite zu entwerfen. Im Laufe der Jahre entstanden verschiedene Programme, die das Erstellen von Internetseiten und auch die Umsetzung mit HTML erleichtern und in Teilen sogar ersetzen sollten. Bekannte Beispiele sind Microsofts Frontpage oder das professionellere Tool Macromedia Dreamweaver. Diese Programme sind jedoch zum Einen mit Preisen zwischen 200 und 500 Euro teuer, zum Anderen kompliziert (weil erdrückend umfangreich). Aus diesen Gründen und weil das Erlernen mit einem einfachen Editor (Texteingabeprogramm) lehrreicher ist, empfehlen wir Ihnen zu Beginn ein kleines kostenloses Programm, welches bereits in Microsoft Windows mitgeliefert installiert ist. Der Windows Editor findet sich im Menü unter Start/Programme/Zubehör/Editor.

Mit diesem Editor besitzen Sie im Prinzip alles, was man für die Gestaltung einer Webseite braucht. Um die damit erstellten Werke auch betrachten zu können, sollten Sie noch einen Browser installiert haben. Browser ist das Fachwort für Internetprogramme wie den Microsofts Internet Explorer, Netscape Navigator, Mozilla oder ein Opera Browser. Möchten Sie später eine erstellte Seite betrachten, so starten Sie bitte das Programm und geben den Pfad an, der zu der Datei auf der Festplatte führt (z.B. C:\Eigene Dateien\startseite.html).

Der Aufbau von HTML

Jeder HTML-Befehl wird im Folgenden als Tag (sprich: "Täg") bezeichnet. Tags geben dem Browser Anweisungen über das Aussehen, die Strukturierung und den Verlauf Ihrer HTML-Seite. Alle Tags werden in solche Klammern gesetzt: <Tag>. Jeder Befehl hat einen Gültigkeitsbereicht - gekennzeichnet durch seinen Anfang und sein Ende. Der Anfang wird mit 2 eckigen Klammern gekennzeichnet, das Ende eines Befehls beinhaltet in den 2 Klammern noch ein Slash-Zeichen (/) (sprich: "Släsch"), z.B. </Tag>.

Alle Dateien, welche Sie erstellen, sollten die Endung ".htm" oder ".html" besitzen. Wir empfehlen Ihnen, für alle Seiten und Unterseiten die gleiche Endung zu verwenden, damit das spätere Verlinken (Verknüpfen mehrerer HTML-Seiten untereinander) einfacher wird. Darüber hinaus sollten alle Dateien mit kleingeschriebenen Namen versehen werden, etwa ErsteSeite.htm. Obwohl Zeichen wie Zahlen und Bindestriche erlaubt sind, sollten Sie damit schematisch und sprsam umgehen. Dateinamen wie z.B. 1_seite.htm stellen aber kein Problem dar. Daneben sollten Sie wissen, dass jede Startseite den Namen index tragen muss, damit sie der Browser auch als Startseite erkennt und als Erstes beim Betreten einer Adresse (4aw.de) anzeigt. Ihre Startseite sollte also entweder index.htm oder index.html heißen.

Jede HTML Seite beginnt mit dem Tag <html> und endet mit dem Entsprechenden </html> -Tag. Der Letztere darf aber erst ganz zum Schluss der HTML-Seite stehen, weil dieser das Ende des HTML-Dokuments bezeichnet. Setzen Sie diesen Tag zu früh, wird der Rest der Internetseite nicht mehr oder falsch dargestellt. Danach folgt der Head Teil. Er beginnt mit <head> und endet mit </head>. In ihm sind alle zusätzlichen Informationen für die Website enthalten, die zum Beispiel für Suchmaschinen interessant sein können. So werden hier Daten wie Autor, Titel, Thema und einige besondere Attribute eingefügt. Als Beispiel dient uns der Titel, welcher in der Titelleiste des Browsers angezeigt wird. Man fügt ihn zwischen dem Tag <title> und </title> ein. Darauf folgt der wichtigste Teil des Dokuments - der sogenannte Body. Zwischen dessen Anfang und Ende werden sämtliche Inhalte der Internetseite eingegeben: Texte, Bilder, etc. Im <body> Tag kann zudem auch die Hintergrundfarbe, die Linkfarbe usw. angegeben werden. Wir ändern einfach mal die Hintergrundfarbe. Dies geschieht mittels Attributen. Attribute sind zugelassene Zusätze in einem bestimmten Tag und sehen folgendermaßen aus: bgcolor="#FFFFFF". "bgcolor" ist der Befehl für die Hintergrundfarbe und "#FFFFFF" ist die Farbangabe (in diesem Fall weiss; weitere Farbkürzel finden Sie in der Farbtabelle). Sie können dass Weiss natürlich durch jede beliebige Farbe ersetzen, indem Sie hierzu entweder den englischen Namen dieser Farbe, z.B. "red", eingeben oder geben Sie den Farbwert als Hexadezimalzahl an.

Der folgende Code ist übersichtlich aufgebaut und soll den Einstieg ins HTML-Programmieren erleichtern. Wenn Sie Probleme beim Verstehen einer bestimmten Zeile haben, gehen Sie diese Anleitung noch einmal Zeile für Zeile für Zeile durch. Erst dann öffnen Sie den Editor und fügen den folgenden HTML-Code ein. Speichern Sie danach die Seite wie oben beschrieben und öffnen Sie sie im Browser!
<html>
<head>
<title>Meine erste Website</title>
</head>
<body bgcolor="#FFFFFF">
</body>
</html>


Finden Sie diese Webseite gut ? Dann empfehlen Sie uns doch einem Freund oder Bekannten.

[an error occurred while processing this directive]