HTML für Anfänger – Textformatierung

Ich will hier nicht darauf eingehen, wie man einen Artikel schreibt, sondern welches HTML-Werkzeug (Befehle) für eine gute Formatierung des Inhalts wichtig sind. Schreibt man einen Artikel in HTML benötigt man auch HTML-tags, damit die Schrift, Absätze, fett Gedrucktes etc. vom Browser erkannt und richtig dargestellt werden.

Wie funktioniert nun ein HTML-tag?

Eigentlich ist dies einfach zu beschreiben – nehmen wir ein Beispiel. Ich will, dass ein Wort „fett“ gedruckt auf dem Bildschirm erscheint. Dazu muß der Browser eine Anweisung (einen HTML-tag) erhalten, damit er weiß, daß das folgende Wort „fett“ dargestellt werden soll. Hierzu gebe ich vor dem Wort den „tag“ <b> (b für bold oder fett) ein, dann das entsprechende Wort und schließe den Befehl mit einem „Endtag“. Beim Endtag steht nur ein Querstrich vor dem ursprünglichen Befehl – Beispiel: Das Wort zwischen den beiden tags wird nun fett vom Browser dargestellt.

Das Prinzip ist also ganz einfach – es gibt Anweisungen, die in eckige Klammern geschrieben werden bzw. davon immer eine Anfangs- und Endanweisung. Alles was zwischen diesem Befehl oder tag steht, wird entsprechend vom Browser verarbeitet.

Was kann man nun mit dieser Info anfangen?

Eine ganze Menge, wenn man auch nur wenige HTML-tags kennt. Ich geben Ihnen hier eine kleine Liste von wichtigen HTML-tags, die man (fast) immer braucht, wenn man Texte schreiben will.

Überschriften
HTML-tag <h1>
Die Nummer hinter dem "h" bezeichnet die Schriftgröße einer Überschrift. Wobei <h1> die größte Schrift ist, <h2>die nächst kleinere, <h3> noch kleiner etc. (diese sind jedoch immer noch größer formatiert als die "Normalschrift").
Anwendung: <h1>Überschrift</h1>

Wörter fett setzen
HTML-tag <b>
Anwendung: <b>fettes Wort</b>

Absätze machen
HTML-tag <p>
Anwendung: <p>"Text der im Absatz steht"</p>

Zeilenumbruch
HTML-tag <br>
(Anmerkung: dies ist eine der wenigen Ausnahmen, welche keinen Endtag benötigen – man schreibt ihn einfach hinter die Zeile, die umgebrochen werden soll – fertig!)

Wörter kursiv setzen
HTML-tag <i>
Anwendung: <i>kursives Wort</i>

Wörter unterstreichen
HTML-tag <u>
Anwendung: <u>unterstrichenes Wort</u>

Link auf eine andere Seite setzen
HTML-tag <a href="X">Y</a>
Anwendung: An der Stelle, an dem hier das "X" steht, fügen Sie bitte die URL des Links ein – Beispiel: http://www.link.de. – diese ist für den User im Browser unsichtbar. An der Stelle von "Y" können Sie einen Linknamen eingeben z.B. Link.de d.h. alles, was an dieser Stelle steht, erscheint als Link und ist für den User sichtbar (ein unterstrichenes Wort, auf das er klicken kann und zur gewünschten Adresse kommt).

Dies als kleinen Einstieg in HTML. Für diesen Artikel hier habe ich auch nur die angegebenen HTML-tags verwendet. Das Ganze ist zwar ein wenig gewöhnungsbedürftig, aber mit einiger Übung kann man selbst mit diesen wenigen tags schon einfache Artikel HTML-gerecht formatieren.

Kleiner Tip am Rande:
Falls Sie so Texte verfassen, sehen Sie sich die Texte, bevor Sie sie veröffentlichen nochmal im Browser an. Ein Endtag oder ein Zeilenumbruch ist schnell vergessen – dann sieht das Ergebnis entsprechend übel aus. Wenn Sie Texteditoren wie Textpad oder Notepad verwenden, brauchen Sie die Datei nur mit der Endung „Dateiname.htm“ abspeichern, um daraus eine Datei zu machen, die der Browser lesen kann.

Tony Kühn