http://en.wikipedia.org/wiki/International_Typographic_Style Doesn't say much about it, but that is probably appropriate. :)
Basically it means designing with an invisible grid that everything lines up to. Glen On 6/11/07, Jörn Zaefferer <[EMAIL PROTECTED]> wrote:
Glen Lipka wrote: > Exciting! > > Here would be my (humble) suggestions: > > 1. Required fields. As a general rule, you should have a * asterisk > to the left or right of the input field in a straight vertical line to > indicate required. Bold is ok, but it's not quite enough to let the > user know. > 2. When the user clicks submit, it puts all these words on the right > in red. Its sort of overwhelming. Highlighting the input field is > more important than red to the right. Red to the right makes more > sense as Inline errors. Like email or password format. Gonna work on that, though with a different example. > 3. It still could use something at the top. Like "You missed X > field(s). They have been highlighted below. This implies you should > scroll to the top of the form when submit with this kind of error. > Think of a long form, where the user clicks submit and missed the very > first field. It would be offscreen otherwise. That is something the error container should be good for. > 4. When doing it right, the checkbox is a nice touch, but I would make > it a little more subtle. Additionally, use Swiss Design techniques. > This means everything lines up. So all the checks line up vertically. I konw the Swiss army knife, but hadn't heard of "Swiss Design". Its mostly a CSS/layout issue, but nonetheless important. > 5. As a general rule, I usually make form fields taller. Users have > terrible fine motor skills. A big box is easier to input. Check out > the username and password fields in Wordpress. > http://www.commadot.com/wp-admin Yeah, those are hard to miss. > 6. Onblur of the password field. it's usually good practice to erase > the field once you have a mismatch. It's near impossible to try to > fix it with the stars there. Maybe that could be an option in the > setup? like errorClearInput: false; or whatever. I don't like that clearing for other fields, but I agree that its good for password fields. Thats the behaviour most users should be used to anyway (eg. OS login, PIN numbers) > 7. Looking at the setup. I like the {0} to represent the number, but > what if the number is 1. Then it would say, Enter at least 1 > characters. Singular vs. Plural. It's a nitpick to be sure, but it's > good grammar. if you could say minLength: String.format("Enter at > least {0} character{"s"}") or whatever...something to say greater than > 1 gets this otherwise, default. It's not critical, but its a nice to > have. Tricky, but not impossible. I see what I can do about it. > > I recently just launched a form that I tried, but couldn't use the > validation plugin.. > Check out the form. I actually have some issues with it, but its ok. > http://app.marketo.com/signup/signup/code/standard > <http://app.marketo.com/signup/signup/code/standard> Gonna take that as the base for the next example to work on. > Notice the tooltip on the password. I used hoverIntent. Cool > plugin. That would be a kickass addition to your validator. > Like have a "hint" declaration which would insert a questionmark with > hover attached. And if hoverIntent exists, then it could use that > instead? I really have to check how to build a nice tooltip plugin on top of hoverIntent. > Anyway, I hope this helps out some. :) Thanks again, Glen! -- Jörn Zaefferer http://bassistance.de
