HTML Forms Autocomplete Naming Convension

When designing forms I have found out that it is good strategy to embrace autocomplete instead of disable it (autocomplete=off). This is especially relevant in order to give nice user experience for non-keyboard devices. However, I have not really find out any good documentation on what are the best practices to use Auto Complete on forms.

AutoComplete is enabled by default in all browsers and provides the following advantages:

  • Information is stored on the user’s computer.
  • User experience is simplified by helping the user fill out forms.
  • User information remains secure. While users can see their private information on a Web site, a Web site cannot see the list of personal information until one of the stored values is selected and the field is filled in.

How to name forms to have working autocomplete
Browser seems to collect information from the forms based on how they are named. Some developers use internal naming which makes it difficult but it seems to me that the most common format is vCard format. By looking vCard-naming conventions this patterns should be working on most of the cases.

Cellular
Company
Department

DisplayName
Email
FirstName

Gender
Home.City
Home.Country

Home.Fax
Home.Phone
Home.State

Home.StreetAddress
Home.Zipcode
Homepage

JobTitle
LastName
MiddleName

Notes
Office
Pager

Business.City
Business.Country
Business.Fax

Business.Phone
Business.State
Business.StreetAddress

Business.URL
Business.Zipcode

 

Please, let me know if you have more info on this topic.