Ankündigung

Einklappen
Keine Ankündigung bisher.

Formulare richtig erstellen

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Formulare richtig erstellen

    Hallo,
    hab wieder mal ne kleine Frage:
    Wie kann ich am besten Formulare erstellen ?
    Soll heißen welches wie soll ich die inputs am besten verpacken, dann mit das ganze ordentlich strukturiert ist und man dafür keine Elemente "misbrauchen" muss ?

    Die einfachste möglichkeit wäre natürlich das ganze in eine blinde Tablle zu packen, aber dafür sind eigentlich keine Tabellen da ?

    Code:
    <table border="0">
    <tr><td>Name:</td><td><input type="text" name="name" value="" /></td></tr>
    </table>
    Oder soll man es ganz ohne umgebenes Element machen?
    Und den label-Elementen eine fixe Breite geben damit das ganze ordentlich aussieht ?
    Code:
    <label for="name">Name:</label><inpu type="text" name="name" value="" /><br />
    Oder vielleicht doch über eine Liste (wieder entsprechend Formatieren):
    Code:
    <ol>
    <li><label for="name">Name:</label><inpu type="text" name="name" value="" /></li>
    </ol>
    Was ist die beste Lösung ? Oder soll man es sogar ganz anders machen ?

    Grüße
    Signatur:
    PHP-Code:
    $s '0048656c6c6f20576f726c64';
    while(
    $i=substr($s=substr($s,2),0,2))echo"&#x00$i;"

  • #2
    Das ist mehr ein philosophische Frage. Tabellen sollte man i.A. vermeiden, ansonsten tu wie DU magst.
    [COLOR="#F5F5FF"]--[/COLOR]
    [COLOR="Gray"][SIZE="6"][FONT="Georgia"][B]^^ O.O[/B][/FONT] [/SIZE]
    „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
    [URL="http://www.php.de/javascript-ajax-und-mehr/107400-draggable-sorttable-setattribute.html#post788799"][B]Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“[/B][/URL][/COLOR]
    [COLOR="#F5F5FF"]
    --[/COLOR]

    Kommentar


    • #3
      Es gibt auch genug Leute, die Formulare durchaus für einen berechtigten Anwendungsfall von Tabellen sehen - immerhin gibt es hier eindeutig zugeordnete Daten-Paare, jeweils Eingabefeld und Beschriftung.
      [SIZE="1"]RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?[/SIZE]

      Kommentar


      • #4
        Zitat von ChrisB Beitrag anzeigen
        Es gibt auch genug Leute, die Formulare durchaus für einen berechtigten Anwendungsfall von Tabellen sehen - immerhin gibt es hier eindeutig zugeordnete Daten-Paare, jeweils Eingabefeld und Beschriftung.
        Das gibt es aber auch mit label und dem Eingabefeld

        Kommentar


        • #5
          immerhin gibt es hier eindeutig zugeordnete Daten-Paare, jeweils Eingabefeld und Beschriftung
          Kenne ich bisher nur als Argument für Definitionslisten. label sollte man allerdings auf jeden Fall verwenden.
          [COLOR="#F5F5FF"]--[/COLOR]
          [COLOR="Gray"][SIZE="6"][FONT="Georgia"][B]^^ O.O[/B][/FONT] [/SIZE]
          „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
          [URL="http://www.php.de/javascript-ajax-und-mehr/107400-draggable-sorttable-setattribute.html#post788799"][B]Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“[/B][/URL][/COLOR]
          [COLOR="#F5F5FF"]
          --[/COLOR]

          Kommentar


          • #6
            was haltet ihr von der Idee das ganze mit einer Definitionsliste zu machen ?
            bei dd kommt das label rein und bei dt dann das input ?
            Code:
            <dl>
            <dd><label for="name">Name:</label></dd>
                   <dt><input typ="text" name="name" id="name" value="" /></dt>
            <dd><label for="email">E-Mail:</label></dd>
                   <dt><input typ="text" name="email" id="email" value="" /></dt>
            </dl>
            wenn mandas ganze dann noch mit css formatiert kommt was ganz ansehliches dabei raus:
            Code:
            dl dt{
                float: left;    
            }
            
            dl dd{
                float:left;
                clear: left;
                width: 70px; /*Breite der dd damit das ganze bündig ist*/
            }
            
            dl dd,dt{
                margin-top: 5px;
            }
            Signatur:
            PHP-Code:
            $s '0048656c6c6f20576f726c64';
            while(
            $i=substr($s=substr($s,2),0,2))echo"&#x00$i;"

            Kommentar


            • #7
              Vorsprung durch Webstandards | Semantischer Code - Definitionen, Methoden, Zweifel
              SimpleBits / SimpleQuiz › Part VI › Form(atting)
              [COLOR="#F5F5FF"]--[/COLOR]
              [COLOR="Gray"][SIZE="6"][FONT="Georgia"][B]^^ O.O[/B][/FONT] [/SIZE]
              „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
              [URL="http://www.php.de/javascript-ajax-und-mehr/107400-draggable-sorttable-setattribute.html#post788799"][B]Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“[/B][/URL][/COLOR]
              [COLOR="#F5F5FF"]
              --[/COLOR]

              Kommentar


              • #8
                Semantisch gesehen, ist ein Formular ja keine Definitionsliste. Mein Ansatz ist. jeden Abschnitt (Label + Feld (+ Fehlermeldung + etc.)) in ein Div. dann hat man auch genügend Möglichkeiten, alles zu formatieren - Das aber nur nebenbei.

                Kommentar


                • #9
                  Zitat von ByStones Beitrag anzeigen
                  was haltet ihr von der Idee das ganze mit einer Definitionsliste zu machen ?
                  Wenn du es in eine DL packst, kannst du meiner Meinung nach auch gleich eine Tabelle verwenden. Sinnentfremdet ist das in beiden Fällen.

                  Ich stelle die Eingabfelder entweder direkt in die LABEL und formatiere die LABEL als BLock-Elemente:
                  Code:
                  <label for="xy">Labeltext: <input type="text" id="xy" /></label>
                  oder ich schreibe es hintereinander und nutze Zeilenumbrüche:
                  Code:
                  <label for="xy">Labeltext:</label><input type="text" id="xy" /><br />
                  Gruß,

                  Feeela
                  Je grösser der Dachschaden, desto schöner der Ausblick zum Himmel. - [WIKI]Karlheinz Deschner[/WIKI]

                  Kommentar

                  Lädt...
                  X