Good forms

Brian LeRoux posted a few thoughts about forms and the idea of a “good form” resonated with me so I dogpiled some of my own thoughts and experiences on it. Here’s a compilation of those ideas. I’m sure this is incomplete and would love to see your list…


This content originally appeared on daverupert.com and was authored by daverupert.com

Brian LeRoux posted a few thoughts about forms and the idea of a “good form” resonated with me so I dogpiled some of my own thoughts and experiences on it. Here’s a compilation of those ideas. I’m sure this is incomplete and would love to see your list.

  • Good forms work without client JavaScript (Brian LeRoux)
  • Good forms always submit (Brian LeRoux)
  • Good forms remember values and display problems inline (Brian LeRoux)
  • Good login forms work with password managers (Mingo Hogan)
  • Good forms use a <form> tag
  • Good forms use appropriate input types
  • Good forms have clear labelled inputs and buttons
  • Good forms have focus states
  • Good forms have logical tab order
  • Good forms allow paste
  • Good form elements leverage the inputmode attribute
  • Good form elements leverage the autocomplete attribute
  • Good search forms wrap the <form> tag in a <search> element
  • Good forms can be reset with a <button type=reset>
  • Good forms participate in formData
  • Good forms don’t use placeholder as a label
  • Good forms work on phones
  • Good forms don’t popup and ask for personal information
  • Good forms only ask for what is necessary and aren’t too long
  • Good forms use HTTPS
  • Good forms use the proper HTTP verbs
  • Good forms validate on the client AND on the server
  • Good forms have been driven with a screen reader before going to production
  • Good forms clearly denote required attributes
  • Good forms warn about costly or destructive actions
  • Good forms make the baby Jesus smile
  • Good authenticated forms should have a server-generated nonce value
  • Good forms should do a pre-flight check for navigator.onLine before attempting a submit
  • Good forms start with accent-color for styling and only get more complex if necessary
  • Good forms see custom controls as a radioactive asset that must be removed at the earliest opportunity

Anyways. People should talk about forms more. Here’s some more resources on good form design.


This content originally appeared on daverupert.com and was authored by daverupert.com


Print Share Comment Cite Upload Translate Updates
APA

daverupert.com | Sciencx (2024-09-13T13:25:00+00:00) Good forms. Retrieved from https://www.scien.cx/2024/09/13/good-forms/

MLA
" » Good forms." daverupert.com | Sciencx - Friday September 13, 2024, https://www.scien.cx/2024/09/13/good-forms/
HARVARD
daverupert.com | Sciencx Friday September 13, 2024 » Good forms., viewed ,<https://www.scien.cx/2024/09/13/good-forms/>
VANCOUVER
daverupert.com | Sciencx - » Good forms. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2024/09/13/good-forms/
CHICAGO
" » Good forms." daverupert.com | Sciencx - Accessed . https://www.scien.cx/2024/09/13/good-forms/
IEEE
" » Good forms." daverupert.com | Sciencx [Online]. Available: https://www.scien.cx/2024/09/13/good-forms/. [Accessed: ]
rf:citation
» Good forms | daverupert.com | Sciencx | https://www.scien.cx/2024/09/13/good-forms/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.