HTML Tags

Tags Grundlagen

Tags dienen dazu, HTML-Elemente wie z.B. Text zu formatieren. Damit können Überschriften, Paragraphen (Textabschnitte), Zeilenumbrüche, Listen und viele weitere Formatierungen hinzugefügt werden. Die meisten HTML-Elemente werden durch ein Tag-Paar markiert, das heißt durch einen Starttag und einen Endtag, wie zum Beispiel <strong>Fett markiert</strong>, wobei gilt:

<strong> = öffnender Tag
</strong> = schliessender Tag

Der schliessende Tag unterscheidet sich vom öffnenden nur dadurch, das nach der voranstehenden spitzen Klammer ein Schrägstrich steht.

Gewisse Tags sind alleinstehend, wie zum Beispiel <br> (= Line Break, Zeilenumbruch) oder <img>.

Tags enthalten zudem oft Attribute und deren zugehörigen Werte, wie zum Beispiel
<img src="bilder/portrait.jpg">
wobei src ("Source") das Attribut und der Bildpfad ("bilder/portrait.jpg") den Wert darstellt.

Attribute und Werte sind mit einem Gleichheitszeichen verbunden und die Werte stehen in Anführungszeichen. Es darf kein Abstand vor und nach dem Gleichheitszeichen sein.

Tags Schreibweisen

Gross-/Kleinschreibung

Tags und Attribute sind nicht case-sensitive, können also klein oder gross geschrieben werden:
<BODY> ist dasselbe wie <body>, <br> dasselbe wie <BR>.

Hingegen sind Werte wie Pfadangaben ("bilder/portrait.jpg") case-sensitive, da Webserver bei Dateinamen und -Pfaden zwischen Gross- und Kleinschreibung unterscheiden.
"index.html" ist also ungleich "INDEX.HTML".
Siehe auch Dateibenennungen und Dateipfade.

Anführungszeichen


Als Anführungszeichen darf auschliesslich nur das Maschinensatz-Anführungszeichen verwendet werden, welches z.B. auch bei Zollmassen zum Einsatz kommt. Typografische Anführungszeichen mit öffnendem/schliessendem Teil sind in der HTML-Programmierung nicht zulässig. Je nach Tastaturkonfiguration Deutsch, Französich, Englisch und Betriebssystem Mac/Windows muss das korrekte Anführungszeichen anders eingetippt werden.

Tags Standardwerte

Es ist ohne weiteres möglich, ein HTML Dokument ohne jegliche Designauszeichnungen (CSS) zu erstellen. Die Browser werden dafür Standardwerte verwenden. Denn bezüglich der Formatierung von HTML Elementen, basieren Tags auf Standartwerten, seien dies Hintergrund-, Schrift und Linkfarben, Schriftgrössen, Elementgrössen usw. So ist zum Beispiel die Hintergrundfarbe standardmässig weiss, die Schriftfarbe schwarz, Links sind blau, besuchte Links violett. Als Schrift wird die voreingestellte Standardschrift des Browser genommen, wie auch die Standardschriftgrösse. Es gibt zwischen den Browsern gewisse Abweichungen der Standardwerte. So können Titelgrössen, Schriftgrössen, Zeilenabstände und anderes zwischen Chrome, Firefox., Safari und Explorer durchaus variieren, wenn auch meistens nur geringfügig.

Für komplexere Website Projekte wird deshalb vor dem eigenen CSS noch ein spezielles CSS geladen, welches alle Tag-Standardwerte vereinheitlicht. Bekannt ist diesbezüglich vor allem "Normalize.css" , welches zum Beispiel bei Twitter, Github, Soundcloud, Bootstrap und anderswo zum Einsatz kommt.

Tags Liste

Tags sind vom WW3 Konsortium festgelegt und genormt. Auf der W3School sind sie verbindlich aufgelistet.

 

Einige HTML Tags für den Anfang

 

Öffnend Schliessend Eigenschaft
<!– –> Kommentar
<a> </a> Hyperlink
<body> </body> Körper – Gesamtheit der sichtbaren Fläche
<br> Zeilenumbruch
<div> </div> Blockartiger Abschnitt eines Dokumentes
<em> </em> Text kursiv
<h1>-<h6> </h1>-</h6> Überschriften gross bis klein
<head> </head> Informationen zum HTML Dokument (nicht sichtbar)
<hr> Waagrechte Linie
<html> </html> Beginn/Ende des HTML Dokumentes
<iframe> </iframe> Inline Frame – Rahmen für Inhalte einer externen Website (zB. Youtube oder Google Maps)
<img> Image – Bild
<li> </li> Element einer Liste (ul, ol)
<ol> </ol> Nummerierte Liste
<p> </p> Paragraph (Abschnitt)
<span> </span> Kliner Abschnitt (geht auch innerhalb einer Zeile)
<strong> </strong> Text fett (veraltet: <b>…</b>)
<ul> </ul> Unnummerierte Liste