• HTML steht für " Hypertext Markup Language " .
  Webseiten werden in der Seitenbeschreibungssprache HTML geschrieben .
  
• HTML-Dokumente erkennt man an der passenden Endung ( .htm oder .html - die Endung .htm ist DOS - kompatibel ) .
  
• HTML-Dokumente sind reine , uncodierte Textdokumente (ASCII), die mit dem Standard - Editor ( Notepad bei Windows, SimpleText bei Mac ) geöffnet und bearbeitet werden können .
  

Webseiten bestehen also im Grunde aus reinem Text . Das Wunderbare an Sprachen wie HTML ist , dass die Programmierung nicht verschlüsselt ist . Wie eine bestimmte Webseite aufgebaut bzw. programmiert ist , kann deshalb sehr leicht eingesehen werden . Beim Internet Explorer könnt ihr dafür z.B. auf 'Ansicht > Quelltext anzeigen' gehen [ schneller : Rechtsklick > Quelltext anzeigen , beim Navigator ziemlich identisch ) .
Sehen wir uns einen solchen Quelltext, engl. Source Code , einmal an :

Auf den ersten Blick mag das alles recht kompliziert erscheinen . Glaubt mir , HTML und auch CSS sind einfach . Wenn ihr die nächsten sieben Kapitel [ bis und mit ' Trennlinien , Listen ' ] durcharbeitet und versteht , werdet ihr vielleicht 90% dieses Quellcodes mühelos lesen bzw. selber anwenden können .

Wie schon erwähnt , können HTML - Dokumente mit jedem reinem Texteditor erstellt werden . Unter Windows ist der standardmässige Texteditor das Notepad , beim Mac Simple Text (korrigiert mich, Mac-user, falls nötig :).

Öffnet ihr ein Dokument mit der Endung .txt (z.B. Readme.txt) , wird es im Notepad geöffnet . Beim Internet Explorer werden HTML-Dokumente darin geöffnet , falls ihr die Option 'Quelltext anzeigen' ausgewählt habt . Das Notepad lässt sich ausserdem über 'Start > Programme > ... > Notepad' öffnen , u.U. schneller noch mit 'Start > Ausführen > notepad' ... . oder ihr geht in die 'MS-DOS-Eingabeaufforderung' und gebt 'notepad.exe' ein ... oder ihr erstellt eine Verknüpfung auf dem Desktop ... oder ... ;)

Winword und ähnliche Textverarbeitungsprogramme sind total ungeeignet , da sie den Text codieren .

Es gibt jedoch auch spezielle HTML - Editoren , die einem viel Arbeit ersparen können . Unter www.meybohm.de gibt es z.B. einen ziemlichen guten HTML - Editor ( Freeware ) .

Auf sog. WYSIWYG-Editoren (What You See Is What You Get) wie Frontpage u.ä. sollte verzichtet werden - diese generieren den HTML-Code selber , sehr häufig mit dem Resultat von schludrigen bzw. schlecht programmierten Seiten . Wenn schon, dann Dreamweaver.

Eine Zusammenstellung von weiteren nützlichen Programmen ( Grafik , Verwaltung , ... ) findet ihr auf der Seite Software / Tools .

Die einzelnen Befehle innerhalb HTML nennt man Tags .

(Achtung! HTML ist eigentlich keine Programmiersprache, Tags sind [daher] auch keine Befehle! Nennt sie einfach Tags. Wenn ihr mit HTML und CSS arbeitet, bezeichnet man das auch nicht als Programmieren, sondern als Coden/ Coding.)
Tags stehen immer innerhalb von < > - Klammern .

die meisten Tags sind Container-Tags - sie schliessen ein bestimmtes Element ein ( contain = engl. einschliessen ) . Das abschliessende Tag ist mit dem einleitenden bis auf einen einleitenden Schrägstrich / identisch .

dies ist ein Absatz , eingeschlossen in einem <p>...</p> -Tag ( p = engl.paragraph = Absatz ) .

• Dies ist eine ungeordnete Liste -
• Anfang und Ende der Liste werden mit Hilfe des <ul>...</ul> - Tags definiert ( ul = unordered list ) .
• jeder einzelne Listenpunkt kommt innerhalb eines <li>...</li> - Tags zu stehen .

Wie im letzten Beispiel ersichtlich ist , können Tags miteinander verschachtelt werden :

Neben den Container - Tags gibt es auch einige wenige Stand-Alone Tags , z.B <br> ( Zeilenumbruch ) oder <img src="[pfad]"> ( Einbinden einer Grafik ) .

meistens lassen sich noch gewisse Attribute innerhalb des Tags hinzufügen , um ihn näher zu spezifizieren :

Damit Text auch bei Anwendern mit anderen Zeichensätzen ( also z.B. bei einem Amerikaner oder einer Finnin ) korrekt dargestellt wird , müssen bestimmte 'spezielle' Zeichen mit Hilfe von Sonderzeichen notiert werden .

Die wichtigsten Sonderzeichen betreffend der deutschen Sprache sind :

werden innerhalb von <!-- und --> definiert .

Wie ersichtlich ist , dienen Kommentare nur der Orientierung der Person , welche den Quellcode liest bzw. bearbeitet . Im 'normalen' Darstellungsmodus via Browser sind Kommentare nicht sichtbar .

Dateien und Adressen können innerhalb eines HTML-Dokumentes auf zwei Arten eingebunden werden : mittels relativer oder absoluter Pfadangabe.

absolute Pfadangabe

ist am einfachsten . Hierbei wird die gesamte Adresse eingefügt , mit 'http://' o.ä. :

• Eine absolute Pfadangabe ist nötig , falls sich die referenzierte Datei auf einer anderen Domain befindet .

relative Pfadangabe

Bei einer relativen Pfadangabe wird die Adresse der betreffenden Datei jeweils im Verhältnis zum einzelnen Dokument notiert . Muss auf eine hierarchisch höhere Verzeichnisebene gewechselt werden , notiert man zwei Punkte ( .. ) :

Beispiele : <a href="links.html"> HTML I : Links</a> <img src="xild01.jpg" width="200" height="133"> <a href="../index.html">flexdax.org</a> ergibt : HTML I : Links       flexdax.org

Vorteile einer relativen Einbindung :

• Bei einer Verschiebung der Daten ( andere Domain etc. ) muss nicht jedes einzelne Dokument nachträglich abgeändert werden .
• Ausserdem ist eine relative Adressierung die einzige vernünftige Möglichkeit , das Projekt auch lokal ( = von der eigenen Festplatte aus ) auszuprobieren . Bei einer absoluten Adressierung ist das Testen und 'Surfen' auf den erstellten Seiten nicht möglich .