Element, Tag, Attribut. Ein für allemal.

Achtung: dieser Beitrag ist alt! Es kann gut sein, dass seine Inhalte nicht mehr aktuell sind.

Element, Tag, Attribut

Anders als bei der Causa HTML5 gibt es hier keine Ausreden. Wenn das da oben durcheinander gebracht wird, sind Missverständnisse und Chaos vorprogrammiert. So gehet nun hin und lehret den Unwissenden, auf dass man nie wieder rätseln muss, was jemand mit der Strong-Tag überhaupt meint.

Kommentare (15)

  1. Bernd

    1. Juni 2010, 12:18 Uhr

    Wunderbar auf den Punkt gebracht. Danke !

  2. Gerrit van Aaken

    1. Juni 2010, 12:21 Uhr

    Man könnte das Attribut noch in Attributschlüssel und Attributwert aufteilen.

  3. Nils R

    1. Juni 2010, 12:22 Uhr

    Vielleicht noch "Wert" für Foobar? Ansonsten stimmt das fast 1:1 mit meiner Grafik überein, die ich dummerweise nie bloggte…

  4. Peter

    1. Juni 2010, 12:25 Uhr

    Zitat Gerrit van Aaken:

    Man könnte das Attribut noch in Attributschlüssel und Attributwert aufteilen.

    Man könnte, aber ich sehe das nicht so oft verwechselt. Außerdem gibt es ja auch nicht immer beides.

  5. Gerald (hyperkontext)

    1. Juni 2010, 13:02 Uhr

    Yep, kurz und knackig aufgezeichnet. Hierher kann zu gegebenem Anlass dann (wortlos) verlinkt werden. Thx

  6. Perun

    1. Juni 2010, 13:03 Uhr

    <ironie>Und wie schaut das mit dem alt-Tag, dem canonical-Tag und dem nofollow-Tag aus?</ironie> ;-)

  7. Peter Müller

    1. Juni 2010, 21:58 Uhr

    Schöne einfache sympathische Grafik. Danke dafür. Hier der Link zu meinem Versuch, die Verwirrung um "Tags" und "Elemente" zu beseitigen:

    HTML: Die ewige Verwirrung um "Tags" und "Elemente" (mit Grafik)

    Attribute habe ich in der Grafik gar nicht erst mit aufgenommen. Wie twitterte pookerman letztens so schön: "alt-Tags sind die neuen image-Attribute".

  8. ixiter

    2. Juni 2010, 01:49 Uhr

    Ich verstehs ja soweit, aber was ist "Element" ?
    "Element" ist ein freihändig gezeichneter grüner Rahmen?

  9. Der Aysberg

    2. Juni 2010, 06:56 Uhr

    Kunde: Ach SEO? Das ist doch das mit dem ALT-Tag?!

  10. Martin

    2. Juni 2010, 08:08 Uhr

    Danke! Endlich hat es jemand mal so auf den Punkt gebracht, Danke!

    Hab ich eigentlich schon "Danke!" gesagt?

  11. Peter Müller

    2. Juni 2010, 09:32 Uhr

    Zitat ixiter:

    "Element" ist ein freihändig gezeichneter grüner Rahmen?

    "Alle Teile zusammen heißen HTML-Element und werden im Browserfenster als rechteckige Kästchen dargestellt. Alle Texte und Grafiken einer Webseite liegen in solchen Kästchen. Ohne Ausnahme."

    Ein Element ist am Bildschirm ein unsichtbares, rechteckiges Kästchen. Eine Webseite besteht aus nichts anderem als lauter "Little Boxes" ;)

  12. Michael van Laar

    2. Juni 2010, 09:33 Uhr

    Zitat Der Aysberg:

    Kunde: Ach SEO? Das ist doch das mit dem ALT-Tag?!

    Nein, SEO ist doch das mit den Keyword-Tags ;-)

  13. ixiter

    2. Juni 2010, 16:41 Uhr

    Zitat Peter Müller:

    "Alle Teile zusammen heißen HTML-Element ..."

    Ja OK.

    Bei ..
    <div><em>foobar</em></div>

    gibt es also ein nicht weiter benanntes HTML Element mit einem div tag. innerhalb des div tags ist dann ein weiteres nicht näher benanntes HTML Element, das einen em tag enthält.

    Bisschen viele unnötige, weil nicht näher benannte, HTML Elemente für meinen Geschmack.

    Nach meinem Verständnis kann Element ja auch ausschließlich Tag(s) enthalten, bzw. Element == Tag.

    Da könnte man in der Reihe doch gleich beim Tag anfangen und hätte ein div tag in dem ein em tag ist.

    Element ist irgendwie unnötig.

  14. cortex

    3. Juni 2010, 16:28 Uhr

    Zitat ixiter:

    Ich verstehs ja soweit, aber was ist "Element" ?

    Lesenswerter Artikel bei SELFPHP: Allgemeine Regeln für HTML - Textauszeichnung

    cx

  15. Peter Müller

    5. Juni 2010, 09:47 Uhr

    Zitat ixiter:

    Bei ..
    <div><em>foobar</em></div>
    gibt es also ein nicht weiter benanntes HTML Element mit einem div tag. innerhalb des div tags ist dann ein weiteres nicht näher benanntes HTML Element, das einen em tag enthält.

    Nein. Es gibt kein "nicht weiter benanntes HTML-Element":

    Im Beispiel besteht das HTML-Element div aus dem Anfangs-Tag <div> und dem Ende-Tag </div>. Elementnamen haben keine spitzen Klammern davor und dahinter, das haben nur Tags.

    Das div-Element wird am Bildschirm vom Browser als unsichtbares Rechteck ("Box") dargestellt. Da div ein Block-Element ist, wird die Box so breit wie es geht.

    Das HTML-Element div enthält in deinem Beispiel das HTML-Element em. Das besteht aus dem Anfangs-Tag <em> und dem Ende-Tag </em>. Da em ein Inline-Element ist, wird das Rechteck nur so breit wie der Inhalt, und das ist das Wort foobar.

    Im Browser gibt es also ein Block-Element div, in dem ein Inline-Element em liegt, das den Text foobar enthält. Die Rechtecke kannst du per CSS z. B. mit border sichtbar machen.

    Fazit:
    <div><em>foobar</em></div>
    - zwei "Elemente" namens div und em.
    - vier Tags:
    --- zwei "Anfangs-Tags" <div> und <em>
    --- zwei "Ende-Tags" </em> und </div>
    - Inhalt "foobar"
    Kein einziges "nicht weiter benanntes Element" ;)

Die Kommentarfunktion ist seit Juli 2014 deaktiviert, weil sie zu sehr von Suchmaschinenoptimierern für manuellen Spam mißbraucht wurde. Wenn du Anmerkungen oder Fragen zum Artikel hast, schreib mir eine E-Mail oder melde dich via Twitter.

Folgt mir!

Kauft mein Zeug!

Cover der HTML5-DVD
Infos auf html5-dvd.de, kaufen bei Amazon

Cover des HTML5-Buchs
Infos auf html5-buch.de, kaufen bei Amazon

Cover des CSS3-Buchs
Infos auf css3-buch.de, kaufen bei Amazon