Daria: Div tag

Hi, und zwar beschäftige ich mich derzeit mit CSS. Dazu habe ich eine Frage.

Warum nutzt man nicht anstatt des div-tag z.B. ein p-Tag?
Da würde doch das selbe Ergebnis rauskommen?
Wenn ich mir große Webseiten anschaue, dann besteht bei denen alles nur aus div-Tags.
Ebenso habe ich irgendwo gelesen, dass dur den Gebrauch von div und span-Tags bestimmte HTML-Tags überflüssig geworden sind. Kann mir jemand sagen, welche es genau sind?

Danke
Daria

  1. Hi!

    Nein.

    Divs und Spans sind Container. Da kannst Du alles moegliche reintun. Ein P ist ein Absatz. Enthaelt also Text und keine anderen Absaetze - darf es auch nicht. (http://de.selfhtml.org/html/referenz/elemente.htm)

    Welche Elemente sollten denn ueberfluessig geworden sein? Ich kenne keines.

    --
    "Die Diebesgilde beklagte sich darueber, dass Mumm in aller Oeffentlichkeit behauptet hatte, hinter den meisten Diebstaehlen steckten Diebe."
          - T. Pratchett
  2. Warum nutzt man nicht anstatt des div-tag z.B. ein p-Tag?

    Wenn man mehrere elemente Gruppieren möchte, ist ein div-Element durchaus sinnvoll - sofern es kein anderes, geeignetes Element gibt. Zum gruppieren von Formularelementen eignet sich z.B. <fieldset />

    Zum Auszeichnen eines Textabsatzes eigent sich ein <p />-Element.

    p ist also nicht zwangsläufig ein ersatz für div.

    Da würde doch das selbe Ergebnis rauskommen?

    Mit derselben Formatierung ja - aber der Sinn (Semantik) ist nicht dieselbe.

    Wenn ich mir große Webseiten anschaue, dann besteht bei denen alles nur aus div-Tags.

    Div-Suppe nennt sich das.

    Ebenso habe ich irgendwo gelesen, dass dur den Gebrauch von div und span-Tags bestimmte HTML-Tags überflüssig geworden sind.

    Nein, das ist Unsinn.

    Kann mir jemand sagen, welche es genau sind?

    Durch den gebrauch sinnvoller Auszeichnung sind präsentationsbezogene (großteils) Elemente überflüssig geworden.

    Namentlich b, i, u, tt, font usw (diese sind bereits als "deprecated" gekennzeichnet). HTML5 will die Dinger aber leider wieder einführen.

    1. @@suit:

      nuqneH

      Namentlich b, i, u, tt, font usw (diese sind bereits als "deprecated" gekennzeichnet). HTML5 will die Dinger aber leider wieder einführen.

      Mit neuer Bedeutung. Aber gibt nicht HTML5 auch HTML selbst eine neue Bedeutung: Hixie’s Thoughtless Markup Language? >;->

      Qapla'

      --
      Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
      1. Mit neuer Bedeutung.

        Was die Migration extrem erschwert, weil durch einen Wechsel plötzlich den Sinn eines Dokuments entstellen kann, ohne es zu wollen.

        Aber gibt nicht HTML5 auch HTML selbst eine neue Bedeutung: Hixie’s Thoughtless Markup Language? >;->

        YMMD :D

        1. Mit neuer Bedeutung.
          Was die Migration extrem erschwert, weil durch einen Wechsel plötzlich den Sinn eines Dokuments entstellen kann, ohne es zu wollen.

          Also ich bin über die Bedeutungsänderung auch nicht begeistert, aber man entscheidet ja immernoch selbst welche Version man verwendet und angibt.
          Wer also eine Seite nach HTML5 konvertiert muss eben wissen ob und wie er die entsprechenden Elemente verwendet hat (ich verwende sie eh nie, also ist es mir egal).
          Aber es könnte schon witzig werden... "hmmm Cheff hat gesagt muss alles HTML5 werden... naja, änder ich halt die DOCTYPEs".

          Warum die "großen Seiten" allerding niemals nen Validator über ihre Startseiten haben laufen lassen ist mir völlig Schleierhaft. Google schafft irgendwas bei 30-40 Fehlern in zwölf Zeilen Code.

          --
          sh:( fo:| ch:? rl:( br:& n4:& ie:{ mo:} va:) de:µ_de:] zu:) fl:( ss:| ls:[ js:(
          1. @@Deus Figendi:

            nuqneH

            Warum die "großen Seiten" allerding niemals nen Validator über ihre Startseiten haben laufen lassen ist mir völlig Schleierhaft. Google schafft irgendwas bei 30-40 Fehlern in zwölf Zeilen Code.

            Wobei ich bei Google noch vermuten würde, die wissen, was sie tun: Sie optimieren auf Performanz, nicht auf Validität. Bei Myriaden von Seitenaufrufen durchaus verständlich.

            Qapla'

            --
            Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
          2. Google schafft irgendwas bei 30-40 Fehlern in zwölf Zeilen Code.

            Google schafft es, in zwölf Zeilen Code keinen einzigen Fehler zu haben (Valides HTML5) - seltsamerweise aber nur, wenn man die Quelltext in den Validator kopiert (Validate by Direct Input). Validate by URI scheitert :). Wenn der Validator die Seite aufruft, scheint der Quelltext abzuweichen - 10 Zeilen anstatt 12.

            1. Hallo,

              Google schafft irgendwas bei 30-40 Fehlern in zwölf Zeilen Code.
              Google schafft es, in zwölf Zeilen Code keinen einzigen Fehler zu haben (Valides HTML5) - seltsamerweise aber nur, wenn man die Quelltext in den Validator kopiert (Validate by Direct Input). Validate by URI scheitert :). Wenn der Validator die Seite aufruft, scheint der Quelltext abzuweichen - 10 Zeilen anstatt 12.

              es ist nichts neues, dass Google abhängig vom UA unterschiedlichen Code ausliefert. Ich stelle das regelmäßig fest, wenn ich dieselbe Suchanfrage mit IE und Opera stelle. Opera zeigt mir auch die Links auf seiteninterne Anker an, IE nicht. Dass dies kein Effekt der browsertypischen richtigen oder falschen Interpretation von HTML/CSS ist, zeigt ein Blick in den Quellcode, der dann tatsächlich deutliche Unterschiede aufweist (Beispiel, Beispiel).

              So long,
               Martin

              --
              Paradox ist, wenn der Innenminister sich äußert und der Außenminister sich erinnert.
  3. Hallo,

    Warum nutzt man nicht anstatt des div-tag z.B. ein p-Tag?

    das frage ich mich auch oft. Tatsache ist, dass jedes HTML-Element einen bestimmten Sinn und Zweck hat; zum Layouten werden aber trotzdem oft ohne Nachdenken nur divs benutzt. Diese "Krankheit", die übermäßige Verwendung von divs, nennt man auch Divitis; das Code-Ergebnis, was dabei entsteht, eine div-Suppe.

    Wenn ich mir große Webseiten anschaue, dann besteht bei denen alles nur aus div-Tags.

    Leider. Sinnvolle (semantische) Verwendung der vorhandenen HTML-Elemente scheint echt schwierig zu sein ...

    Ebenso habe ich irgendwo gelesen, dass dur den Gebrauch von div und span-Tags bestimmte HTML-Tags überflüssig geworden sind. Kann mir jemand sagen, welche es genau sind?

    Keine Ahnung, was du damit meinst.

    Ciao,
     Martin

    --
    Keine Sorge, wir finden für jede Lösung ein Problem.
    1. das frage ich mich auch oft. Tatsache ist, dass jedes HTML-Element einen bestimmten Sinn und Zweck hat; zum Layouten werden aber trotzdem oft ohne Nachdenken nur divs benutzt. Diese "Krankheit", die übermäßige Verwendung von divs, nennt man auch Divitis; das Code-Ergebnis, was dabei entsteht, eine div-Suppe.

      Tja, ein p darfst du leider nur verwenden, wenn du über dessen Inhalt ganz genau Bescheid weisst.
      Ein p als sezzessierende Elemente des Layouts sind ebenso deplatziert wie Laufgitter im Zoo.

      mfg Beat

      --
      ><o(((°>           ><o(((°>
         <°)))o><                     ><o(((°>o
      Der Valigator leibt diese Fische
      1. Hi,

        das frage ich mich auch oft. Tatsache ist, dass jedes HTML-Element einen bestimmten Sinn und Zweck hat; zum Layouten werden aber trotzdem oft ohne Nachdenken nur divs benutzt. Diese "Krankheit", die übermäßige Verwendung von divs, nennt man auch Divitis; das Code-Ergebnis, was dabei entsteht, eine div-Suppe.
        Tja, ein p darfst du leider nur verwenden, wenn du über dessen Inhalt ganz genau Bescheid weisst.

        natürlich, davon gehe ich aus. Ich will mich auch nicht grundsätzlich gegen die Verwendung von divs aussprechen - nur gegen die offensichtlich häufige Annahme, sie seien für ein Layout unbedingt notwendig. Dabei lassen sich andere Elemente wie p, ul, form, fieldset, img oder hX genauso stylen und formatieren wie divs.

        Ein p als sezzessierende Elemente des Layouts sind ebenso deplatziert wie Laufgitter im Zoo.

        Muss ich diesen Satz verstehen?
        Ich denke mal, nein. Schließlich ist Freitag.

        Ciao,
         Martin

        --
        Der Stress von heute ist die gute alte Zeit von morgen.
    2. Ahoj!

      Warum nutzt man nicht anstatt des div-tag z.B. ein p-Tag?

      das frage ich mich auch oft. Tatsache ist, dass jedes HTML-Element einen bestimmten Sinn und Zweck hat; zum Layouten werden aber trotzdem oft ohne Nachdenken nur divs benutzt. Diese "Krankheit", die übermäßige Verwendung von divs, nennt man auch Divitis; das Code-Ergebnis, was dabei entsteht, eine div-Suppe.

      Richtig. Ergänzung: Manchmal gibt es kein HTML-Element mit passender Bedeutung, und genau dann sind div und span angebracht (deren Bedeutung dann mit id oder class genauer bezeichnet wird).
      Typisches Beispiel: <div id="header"> für den Seitenkopf, enthält meistens Überschrift, Logo und Navi. Weil das so häufig benutzt wird, gibt es in HTML5 <header>.

      Wenn ich mir große Webseiten anschaue, dann besteht bei denen alles nur aus div-Tags.

      Leider. Sinnvolle (semantische) Verwendung der vorhandenen HTML-Elemente scheint echt schwierig zu sein ...

      Das kann z.T. an der Art liegen, wie der Quelltext serverseitig erzeugt wird. Bei ASP.NET z.B. ist alles objektorientiert; die Seite wird aus Controls zusammengesetzt, die auch verschachtelt sein können. Das sieht serverseitig toll aus, hat aber Konsequenzen:
      • Die mitgelieferten Controls rendern fürchterliche Div- und Span-Suppen raus, wenn man die schuldigen Methoden nicht überschreibt. Die Zeit dafür kriegt man nicht immer genehmigt, wenn es ja eh schon funzt™.
      • Da ein Control nicht weiß, an welcher Stelle es in den DOM gehängt wird, kann es teilweise wirklich schlecht entscheiden, welche Elemente nun gerade passen. Ein Container-Control weiß zudem nicht, was noch hineingepackt wird. Wenn z.B. nicht bekannt ist, welche Überschriften bereits benutzt wurden (h1, h2, …), weiß man eben auch nicht, welche als nächste dran ist. Die Antwort ist oft <div class="headline"> (würg). Natürlich kann man dafür Eigenschaften definieren, aber das bläht dann den serverseitigen Quelltext furchtbar auf und ist der Wartbarkeit noch viel abträglicher als die Div-Suppe.

      Generell sollte man sich an wirklich großen Seiten eher nicht orientieren. Die sind meistens unter Zeitdruck entstanden und verwenden viel vorgefertigtes Zeug, das nur halbwegs paßt, und viel Inhalt, der von Usern zusammengeklickt wurde, die von dem CMS die Hälfte und von HTML gar nix verstanden haben. Wenn man die Zeit hat, es besser zu machen, sollte man das auch tun.

      Ebenso habe ich irgendwo gelesen, dass dur den Gebrauch von div und span-Tags bestimmte HTML-Tags überflüssig geworden sind. Kann mir jemand sagen, welche es genau sind?

      Vielleicht ist damit gemeint, daß man Frames (incl. Iframes) und Layout-Tabellen durch semantisches HTML ersetzen kann und auch unbedingt sollte?

      Viele Grüße vom Længlich

      --
      Mein aktueller Gruß ist:
      Tschechisch
  4. Warum nutzt man nicht anstatt des div-tag z.B. ein p-Tag?

    Man nutzt weder div noch p, sondern das im Kontext angemessene.
    Erwartest du Blockelemente als Inhalt des fraglichen Elements, so kommt p schon mal nicht in Frage.

    Da würde doch das selbe Ergebnis rauskommen?

    Wenn dein Document eh invalide ist, ungefähr ja...

    Wenn ich mir große Webseiten anschaue, dann besteht bei denen alles nur aus div-Tags.

    Aber hoffentlich ebenso auch aus h1 .. h6, ul, ol, dl, form, fieldset und p

    Ebenso habe ich irgendwo gelesen, dass dur den Gebrauch von div und span-Tags bestimmte HTML-Tags überflüssig geworden sind. Kann mir jemand sagen, welche es genau sind?

    vereinzelt: table, frameset, iframe.
    und zwar nach einer umgestaltung der Webseite.

    mfg Beat

    --
    ><o(((°>           ><o(((°>
       <°)))o><                     ><o(((°>o
    Der Valigator leibt diese Fische
    1. vereinzelt: table, frameset, iframe.
      und zwar nach einer umgestaltung der Webseite.

      Alle drei genannten haben auch in einer modernen Webseite durchaus eine Existenzberechtigung - kommt aber auf den Einzelfall an.