Eine Einführung in (X)HTML, CSS und Webdesign

3. Wie lerne ich HTML?

  Der Aufbau eines HTML-Dokuments

HTML für Anfänger

Dave Raggett arbeitet für das World Wide Web Consortium (W3C) und ist einer der führenden Entwickler von HTML. Er hat eine wunderbare, gut strukturierte und einfache HTML-Einführung geschrieben. Er erläutert in kurzen prägnanten Abschnitten den Aufbau eines Seiteninhalts und stellt Ihnen wesentliche HTML-Elemente wie Überschriften oder Absätze vor. Auf dieser Seite erfahren sie außerdem, wie man Bilder und Hyperlinks in seine Seite einbindet und wie man unterschiedliche Arten von Listen erstellt.

Bitte lesen Sie sich den Text sorgfältig und ohne Hast durch. Versuchen Sie, die wenigen HTML-Elemente, die Ihnen vorgestellt werden, zu verstehen. Schreiben Sie ihre ersten Seiten und versuchen Sie, alle Ihnen nun bekannten Elemente einzubinden. Sie lernen nur sehr wenige Elemente und Tags in der kleinen Einführung kennen, aber das macht den Text übersichtlich und es Ihnen einfach, mit den Elementen zu hantieren.

Lernen Sie anhand dieser kurzen Einleitung und lesen Sie dann bitte zunächst hier wieder weiter.

Nach der Lektüre des Artikels dürften Sie nun ein HTML-Dokument dieser Art fertigstellen können:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>

<head>
  <title>Mein erstes HTML-Dokument</title>
</head>

<body>

  <h1>Meine erste HTML-Seite</h1>

  <p>Sie sind nun in der Lage, eine <em>eigene</em> HTML-Seite zu schreiben. Sie können bereits:</p>

  <ul>
    <li>Eine HTML-Dokumentenstruktur erstellen</li>
    <li>Den Dokumententyp deklarieren</li>
    <li>Einen Titel einfügen</li>
    <li>Den Inhalt des Bodys in Überschriften und Absätze logisch gliedern</li>
    <li>Listen wie diese erstellen</li>
    <li>Bilder und Hyperlinks in ein Dokument einfügen</li>
  </ul>

  <h2>Beispiele</h2>

  <p>Zur Verdeutlichung und Belustigung ein kleines Bild:</p>

  <img src="loriot.jpg" width="404" height="253" alt="Ein Comic von Loriot">

  <p><a href="3.2.htm">Zurück</a> zur Einführung</p>

</body>

</html>

logische und physische Textauszeichnung

Logische Textauszeichnung

Es gibt außer dem <em>-Tag noch weitere Möglichkeiten, einen Text per HTML mit einer bestimmten Bedeutung zu formatieren:

<del> und <ins> werden stets im Zusammenhang benutzt. Einem nicht mehr gültigen Text folgt sogleich der neu dazu gekommene.

Alle Formatierungen wurden hier zur Anschauung ungeachtet ihrer wirklichen Bedeutung verwendet. Dies ist ansonsten natürlich zu vermeiden. Sehen Sie die Formatierungen keinesfalls als Mittel zu optischen Darstellung von Text, sondern beachten Sie bei Verwendung dieser Elemente immer, dass sie eine entsprechende Bedeutung beinhalten.

Physische Textauszeichnung

Zur reinen optischen Auszeichnung werden die Elemente der physischen Textauszeichnung verwendet. Ich liste Ihnen diese Elemente hier einmal auf, obwohl sie eigentlich dem HTML-Gedanken widersprechen und statt dessen CSS-Definitionen verwendet werden sollte.

  Die HTML-Einführung für Fortgeschrittene von Dave Raggett


Letzte Änderung: 07. März 2001

valid XHTML 1.0! Valid CSS!