Forms an appropriate use of tables?

Discussion in 'HTML' started by Michael Wilcox, Sep 6, 2003.

  1. Is the following code a good use of tables?

    <form action="store.php" method="post">
    <table>
    <tr><td style="text-align: right;">Name:</td><td><input type="text"
    name="from"></td></tr>
    <tr><td style="text-align: right;">Email:</td><td><input type="text"
    name="email"></td></tr>
    <tr><td style="text-align: right;">Body:</td><td><textarea
    name="body"></textarea></td></tr>
    </table>
    <input type="submit" value="Send">
    </form>

    The labels (name, email, body) do refer to the adjacent cell, and it seems
    like it should be acceptable, but I thought I should ask.
    --
    Michael Wilcox
    Essential Tools for the Web Developer - http://mikewilcox.t35.com
    mjwilco at yahoo dot com
     
    Michael Wilcox, Sep 6, 2003
    #1
    1. Advertising

  2. Michael Wilcox wrote:

    > Is the following code a good use of tables?

    (snip example)
    > The labels (name, email, body) do refer to the adjacent cell, and it seems
    > like it should be acceptable, but I thought I should ask.


    It is pushing the bounds, but I would class it as reasonable.

    Make sure to also use the <label> tag, for example:

    <tr>
    <td style="text-align: right;">
    <label for="from">Name</label>:
    </td>
    <td>
    <input type="text" name="from" id="from">
    </td>
    </tr>

    This explicitly specifies the relationship between input fields and their
    labels. Note that the "for" attribute specifies an *id*, not a *name*, so
    it means you have to add both an *id* _and_ a *name* to your fields. This
    does not cause any problems in submitting the forms.

    --
    Toby A Inkster BSc (Hons) ARCS | mailto: | pgp:0x6A2A7D39
    aim:inka80 | icq:6622880 | yahoo:tobyink | jabber:
    http://www.goddamn.co.uk/tobyink/ | "You've got spam!"
    playing://(nothing)
     
    Toby A Inkster, Sep 6, 2003
    #2
    1. Advertising

  3. "Michael Wilcox" <> wrote:

    > Is the following code a good use of tables?


    Opinions differ on the question whether a set of a field label, input
    field pairs logically constitutes a table. If you ask me, it does.
    On the practical side, for accessibility it would be useful to associate
    the labels with the fields in markup, but this is also true (though not as
    important) when tables are not used. Example:

    <tr><td ...><label for="name" Name:</td><td><input id="name" type="text"
    name="from"></td></tr>

    By the way, your textarea lacks the required rows and cols attributes,
    which means that the effect is unpredictable:

    > <tr><td style="text-align: right;">Body:</td><td><textarea
    > name="body"></textarea></td></tr>
    > </table>


    Better use some rows and cols attributes, even if you have a style sheet
    that may override those dimensions.

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
    Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html
     
    Jukka K. Korpela, Sep 6, 2003
    #3
  4. Isofarro <> wrote:
    > No.


    Why not?

    > The table cell holding the text "Name:" is actually a table header so
    > mark it up as such, and add in a scope="right" . Then migrate the
    > style information into a stylesheet.


    Why is it a table header? It only has to do with one input.
    --
    Michael Wilcox
    Essential Tools for the Web Developer - http://mikewilcox.t35.com
    mjwilco at yahoo dot com
     
    Michael Wilcox, Sep 6, 2003
    #4
  5. Michael Wilcox

    Isofarro Guest

    Michael Wilcox wrote:

    > Is the following code a good use of tables?


    No.

    >
    > <form action="store.php" method="post">
    > <table>
    > <tr><td style="text-align: right;">Name:</td><td><input type="text"
    > name="from"></td></tr>


    The table cell holding the text "Name:" is actually a table header so mark
    it up as such, and add in a scope="right" . Then migrate the style
    information into a stylesheet.

    Then encapsulate Name: in a label element with the attribute for="from".



    --
    Iso.
    FAQs: http://html-faq.com http://alt-html.org http://allmyfaqs.com/
    Recommended Hosting: http://www.affordablehost.com/
    Web Standards: http://www.webstandards.org/
     
    Isofarro, Sep 6, 2003
    #5
  6. Michael Wilcox

    Isofarro Guest

    Michael Wilcox wrote:

    > Isofarro <> wrote:
    >> No.

    >
    > Why not?


    Because its missing some structural elements. td, label, scope, table
    summary

    >> The table cell holding the text "Name:" is actually a table header so
    >> mark it up as such, and add in a scope="right" . Then migrate the
    >> style information into a stylesheet.

    >
    > Why is it a table header? It only has to do with one input.


    You've answered the question.


    --
    Iso.
    FAQs: http://html-faq.com http://alt-html.org http://allmyfaqs.com/
    Recommended Hosting: http://www.affordablehost.com/
    Web Standards: http://www.webstandards.org/
     
    Isofarro, Sep 6, 2003
    #6
  7. Isofarro <> wrote:
    > Michael Wilcox wrote:
    >
    >> Isofarro <> wrote:
    >>> No.

    >>
    >> Why not?

    >
    > Because its missing some structural elements. td, label, scope, table
    > summary


    Ok, I think I fixed it up. See the whole page code at
    http://codedump.phpfreaks.com/viewcode.php?id=1374
    --
    Michael Wilcox
    Essential Tools for the Web Developer - http://mikewilcox.t35.com
    mjwilco at yahoo dot com
     
    Michael Wilcox, Sep 6, 2003
    #7
  8. "Michael Wilcox" <> wrote in message
    news:Ign6b.2033$...
    > Is the following code a good use of tables?
    >
    > <form action="store.php" method="post">
    > <table>
    > <tr><td style="text-align: right;">Name:</td><td><input type="text"
    > name="from"></td></tr>
    > <tr><td style="text-align: right;">Email:</td><td><input type="text"
    > name="email"></td></tr>
    > <tr><td style="text-align: right;">Body:</td><td><textarea
    > name="body"></textarea></td></tr>
    > </table>
    > <input type="submit" value="Send">
    > </form>
    >
    > The labels (name, email, body) do refer to the adjacent cell, and it seems
    > like it should be acceptable, but I thought I should ask.


    Not really.
    At least they're adjacent to each other.
    However, if it is accessibility you're after, you should label those inputs,
    too.

    http://webaim.org/howto/forms/


    --
    Karl Core

    Charles Sweeney says my sig is fine as it is.
     
    EightNineThree, Sep 6, 2003
    #8
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. darrel
    Replies:
    6
    Views:
    368
    darrel
    Jan 20, 2005
  2. SenthilVel
    Replies:
    1
    Views:
    3,507
    dd_fruend
    Aug 4, 2006
  3. Replies:
    3
    Views:
    255
    Bruno Desthuilliers
    Jan 30, 2008
  4. Chris Mohan
    Replies:
    0
    Views:
    103
    Chris Mohan
    Jul 21, 2004
  5. Gavin Kistner

    Appropriate use of camelCase

    Gavin Kistner, Feb 23, 2004, in forum: Ruby
    Replies:
    3
    Views:
    168
Loading...

Share This Page