Verena: HTML5 Strucktur

Hallo,

wollte mal fragen ob ich mit meinem Grundgerüst auf dem richtigen Weg bin?

  
  
<body>  
  
<div id="wrapper"> <!-- Beginn Wrapper -->  
  
<header> <!-- Beginn Header -->  
<div id="logo"></div>  <!-- Logo einbinden -->  
<div id="search"> <!-- Beginn Search -->  
    <input name="q" type="text" size="40" placeholder="Suchbegriff eingeben..."/>  
</div> <!-- Ende Search -->  
  
<div class="clear"></div>  <!-- Float aufheben -->  
  
<nav> <!-- Beginn Navigation -->  
  
    <ul>  
        <li><a href="#"><span>Startseite</span></a></li>  
        <li><a href="#"><span>Profile</span></a> </li>  
        <li><a href="#"><span>Karte</span></a></li>  
        <li><a href="#"><span>Fotoshootings</span></a></li>  
        <li><a href="#"><span>Jobbörse</span></a></li>  
    </ul>  
  
  
</nav> <!-- Ende Navigation -->  
</header>  <!-- Ende Header -->  
  
<section>  
    <article>  
        <header></header>  
    </article>  
</section>  
  
<footer>  <!-- Beginn Footer -->  
</footer>  <!-- Ende Footer -->  
  
</div> <!-- Ende Wrapper -->  
</body>  
  
  

wo wurde jetzt im <section> z.B. eine rechte Navigation hinkommen? also wie sieht hier der HTML5 Aufbau aus?

Gruß
Verena

  1. Der Semantik-Guru ist wohl Gunnar ;)

    <div id="wrapper"> <!-- Beginn Wrapper -->

    Wahrscheinlich ist das überflüssig. Es wird häufig nicht bedacht, dass man auch das html- und body-Element direkt mit CSS "präsentationsreif" stylen kann.

    <div id="logo"></div> <!-- Logo einbinden -->

    Das Logo wird höchstwahrscheinlich ein Bild sein, welches eher eine inhaltliche Bedeutung hat, als wäre ein img-Element anstatt dem div + background-image vorzuziehen.

    <div id="search"> <!-- Beginn Search -->

    Das div-Element kommt mir auch überflüssig vor.

    <input name="q" type="text" size="40" placeholder="Suchbegriff eingeben..."/>

    @placeholder sollte nicht das label-Element ersetzen sondern eher als Beispiel-Angabe verwendet werden.

    <div class="clear"></div> <!-- Float aufheben -->

    Ohne entsprechenden CSS-Code kann man hier nur rätseln, was gefloatet ist und was nicht, also schwer zu beurteilen, wahrscheinlich reicht aber die Pseudo-Klasse :after

    <nav> <!-- Beginn Navigation -->

    <ul>
            <li><a href="#"><span>Startseite</span></a></li>
            <li><a href="#"><span>Profile</span></a> </li>
            <li><a href="#"><span>Karte</span></a></li>
            <li><a href="#"><span>Fotoshootings</span></a></li>
            <li><a href="#"><span>Jobbörse</span></a></li>
        </ul>

    </nav> <!-- Ende Navigation -->

    Die span-Elemente sind wohl auch überflüssig.  
      
    
    > ~~~html
    
    <section>  
    
    >     <article>  
    >         <header></header>  
    >     </article>  
    > </section>
    
    

    Das section-Element sollte wohl eher ein main-Element sein.

    <footer>  <!-- Beginn Footer -->

    </footer>  <!-- Ende Footer -->

    Die Kommentare sind mMn. sinnlos, als ob man im Supermarkt beim Preisschild für die Kartoffeln nicht das Wort "Kartoffeln" sondern ein Bild von Kartoffeln platziert.  
      
    
    > wo wurde jetzt im <section> z.B. eine rechte Navigation hinkommen? also wie sieht hier der HTML5 Aufbau aus?  
    
    HTML ist semantische Strukturierung, nicht präsentationsbezogen, "rechte" Navigation ist aber entweder präsentationsbezogen oder politsch. (scnr) Ohne dessen Relation zum Inhalt zu kennen, kann man das nicht so genau sagen.  
      
    MfG  
    bubble
    
    -- 
    If "god" had intended us to drink beer, he would have given us stomachs. - David Daye
    
    1. wo wurde jetzt im <section> z.B. eine rechte Navigation hinkommen? also wie sieht hier der HTML5 Aufbau aus?
      HTML ist semantische Strukturierung, nicht präsentationsbezogen, "rechte" Navigation ist aber entweder präsentationsbezogen oder politsch. (scnr) Ohne dessen Relation zum Inhalt zu kennen, kann man das nicht so genau sagen.

      Eine Navigation dürfte wohl eher "politischer" Natur sein. Es sollte nichts gegen ein weiteres <nav> innerhalb der <section> sprechen.

      Gruß
      Onkel Schnitzel

    2. Meine Herren,

      jop, das sind im groben die selben Stellen, die ich aufgezählt hätte.

      <div class="clear"></div> <!-- Float aufheben -->
      Ohne entsprechenden CSS-Code kann man hier nur rätseln, was gefloatet ist und was nicht, also schwer zu beurteilen, wahrscheinlich reicht aber die Pseudo-Klasse :after

      Schöner ist das Pseudo-Element ::after.
      Sollte sich das div-Element nicht vermeiden lassen, würde ich es noch mit role="presentation" versehen.

    3. <footer>  <!-- Beginn Footer -->

      </footer>  <!-- Ende Footer -->

      
      > Die Kommentare sind mMn. sinnlos, als ob man im Supermarkt beim Preisschild für die Kartoffeln nicht das Wort "Kartoffeln" sondern ein Bild von Kartoffeln platziert.  
        
        
      Du gehst nicht oft einkaufen, oder? Das ist ein denkbar schlechter Vergleich :)  
        
      Besonders bei Obst und Gemüse ist es hierzulande üblich, das am Regal neben der Waagennummer auch noch ein Bild ist, damit auch ja der ärgste Pfosten weiß, dass er auf der Waage auf das Bananen-Bild drücken muss, wenn er Bananen brauflegt - heutzutage ist von den Menschen scheinbar nicht mehr zu erwarten, dass sie "15" auf der Waage eintippen, wenn man Regal "Waagennummer 15" steht :)
      
      1. @@suit:

        nuqneH

        Besonders bei Obst und Gemüse ist es hierzulande üblich, das am Regal neben der Waagennummer auch noch ein Bild ist, damit auch ja der ärgste Pfosten weiß, dass er auf der Waage auf das Bananen-Bild drücken muss, wenn er Bananen brauflegt - heutzutage ist von den Menschen scheinbar nicht mehr zu erwarten, dass sie "15" auf der Waage eintippen, wenn man Regal "Waagennummer 15" steht :)

        Warum sollte man das erwarten? Der Kunde will Bananen kaufen, nicht "15".

        Irgendwelchen Produkten kryptische IDs zu vergeben, damit der Kunde die ID an anderer Stelle anstatt etwas Intuitivem verwendet, ist keine gute UX.

        Qapla'

        --
        „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
        1. Warum sollte man das erwarten? Der Kunde will Bananen kaufen, nicht "15".

          Weil es teilweise 3 verschiedene Sorten Bananen und 8 Sorten Äpfel gibt und die Tasten aus Gründen der Barrierefreiheit nicht mit ganz winzigen genauen Produktbeschreibungen beschriftet werden können und mit Bildern sehen die dann alle irgendwie gleich aus.

          Irgendwelchen Produkten kryptische IDs zu vergeben, damit der Kunde die ID an anderer Stelle anstatt etwas Intuitivem verwendet, ist keine gute UX.

          Die kryptische ID ist die "Artikelnummer" bzw. eine abstrakte Verkürzung um sie sich einfach merken zu können.

          Wie es gut funktioniert macht das Bauhaus vor - hier gibt es bei den Eisenwaren (zumindest hier in Österreich) quasi jede Schraube einzeln und bezahlt wird nach Masse.

          Du nimmst die Schrauben, Muttern, Winkel, Unterlegscheiben - was auch immer du willst - legst sie auf die Waage und tippst die Wagennummer ein, die am Regal angeschrieben ist.

          Wenn da steht M87 drückst du M, dann die 8 und dann die 7 - das ist einfach und funktioniert sehr gut.

          Es wäre arg Benutzerunfreundlich, wenn man hier ein Menü anbringen würde, wo man sich erst durchhangeln muss um sein Produkt zu finden.

          Schrauben

          • rostfrei
            -- Metrisches gewinde
            --- 6-Kant-Kopf
            ---- M8
            ----- 30 mm Länge

          Wenn du da 10 verschiedene Schrauben brauchst, wirst du zum Schwammerl - da nehm ich lieber je ein Sackerl, werf die benötigen Schrauben rein, gehe zu Wage und Tippe unmissverständlich die richtige ID/Nummer ein und bekomme dann ein Preisschildchen ausgedrückt.

          Bei Ikea funktioniert das übrigens auch so - da bekommst du eine Regalnummer wo das Produkt grade steht und dort holst du es - fertig. Das liegt am chaotischen Lagersystem, da würde es absolut keinen Sinn ergeben, an jedes Regal vorne groß ein Schild zu hängen wo steht was in dem riesen Regal alles einsortiert ist.

      2. <footer>  <!-- Beginn Footer -->

        </footer>  <!-- Ende Footer -->

        
        > > Die Kommentare sind mMn. sinnlos, als ob man im Supermarkt beim Preisschild für die Kartoffeln nicht das Wort "Kartoffeln" sondern ein Bild von Kartoffeln platziert.  
        > Du gehst nicht oft einkaufen, oder? Das ist ein denkbar schlechter Vergleich :)  
        > Besonders bei Obst und Gemüse ist es hierzulande üblich, das am Regal neben der Waagennummer auch noch ein Bild ist, damit auch ja der ärgste Pfosten weiß, dass er auf der Waage auf das Bananen-Bild drücken muss, wenn er Bananen brauflegt - heutzutage ist von den Menschen scheinbar nicht mehr zu erwarten, dass sie "15" auf der Waage eintippen, wenn man Regal "Waagennummer 15" steht :)  
          
        Daran hab ich nicht gedacht, wahrscheinlich weil ich so selten was kaufe, was erst noch gewogen werden muss. Ein besserer Vergleich ist mir aber auch nicht mehr eingefallen.  
          
        MfG  
        bubble
        
        -- 
        If "god" had intended us to drink beer, he would have given us stomachs. - David Daye
        
        1. Mahlzeit,

          Daran hab ich nicht gedacht, wahrscheinlich weil ich so selten was kaufe, was erst noch gewogen werden muss. Ein besserer Vergleich ist mir aber auch nicht mehr eingefallen.

          Also ich hab seit Jahren keine solche Waage mehr gesehen, ich kenne das, dass die Ware an der Kasse gewogen wird. (Lidl, Penny, Edika, usw.)

          Vielleicht kann man den Menschen nichtmal mehr zutrauen, die richtige Taste zu drücken, auch wenn das passende Bild drauf ist :D

          --
          42
          1. Also ich hab seit Jahren keine solche Waage mehr gesehen, ich kenne das, dass die Ware an der Kasse gewogen wird. (Lidl, Penny, Edika, usw.)

            Das ist mir schon aufgefallen (ich wohn' ja direkt an der Grenze) - in Deutschland ist das vermehrt so, dass an der Kasse gewogen wird, in Österreich ist mehr Selbstwägen angesagt.

            Vielleicht kann man den Menschen nichtmal mehr zutrauen, die richtige Taste zu drücken, auch wenn das passende Bild drauf ist :D

            Ja, möglicherweise sind die Preißn noch blöder als wir Schluchtenscheisser ;)

            1. Hallo,

              Vielleicht kann man den Menschen nichtmal mehr zutrauen, die richtige Taste zu drücken, auch wenn das passende Bild drauf ist :D

              Ja, möglicherweise sind die Preißn noch blöder als wir Schluchtenscheisser ;)

              Nicht blöder, cleverer: teure Äpfel in die Tüte, Bildchen vom billigen Apfel drücken, anschließend noch einen weiteren Apfel in die Tüte...

              Gruß
              Kalk

            2. Mahlzeit,

              Ja, möglicherweise sind die Preißn noch blöder als wir Schluchtenscheisser ;)

              Kasnn ich nicht mitreden .... 40km bis zur Grenze Freilassing-Salzburg ;)
              Und Breißn sind ja erst die, die hinter München wohnen ~g~

              --
              42
              1. @@M.:

                nuqneH

                Und Breißn sind ja erst die, die hinter München wohnen ~g~

                Die Feindschaft zwischen unseren Völkern beruht wohl darauf, dass ihr die Sachsen mit zu uns Preußen zählt.

                Qapla'

                --
                „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
                1. Mahlzeit,

                  Die Feindschaft zwischen unseren Völkern beruht wohl darauf, dass ihr die Sachsen mit zu uns Preußen zählt.

                  Das würde ja heissen, ich sehe Sachsen als Menschen an :D

                  (Oh shit .... jetzt bekomm ich bestimmt Ärger ~g~)

                  --
                  42
                2. Hi,

                  Und Breißn sind ja erst die, die hinter München wohnen ~g~

                  Hinter München?
                  Nördlich des Siegestores.

                  Die Feindschaft zwischen unseren Völkern beruht wohl darauf, dass ihr die Sachsen mit zu uns Preußen zählt.

                  Hier muß zwischen Preißn und Saupreißn unterschieden werden. Letztere sind nicht an ein Herkunftsgebiet gebunden (Saupreiß, japanischer, elendiger!) *)

                  *) "japanischer" kann hier durch ein beliebiges anderes Adjektiv, daß eine Bevölkerungsmenge beschreibt, ersetzt werden. Mit Ausnahme von bayerisch (und Kleinteilen davon).

                  cu,
                  Andreas

                  --
                  Warum nennt sich Andreas hier MudGuard?
                  O o ostern ...
                  Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
          2. Hallo,

            ich kenne das, dass die Ware an der Kasse gewogen wird. (Lidl, Penny, Edika, usw.)

            das ist wohl auch von Filiale zu Filiale unterschiedlich. Beim Penny kauf ich zu selten ein, als dass ich es sagen könnte, aber von den drei LIDL-Filialen hier im Ort hatten bis vor kurzem nur zwei das Prinzip "Wiegen an der Kasse". Beim Supermarkt-Platzhirsch hier am Ort (Kaufland) ist es sogar so, dass die Kassiererin ihre Kunden mehr oder weniger vorwurfsvoll anguckt und von der Kasse nochmal zur Waage schickt, wenn man das Wiegen vergessen hat. Wenigstens gibt es eine(!) Waage in der Kassenzone; man muss also nicht nochmal quer durch den Laden in die Obst- und Gemüseabteilung.

            Vielleicht kann man den Menschen nichtmal mehr zutrauen, die richtige Taste zu drücken, auch wenn das passende Bild drauf ist :D

            Zutrauen ist vielleicht nicht das Hauptproblem, sondern überhaupt trauen.
            Ich vermute, dass nur wenige Kassiererinnen überprüfen, ob auch wirklich das in der Tüte ist, was auf dem Wiegeetikett steht. Ob ich die Damen mal auf die Probe stelle ...?
            Wenn sie's dann tatsächlich merken, kann ich ja immer noch auf zerknirscht machen. "Tut mir leid, da hab ich mich wohl vertan. Ist wirklich nicht mein Tag heute!"

            Ciao,
             Martin

            --
            F: Kennt jemand ein Automobil-Märchen?
            A: Radkäppchen und der böse Golf.
            Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
            1. Om nah hoo pez nyeetz, Der Martin!

              Mir ist letzte Woche erstmals aufgefallen, dass offensichtlich in den Barcodes auch das Haltbarkeitsdatum enthalten ist, denn ich hörte wie eine Kassiererin sagte, „Dieses Produkt darf ich Ihnen nicht mehr verkaufen, das Haltbarkeitsdatum ist abgelaufen.“

              Es kann natürlich auch sein, dass die Kassiererin auf das Datum geschaut hat, was ich allerdings für sehr unwahrscheinlich halte.

              Zumindest wäre es ein Verbesserungsvorschlag, der zu mehr Verbraucherfreundlichkeit führt.

              Matthias

              --
              Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Kant und Kantate.

              1. Hallo Matthias,

                Mir ist letzte Woche erstmals aufgefallen, dass offensichtlich in den Barcodes auch das Haltbarkeitsdatum enthalten ist, denn ich hörte wie eine Kassiererin sagte, „Dieses Produkt darf ich Ihnen nicht mehr verkaufen, das Haltbarkeitsdatum ist abgelaufen.“

                wenn es sich um Barcodes handelt, die im Laden selbst generiert werden, also praktisch bei allen im Laden abgepackten Waren, dann kann ich mir das gut vorstellen. Bei abgepackten, aber nach Gewicht berechneten Fleisch- und Wurstprodukten muss im Barcode ja auch nicht nur das "was" codiert sein (z.B. Artikelnummer), sondern auch das "wieviel".

                Falls wir aber nur von den EAN-Barcodes des Herstellers reden: Nein. Daraus geht nur der Hersteller und das Produkt an sich hervor.

                Es kann natürlich auch sein, dass die Kassiererin auf das Datum geschaut hat, was ich allerdings für sehr unwahrscheinlich halte.

                Ich auch. Zumal das MHD auf vielen Artikeln so versteckt angebracht ist, dass man es erst suchen muss.

                Es spricht aber für den Supermarkt, dass die Leute von sich aus auf "abgelaufene" Ware hinweisen oder sie gar aus dem Verkehr ziehen. Ich erinnere mich an ein Erlebnis vor ein paar Jahren im "minimal"-Markt. Da habe ich eine Packung Käse mit überschrittenem MHD im Kühlregal gefunden und einer Angestellten in die Hand gedrückt, die um die Ecke Ware ins Regal räumte. Wenige Minuten später hörte ich dann zufällig, wie die junge Frau von ihrer Chefin zusammengefaltet wurde. Sie solle gefälligst ein neues Etikett draufmachen und die Packung wieder ins Regal legen, was denn sonst!

                Da habe ich relativ spontan meinen Einkaufswagen stehenlassen und bin gegangen. Ich war auch seither nie wieder in einer minimal-Filiale.
                Natürlich bin ich überzeugt, dass auch in anderen Läden viel getrickst und gemauschelt wird. Aber wenn man schon bescheißt, dann bitte so, dass es der Kunde nicht merkt. ;-)

                Ciao,
                 Martin

                --
                Er:  Mit wem warst du gestern abend aus?
                Sie: Du bist mal wieder eifersüchtig wie immer!
                Er:  Wer ist Immer?
                Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
      3. Hi there,

        Du gehst nicht oft einkaufen, oder? Das ist ein denkbar schlechter Vergleich :)

        Besonders bei Obst und Gemüse ist es hierzulande üblich, das am Regal neben der Waagennummer auch noch ein Bild ist, damit auch ja der ärgste Pfosten weiß, dass er auf der Waage auf das Bananen-Bild drücken muss, wenn er Bananen brauflegt

        Ich bin noch schlimmer als der ärgste Vollpfosten, ich wiege nämlich gar nichts ab (wie komm ich auch dazu), und an der Kassa dann nimmt die Kassierin immer genervt meine Gemüse- und Obstanteile und wiegt selbst ab. Wer sich blöd anstellt, braucht auch auf kein Bananen-Bild drücken...;)

        1. Ich bin noch schlimmer als der ärgste Vollpfosten, ich wiege nämlich gar nichts ab (wie komm ich auch dazu), und an der Kassa dann nimmt die Kassierin immer genervt meine Gemüse- und Obstanteile und wiegt selbst ab. Wer sich blöd anstellt, braucht auch auf kein Bananen-Bild drücken...;)

          Und danach zahlst du auch noch mit Kleingeld, auf den Cent genau :D

          1. Hi there,

            Und danach zahlst du auch noch mit Kleingeld, auf den Cent genau :D

            Nein, hab ich keines. Die kupferfarbenen Beilagscheiberl lass' ich immer liegen und die anderen Münzen landen bei mir alle in einer Kiste (die ich nicht mehr zur Bank bringen kann, weil sie zu schwer geworden ist...)

        2. Hallo Klawischnigg!

          Ich bin noch schlimmer als der ärgste Vollpfosten, ich wiege nämlich gar nichts ab (wie komm ich auch dazu), und an der Kassa dann nimmt die Kassierin immer genervt meine Gemüse- und Obstanteile und wiegt selbst ab. Wer sich blöd anstellt, braucht auch auf kein Bananen-Bild drücken...;)

          Das ist eine der Situationen, wo ich immer dankbar bin, dass bei uns nicht jeder mit einer Waffe herumlaufen darf, weil solche Leute vor mir sind eine eindeutige Indikation für die Verwendung solcher.

          Mit lieben Grüßen

          Melvin Cowznofski

          --

          Melvin Cowznofski
          What – me worry?
          1. Hi,

            Das ist eine der Situationen, wo ich immer dankbar bin, dass bei uns nicht jeder mit einer Waffe herumlaufen darf, weil solche Leute vor mir sind eine eindeutige Indikation für die Verwendung solcher.

            Selbst erlebt:

            Supermarkt-Kasse. Längere Schlange. Vor mir unterhalten sich zwei (fast hätte ich Damen geschrieben) Frauen, daß es nervt, wenn man so lange an der Kasse warten muß.
            Als die erste der beiden Frauen dann endlich dran waren und die Kassiererin Geld sehen wollte, fing die Frau an, in ihrem Handtascherl (Format so zwischen DIN A3 und DIN A2) nach dem Geldbeutel zu suchen, was ob des zu durchsuchenden Volumens ne ganze Weile dauerte ...

            cu,
            Andreas

            --
            Warum nennt sich Andreas hier MudGuard?
            O o ostern ...
            Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
            1. @@MudGuard:

              nuqneH

              Supermarkt-Kasse.

              Sowas stimmt dann aber doch nachdenklich.

              Qapla'

              --
              „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
  2. @@Verena:

    nuqneH

    <div id="search"> <!-- Beginn Search -->
        <input name="q" type="text" size="40" placeholder="Suchbegriff eingeben..."/>
    </div> <!-- Ende Search -->

    Für Suchfelder gibt es in HTML5 @type="search".

    Dass das Label fehlt, wurde ja schon gesagt. Placeholder sind kein Ersatz für Label; nicht als solche verwenden. Und überhaupt sind Label in Eingabefelden keine so gute Idee.

    Qapla'

    --
    „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
    1. »When done, I hit the tab key and the keyboard focus (and my focus) is moved to the next field.
      Puzzlement strikes. The placeholder text is gone, there is no label, and I am left with a blank field eagerly awaiting my input on … something… anything?«

      http://mentalized.net/journal/2010/08/05/dont_use_placeholder_text_as_labels/

      »The problem is that the first input box you’ll click into is the top title input. It actually auto-focuses, and some clever script means that it puts the label back in after the auto-focus, but then the second you start typing you’ve lost that label. If you start typing, then backspace because you made a mistake, you’ve lost that label«

      http://laurakalbag.com/labels-in-input-fields-arent-such-a-good-idea/

      Ich weiß nicht, wie die auf diese Erfahrung kommen – so ist das HTML5-placeholder-Attribut nicht in den mir verfügbaren Browsern implementiert. Selbst wenn ein Feld fokussiert ist, ist der Placeholder solange sichtbar, bis Text eingegeben wurde; und er wird auch wieder sichtbar, wenn man den Inhalt löscht. Damit bricht deren zentrale Argumentation zusammen.

      Placeholder-als-Label wird übrigens z.B. von iOS in nativen Apps verwendet, und ich meine es auch auf Android gesehen zu haben. Es spricht wenig prinzipiell gegen dieses UI-Pattern. Ein separates Label ist natürlich robuster aus Usability-Sicht, und im HTML-Kontext nötig aus Accessibility-Sicht.

      Mathias

      1. Ich weiß nicht, wie die auf diese Erfahrung kommen – so ist das HTML5-placeholder-Attribut nicht in den mir verfügbaren Browsern implementiert. Selbst wenn ein Feld fokussiert ist, ist der Placeholder solange sichtbar, bis Text eingegeben wurde; und er wird auch wieder sichtbar, wenn man den Inhalt löscht. Damit bricht deren zentrale Argumentation zusammen.

        Das war mal so - Opera 12 macht es noch so, aber in den anderen aktuellen Browsern wird der Placeholder erst ausgeblendet, wenn man zu tippen beginnt.

    2. <input name="q" type="text" size="40" placeholder="Suchbegriff eingeben..."/>

      Placeholder sind kein Ersatz für Label; nicht als solche verwenden.

      »For a simple form this might work out okay, for example an input field next to a
      “search” button. Even without the placeholder it’s somewhat obvious how the form works as the button text effectively becomes the label for your input field.«

      http://mentalized.net/journal/2010/08/05/dont_use_placeholder_text_as_labels/

      SCNR ;)

      Ich halte hier einen Submit-Button ebenfalls wichtiger als ein (sichtbares) Label. Siehe Google: Es gibt kein Label oder Placeholder, aber natürlich einen Submit-Button, auf dem groß »Google-Suche« steht.

      <form>  
      <label><span>Suchen:</span> <input type="search" placeholder="Suchbegriff eingeben"></label>  
      <input type="submit" value="Suchen">  
      </form>
      

      Ob man Nicht-Screenreader-Nutzern jetzt noch das Label zeigt oder das span zugänglich versteckt, halte ich für nicht entscheidend. Das schreit geradezu nach einem A/B-Test…

      Mathias