$30 off During Our Annual Pro Sale. View Details »

7 things you didn't know about <input>

Phil Nash
February 05, 2020

7 things you didn't know about <input>

The element is one of the most versatile, but it does so much you might not know some of the more esoteric attributes available to you. This talk shows off 7 attributes of the element and their uses that you might not have known about.

--
Links:

HTML attributes to improve your users' two factor authentication experience: https://twil.io/2fa-attrs

Phil Nash

February 05, 2020
Tweet

More Decks by Phil Nash

Other Decks in Technology

Transcript

  1. 7 THINGS YOU 7 THINGS YOU 7 THINGS YOU DIDN'T

    KNOW DIDN'T KNOW DIDN'T KNOW ABOUT <INPUT> ABOUT <INPUT> ABOUT <INPUT> @philnash
  2. THE POWER OF AN THE POWER OF AN THE POWER

    OF AN ELEMENT ELEMENT ELEMENT @philnash
  3. THE POWER OF AN THE POWER OF AN THE POWER

    OF AN ATTRIBUTE ATTRIBUTE ATTRIBUTE @philnash
  4. THE MANY TYPES OF THE MANY TYPES OF THE MANY

    TYPES OF THE <INPUT> THE <INPUT> THE <INPUT> ELEMENT ELEMENT ELEMENT @philnash
  5. 7 THINGS YOU 7 THINGS YOU 7 THINGS YOU DIDN'T

    KNOW DIDN'T KNOW DIDN'T KNOW ABOUT <INPUT> ABOUT <INPUT> ABOUT <INPUT> @philnash
  6. IT'S ABOUT IT'S ABOUT IT'S ABOUT VALIDATION VALIDATION VALIDATION BUT

    ALSO BUT ALSO BUT ALSO KEYBOARDS KEYBOARDS KEYBOARDS @philnash
  7. IT'S ABOUT NOT IT'S ABOUT NOT IT'S ABOUT NOT PRESSING

    PRESSING PRESSING SHIFT SHIFT SHIFT @philnash
  8. autocomplete name, honorific-prefix, given-name, additional-name, family-name, honorific-suffix, nickname, email, username,

    new-password, current-password, one-time-code, organization-title, organization, street-address, address-line1, address-line2, address-line3, address-level4, address-level3, address-level2, address-level1, country, country-name, postal-code, cc-name, cc-given-name, cc- additional-name, cc-family-name, cc-number, cc-exp, cc-exp- month, cc-exp-year, cc-csc, cc-type, transaction-currency, transaction-amount, language, bday, bday-day, bday-month, bday- year, sex, tel, tel-country-code, tel-national, tel-area-code, tel-local, tel-extension, impp, url, photo @philnash
  9. autocomplete name, honorific-prefix, given-name, additional-name, family-name, honorific-suffix, nickname, email, username,

    new-password, current-password, one-time-code, organization-title, organization, street-address, address-line1, address-line2, address-line3, address-level4, address-level3, address-level2, address-level1, country, country-name, postal-code, cc-name, cc-given-name, cc- additional-name, cc-family-name, cc-number, cc-exp, cc-exp- month, cc-exp-year, cc-csc, cc-type, transaction-currency, transaction-amount, language, bday, bday-day, bday-month, bday- year, sex, tel, tel-country-code, tel-national, tel-area-code, tel-local, tel-extension, impp, url, photo @philnash
  10. autocomplete name, honorific-prefix, given-name, additional-name, family-name, honorific-suffix, nickname, email, username,

    new-password, current-password, one-time-code, organization-title, organization, street-address, address-line1, address-line2, address-line3, address-level4, address-level3, address-level2, address-level1, country, country-name, postal-code, cc-name, cc-given-name, cc- additional-name, cc-family-name, cc-number, cc-exp, cc-exp- month, cc-exp-year, cc-csc, cc-type, transaction-currency, transaction-amount, language, bday, bday-day, bday-month, bday- year, sex, tel, tel-country-code, tel-national, tel-area-code, tel-local, tel-extension, impp, url, photo @philnash
  11. 7 THINGS YOU 7 THINGS YOU 7 THINGS YOU DIDN'T

    KNOW DIDN'T KNOW DIDN'T KNOW ABOUT <INPUT> ABOUT <INPUT> ABOUT <INPUT> @philnash