02233-7128442
info@agent-media.com


HTML Programmierung: Die Grundlagen

Das Kürzel HTML steht für Hypertext Markup Language. Es handelt sich dabei um eine Syntax, die es erlaubt eine Webseite, ähnlich anderen Dokumenten, zu strukturieren. Zu den vorgesehenen Elementen gehören zum Beispiel Überschriften, Absätze, nummerierte und unnummerierte Listen, Tabellen sowie Formulare mit ihren Eingabefeldern. Heute werden Webseiten in HTML 5 programmiert. Gegenüber früheren Varianten (XHTML) sind einige neue Textauszeichnungen dazugekommen. Dazu gehören Navigationen, Abschnitte und Nebenspalten, die nicht zum Hauptinhalt gehören. Den Elementen sind sogenannte Tags (englisch ausgesprochen) mit unterschiedlichen Namen zugeordnet. Sie beginnen mit <Tag-Name> und enden mit </Tag-Name>. Manche Elemente können keine weiteren Elemente enthalten. Bei ihnen kann das schließende Tag weg gelassen werden. Zur Verdeutlichung des sofortigen Tag-Endes kann man solch ein inhaltsleeres Tag aber auch als <Tag-Name /> schreiben.

Ein einfaches HTML-Dokument

Jedes gültige HTML-Dokument gliedert sich in einen HEAD und einen BODY-Teil. Der HEAD beinhaltet Meta-Angaben wie zum Beispiel Zeichensatz (in der Regel UTF-8 für internationale Buchstaben), Titel und Sprache der Seite. Auch Referenzen zu externen Dateien sind hier zu finden. Im BODY stehen die Elemente, die im Browserfenster sichtbar werden.

Code

<!DOCTYPE html>
<html>
    <head>
        <title>Einfaches HTML-Dokument</title>
        <meta charset="utf-8" />
        <link href="meine-styles.css" rel="stylesheet" />
    </head>
    <body>
        <h1>Überschrift HTML-Programmierung</h1>
        <p class="mein-absatz-stil">
            Der Inhalt des Absatzes.
        </p>
    </body>
</html>

Im BODY sind eine Hauptüberschrift durch <h1> und ein regulärer Absatz mit <p> gekennzeichnet.

Innerhalb des Tags können noch Attribute stehen. So werden zum Beispiel Stil-Klassen (Hier: class="mein-absatz-stil") zugewiesen, um dem Tags ein individuelles Aussehen zuzuweisen. Diese Stile, also die Design-Anweisungen, werden in einer eigenen Datei ausgelagert. Für das Design der HTML-Elemente wurde die Sprache CSS (Cascading Style Sheets) entwickelt. Die CSS-Datei (Im Beispiel "meine-styles.css") ist im HEAD-Bereich verknüpft.

Mehr als HTML: CSS & Javascript

Zur HTML Programmierung gehört wie erwähnt auch die eigenständige Styling-Sprache CSS. In der neuesten Version CSS3 sind sogar Animationen und Farbverläufe Teil der Sprachdefinition. Für fortgeschrittene Techniken, zum Beispiel das Nachladen von Inhalten, nachdem die Seite bereits im Browser aufgebaut ist (Stichwort AJAX), benötigt der HTML-Entwickler noch eine dritte Technik namens JavaScript. Hierbei handelt sich um eine ausgewachsene Programmiersprache, mit der sich das HTML-Dokument auf Nutzeraktion, zum Beispiel Klick auf einen Button, dynamisch manipulieren lässt.

Meine Dienstleistungen im Bereich HTML Programmierung

Ich unterstütze Sie als Freelancer bei der Entwicklung Ihrer HTML-Seiten. Egal, ob Sie einen Relaunch planen oder einen komlpett neuen Webauftritt realisieren möchten. Nehmen Sie einfach Kontakt zu mir auf oder informieren Sie sich über meine Stundensätze auf der Seite Skills & Preise.