20. Dezember 2009
Inhalte im Internet zu veröffentlichen ist so leicht wie noch nie zuvor. Der großteil der verfügbaren CMS bieten ihren Nutzern komfortable Editoren, die beim Formatieren von Text helfend unter die Arme greifen. So ist es nicht erforderlich sich mit der Auszeichnungssprache HTML auseinander zu setzen. Doch manchmal kann es sehr hilfreich sein ein paar grundlegende Dinge darüber zu wissen. Wir stellen Ihnen nun ein paar wichtige HTML Auszeichnungen, sogenannte Tags vor und erklären deren Verwendung.
Grundlegendes
HTML Tags, oder auch HTML Auszeichnungen bestehen in der Regel aus einem öffnenden und einem schließenden Tag, der schließende Tag wird mit einem Slash "/" gekennzeichnet.
Als Beispiel:<öffnen> </schließen>Der zu kennzeichnende Text kommt zwischen die Tags. Die Ausnahme der Regel bilden sogenannte Short-Tags, wie sie beispielsweise bei Zeilenumbrüchen verwendet werden.
Überschriften - Headlines
Überschriften werden mit dem <h#> Tag ausgezeichnet, das h steht für das englische Wort Headline, unterschieden wird nach sechs unterschiedlichen stärken der Überschrift. Als Beispiel:
<h1>Überschrift erster Ordnung</h1>
<h2>Überschrift zweiter Ordnung</h2>
<h3>Überschrift dritter Ordnung</h3>
<h4>Überschrift vierter Ordnung</h4>
<h5>Überschrift fünfter Ordnung</h5>
<h6>Überschrift sechster Ordnung</h6>
Absätze / Paragraph
Das HTML Tag <p> kennzeichnet einen Absatz und ist genau wie das <h#> Tag ein Blockelement, es erfolgt also ein automatischer Zeilenumbruch.
Ein Bespiel zur Verwendung:<!-- Erster Absatz -->
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Aenean commodo ligula eget dolor. Aenean massa. Cum sociis
natoque penatibus et magnis dis parturient montes, nascetur
ridiculus mus.</p>
<!-- Zweiter Absatz -->
<p>Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.
Nulla consequat massa quis enim. Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu.</p>
Würde so dargestellt werden:
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.
Sie sehen die Abstände der beiden Absätze zueinander ist größer als der Zeilenabstand. Innerhalb des <p> Tag dürfen nur Inline Elemente angewandt werden.Links
Für sogenannte Hyperlinks ist das <a> Tag zuständig (a = anchor = Anker). Hierbei ist es erstmalig nötig weitere Attribute anzugeben. Die Minimalform eines Links würde folgendermaßen aussehen:
<a href="http://www.ezuri.de"></a>
Das Attribut "href" (href = hyper reference = Hyper Referenz) gibt dabei das Ziel des Links an. Um den Link sichtbar zu machen ist es allerdings notwendig ihm Inhalt zu geben, das kann zum Beispiel ein Bild oder auch Text sein. Diesen Text bezeichnet man als Ankertext.
<a href="http://www.ezuri.de">ezuri.de</a>
Weiterhin ist es möglich dem Link ein Titel-Attribut mit auf den Weg zu geben:
<a href="http://www.ezuri.de" title="ezuri.de Webdesign">ezuri.de</a>
| < Zurück | Weiter > |
|---|