$30 to improve form structure

[TheJoshMan]

I have a form that is cluttered horribly within a table that I would really like to clean up and convert to a tableless format. The total width has to be contained within 680px, but the height is infinite... If you're interested, let me know and I'll shoot you more details and the applicable HTML file. Would really like to have this done by tomorrow.

I would do it myself, but I'm already backed up with other aspects of this massive project.

Will pay via PayPal ($30)

[Snookerman]

Hey Nyne Lyvez, I'm interested, if you haven't found someone else, please send me all the details.

[Twey]

Mike made a point back in the day that most forms are actually tables, and I think I agree with him. Tables are certainly the least messy way to lay out forms that I've seen.

The total width has to be contained within 680px

Pixel-sizing? :-\

[TheJoshMan]

Yes, tables are nice for actual tabular data... But this form is anything but tabular. It's more freeform than anything, but it certainly doesn't look that way since it's trapped in a table.

Also, I've never really understood what all the hype is about regarding pixel sizing. Everyone seems to think that EM is the way to go... However, most people don't seem to realize that even EMs are pixel based.

You can't come up with 680px in EMs without first having a default PIXEL size for the font of the page.

So most sites that don't adjust the default font size would be using 16px font size which would then translate to 42.5em

However, if someone were using a smaller font size, like say 13px... Then the EM size for 680px would be 52.308em

So to me it's all just a crock. I mean you're still basing the size off of pixels in a roundabout way.

[Twey]

Aha, I see. Yes, free-form forms are an interesting design choice — I've used them to create something that's less like a table and more like a 'fill in the blanks' command to the system before. I think it's very intuitive to the users, although unfortunately, due to the word order of English, the 'submit' button tends to come first ([Create] a user called _____ with the password _____, associated with the email address _____). It works better in Japanese or a less word-order–oriented language.

Of course ems are pixel-based — computers display things in pixels, so they really have to be. However, they are based on a pixel size specified by the user and system, rather than one you've chosen, which is fairly likely to be completely wrong for any given system. 1em is guaranteed to be a sensible, readable size for a single character by default, no matter the system or display. If you base your site on that unit, you get an fixed-layout site that will always be a reasonable size (window/display size discrepancies aside — that's an unavoidable consequence of using fixed rather than fluid layout, which is why percentages are better where possible). In the worse-case scenario, users can resize your site by modifying the font size settings in their browser (modern browsers are increasingly including a 'zoom' feature to do this conveniently), which is not standardly possible if the site is pixel-sized.

[Snookerman]

I have to disagree with Mike (whoever that is). Forms are definitely not tabular data. Tabular data is something that cannot be understood unless inside a table, statistics for instance. Tabular data usually has columns with titles and the data inside each column is connected somehow. We use tables for tabular data because we need it to be inside a table even if CSS is turned off.

A form on the other hand can be designed in a multitude of ways and we don't need to put all labels in one column and all inputs in the other, for instance. Mike's argument that "most forms are actually tables" is ridiculously stupid. The same can be said about websites, most websites are actually tables and we should use tables to design them.

The issue about pixel sizing on the other hand (or third hand ), I agree with Twey completely. A good website is made using only ems (and maybe percentages). In this way it won't break if the user (i.e. IE user) changes the text size. This does of course not apply for websites that aren't about text, like a site with just pictures or whatever, but most websites have (or should have) text and ems is the smart way to go.

[Twey]

I have to disagree with Mike (whoever that is).

Mike Winter, a.k.a. mwinter. You can probably find his posts lying around here somewhere if you look.

A form on the other hand can be designed in a multitude of ways and we don't need to put all labels in one column and all inputs in the other, for instance.

We don't have to, but it is by and large the most common design, and it's definitely tabular. I did say ‘most’.

on the other hand (or third hand )

I believe the phrase is ‘on the gripping hand’.

[Snookerman]

I believe the phrase is ‘on the gripping hand’.

Heheh, that sounds much better
Btw, respect for using smart quotes, I wish online forms did that automatically (like Illustrator for instance(only example I can come up with now)). Maybe someone knows how to implement that on a site for the forums and comments? (Maybe I should start a new thread before John penalizes me )

[Twey]

Oh, I hope not. I hate it when I write something and the application mangles it. Smart quotes are hell on code, too. I'd much rather enter Unicode quotes myself.