#forms (128 links)
A collaborative tool that enables you to create online surveys with simplicity and elegance.
Nice.
- Designers Toolbox: OS Form Elements designerstoolbox.com
- A List Apart: Articles: Sign Up Forms Must Die alistapart.com
I believe we can get people engaged with digital services in a way that tells them how such services work and why they should care enough to use them. I also believe we can do this without explicitly making them fill out a sign-up form as a first step.
Ends with some excellent form design tips.
My personal experience registering for 87 accounts with the top online retailers and offer some tips for registration form design.
- Advancing Advanced Search - Boxes and Arrows: The design behind the design boxesandarrows.com
Advanced search functionality has not significantly developed in years. Poor matches and overwhelming search results remain a problem for users. Perhaps the standard search pattern deserves a new look.
Eight additional mistakes we've seen as we watch users try to create accounts and sign into the site.
- outbreak » Messing up the interface (written on December 13th, 2007 by Marko Mrdjenovic) friedcellcollective.net
"Let’s say you’re designing an interface for a contact form. There are a lot of people involved in the problem and they all have their own issues they want resolved." Contrived but useful example of how forms can get compllicated.
- SAKUZAKU » Blog Archive » I’ve Reached My Limit: Approaches to Character Limit Cutoffs blog.wearesakuzaku.com
"In real life, it’s important (and polite) not to obtrusively interrupt someone when they’re in the middle of something, and, of course, this carries over to website usability as well. So, how should we enforce form field character limits [...] ?
- Creating Accessible Forms | Stanford Online Accessibility Program soap.stanford.edu
There are a number of factors that contribute to the accessibility and usability of forms, including layout, labeling and grouping.
"Internet Explorer [...] has a bug where clicking on an image inside a label tag does nothing [...] What I've done is put together a quick bit of unobtrusive JavaScript to "fix" the problem." Nasty, but if you have images as labels...
Occasionally we all accidentally hit the reset button on a web form and lose all of what we just spent time typing out. I’ve written a little bit of javascript that makes it possible to recover from these disasters.
- Web Application Form Design uie.com
Variations in the alignment of input fields, their respective labels, calls to action, and their surrounding visual elements can support or impair different aspects of user behavior.
- Styling File Inputs with CSS and the DOM // ShaunInman.com shauninman.com
File inputs are the bane of beautiful form design. [...] This simple, three-part progressive enhancement provides the markup, CSS, and JavaScript to address the long-standing irritation.
Because secondary actions can have negative consequences, especially when used unintentionally, I’ve often argued they should be absent from forms.[...]That said there are situations where secondary actions make sense.
- fValidator - An open source (free) unobtrusive javascript tool for easy handling form validation zend.lojcomm.com.br
"An open source (free) unobtrusive javascript tool for easy handling form validation." Looks ok, but shame it's Mootools and not jQuery (making it useless for us).
- Building Accessible Web Applications paciellogroup.com
- Form field hints with CSS and JavaScript (Ask the CSS Guy) askthecssguy.com
It's a basic example of how helpful a little JavaScript and CSS can be in a form. Instead of the input hints always showing and potentionally cluttering a very simple form, only the hint for the currently focused input will show.
- Uni-Form dnevnikeklektika.com
"Uni-Form is an attempt to standardize form markup (xhtml) and css, "modularize" it, so even people with only basic knowledge of these technologies can get nice looking, well structured, highly customizable, semantic, accessible and usable forms."
This article shows some of the new functionality of the proposed form chapter of HTML5: Web Forms 2.
- Styling form controls with CSS, revisited | 456 Berea Street 456bereastreet.com
224 screenshots showing the effects of various CSS rules applied to form controls.
- A List Apart: Articles: Making Compact Forms More Accessible alistapart.com
Forms pose a series of usability and accessibility challenges, many of which are made more complex when you need to build a form to fit into a small space.
- Nidahas » Forms markup and CSS - Revisited nidahas.com
A flexible, semantically correct, and dare I say, accessible template to which such features could be readily applied.
- Digital Web Magazine - Push my <code>button</code> digital-web.com
Read the comments for this article - button is best avoided.
There was a large amount of interest in last month’s Web Application Form Design article, so I decided to provide some additional details.
- Label Placement in Forms :: UXmatters uxmatters.com
Evaluating label placement in forms with eyetracking.
- Smashing Magazine | Blog Archive » CSS-Based Forms: Modern Solutions smashingmagazine.com
Modern solutions a web-developer can use [when] designing his/her next css-based form.
Choose LEGEND text that is:Concise: between 1 and 6 words; Relevant: to every single form field in the FIELDSET; Seamless: in that the words chosen for the LEGEND should make sense when joined to each label phrase.
Accessible, pretty forms developed by Philip Howard
- Accessible interdependent dropdowns onlinetools.org
- Selecting country names in forms | 456 Berea Street 456bereastreet.com
More comments on previous link
- Bruce Lawson’s personal site : Forms: inputting country names brucelawson.co.uk
The most accessible, user-friendly way to receive input that a user incontravertibly knows is to ask the user to type their response into a free-text field, rather than require them to select it.
- HTML: multiple select boxes or checkbox lists? krijnhoetmer.nl
Using <select multiple[="multiple"]> or a list with <input type="checkbox">s?
"I wanted a robust javascript validation library that was simple to implement and didn't require me do any extra work other than creating the form. My favourite idea for a method of doing this is to utilise the field elements' class attribute to indicate
- Using size to size inputs | Bite Size Standards bitesizestandards.com
Due to its seemingly presentational nature not many designers use it, opting to set the width using CSS instead. [However], 'size' is not presentational.
- Creative Latitude: Resources: Downloads creativelatitude.com
CreativePublic is your one-stop shop for quality forms, contracts, employee manuals, company policies and pricing for graphic designers. Download free samples.
- Juicy Studio: Form Help without Popups juicystudio.com
- The Man in Blue > Accessible, stylish form layout themaninblue.com
- Access Matters : Speaking form labels - Summary access-matters.com
- Communicating error messages accessibly - Standards-schmandards standards-schmandards.com
Proposal for accessible error messages