René's URL Explorer Experiment


Title: Forms  |  web.dev

Open Graph Title: Forms  |  web.dev

Description: An overview of forms in HTML.

Open Graph Description: An overview of forms in HTML.

Opengraph URL: https://web.dev/learn/html/forms

X: @ChromiumDev

direct link

Domain: web.dev

google-signin-client-id157101835696-ooapojlodmuabs2do2vuhhnf90bccmoi.apps.googleusercontent.com
google-signin-scopeprofile email https://www.googleapis.com/auth/developerprofiles https://www.googleapis.com/auth/developerprofiles.award https://www.googleapis.com/auth/devprofiles.full_control.firstparty
og:site_nameweb.dev
og:typewebsite
theme-color#3740ff
NoneIE=Edge
og:imagehttps://web.dev/static/images/social-wide.jpg
og:image:width1200
og:image:height675
og:localeen
twitter:cardsummary
twitter:imagehttps://web.dev/static/images/social-wide.jpg

Links:

Skip to main content https://web.dev/learn/html/forms#main-content
https://web.dev/
Resources https://web.dev/learn
HTML https://web.dev/html
CSS https://web.dev/css
JavaScript https://web.dev/javascript
Performance https://web.dev/performance
Accessibility https://web.dev/accessibility
Identity https://web.dev/identity
Learn HTML https://web.dev/learn/html
Learn CSS https://web.dev/learn/css
Learn JavaScript https://web.dev/learn/javascript
Learn AI https://web.dev/learn/ai
Learn Performance https://web.dev/learn/performance
Learn Accessibility https://web.dev/learn/accessibility
More courses https://web.dev/learn
AI and the web https://web.dev/explore/ai
Explore https://web.dev/explore
PageSpeed Insights https://pagespeed.web.dev/
Podcasts & shows https://web.dev/shows
Developer Newsletter https://web.dev/newsletter
About web.dev https://web.dev/about
Discover https://web.dev/discover
Baseline https://web.dev/baseline
How to use Baseline https://web.dev/how-to-use-baseline
Blog https://web.dev/blog
Case Studies https://web.dev/case-studies
Resources https://web.dev/learn
AI https://web.dev/learn/ai
Privacy https://web.dev/learn/privacy
Accessibility https://web.dev/learn/accessibility
HTML https://web.dev/learn/html
Images https://web.dev/learn/images
Responsive Design https://web.dev/learn/design
Forms https://web.dev/learn/forms
PWA https://web.dev/learn/pwa
CSS https://web.dev/learn/css
Performance https://web.dev/learn/performance
Testing https://web.dev/learn/testing
JavaScript https://web.dev/learn/javascript
https://web.dev/
Resources https://web.dev/learn
AI https://web.dev/learn/ai
Privacy https://web.dev/learn/privacy
Accessibility https://web.dev/learn/accessibility
HTML https://web.dev/learn/html
Images https://web.dev/learn/images
Responsive Design https://web.dev/learn/design
Forms https://web.dev/learn/forms
PWA https://web.dev/learn/pwa
CSS https://web.dev/learn/css
Performance https://web.dev/learn/performance
Testing https://web.dev/learn/testing
JavaScript https://web.dev/learn/javascript
Discover https://web.dev/discover
Baseline https://web.dev/baseline
How to use Baseline https://web.dev/how-to-use-baseline
Blog https://web.dev/blog
Case Studies https://web.dev/case-studies
Welcome to Learn HTML!https://web.dev/learn/html/welcome
Overview of HTMLhttps://web.dev/learn/html/overview
Document structurehttps://web.dev/learn/html/document-structure
Metadatahttps://web.dev/learn/html/metadata
Semantic HTMLhttps://web.dev/learn/html/semantic-html
Headings and sectionshttps://web.dev/learn/html/headings-and-sections
Attributeshttps://web.dev/learn/html/attributes
Text basicshttps://web.dev/learn/html/text-basics
Linkshttps://web.dev/learn/html/links
Listshttps://web.dev/learn/html/lists
Navigationhttps://web.dev/learn/html/navigation
Tableshttps://web.dev/learn/html/tables
Formshttps://web.dev/learn/html/forms
Imageshttps://web.dev/learn/html/images
Audio and Videohttps://web.dev/learn/html/audio-video
Template, slot, and shadowhttps://web.dev/learn/html/template
HTML APIshttps://web.dev/learn/html/apis
Focushttps://web.dev/learn/html/focus
Other inline text elementshttps://web.dev/learn/html/inline-text
Details and summaryhttps://web.dev/learn/html/details
Dialoghttps://web.dev/learn/html/dialog
Conclusion and next stepshttps://web.dev/learn/html/conclusion
HTML https://web.dev/html
CSS https://web.dev/css
JavaScript https://web.dev/javascript
Performance https://web.dev/performance
Accessibility https://web.dev/accessibility
Identity https://web.dev/identity
Learn HTML https://web.dev/learn/html
Learn CSS https://web.dev/learn/css
Learn JavaScript https://web.dev/learn/javascript
Learn AI https://web.dev/learn/ai
Learn Performance https://web.dev/learn/performance
Learn Accessibility https://web.dev/learn/accessibility
More courses https://web.dev/learn
AI and the web https://web.dev/explore/ai
Explore https://web.dev/explore
PageSpeed Insights https://pagespeed.web.dev/
Podcasts & shows https://web.dev/shows
Developer Newsletter https://web.dev/newsletter
About web.dev https://web.dev/about
Read the announcementhttps://goo.gle/mwg-stable
web.dev https://web.dev/
Resources https://web.dev/learn
HTML https://web.dev/learn/html
DoWebsitesNeedToLookExactlyTheSameInEveryBrowser.comhttp://dowebsitesneedtolookexactlythesameineverybrowser.com/
MachineLearningWorkshop.comhttps://machinelearningworkshop.com/
HTML
element
https://developer.mozilla.org/docs/Web/HTML/Element/form
landmarkhttps://developer.mozilla.org/docs/Web/Accessibility/ARIA/Roles#3._landmark_roles
CSShttps://codepen.io/jcoulterdesign/pen/NOMeEb
Learn Formshttps://web.dev/learn/forms
client-side constraint validationhttps://web.dev/learn/html/forms#built-in_validation
novalidatehttps://developer.mozilla.org/docs/Web/HTML/Element/form#attr-novalidate
HTTP methodhttps://web.dev/learn/forms/form-element#how_is_the_data_transferred
elementhttps://web.dev/learn/forms/form
actionhttps://developer.mozilla.org/docs/Web/HTML/Element/form#attr-action
methodhttps://developer.mozilla.org/docs/Web/HTML/Element/form#attr-method
the dialog sectionhttps://web.dev/learn/html/dialog
enctypehttps://web.dev/learn/forms/form#enable_users_to_submit_files
targethttps://web.dev/learn/html/attributes
22 input typeshttps://developer.mozilla.org/docs/Web/HTML/Element/Input#input_types
:defaulthttps://developer.mozilla.org/docs/Web/CSS/:default
:checkedhttps://developer.mozilla.org/docs/Web/CSS/:checked
requiredhttps://developer.mozilla.org/docs/Web/HTML/Attributes/required
form control is requiredhttps://www.deque.com/blog/anatomy-of-accessible-forms-required-form-fields/
https://developer.mozilla.org/docs/Web/HTML/Element/legend
https://developer.mozilla.org/docs/Web/HTML/Element/fieldset
https://developer.mozilla.org/docs/Web/HTML/Element/label
information about form designhttps://web.dev/learn/forms/design-basics
and
can be styled
https://developer.mozilla.org/docs/Web/HTML/Element/fieldset#styling_with_css
forms module of Learn Accessibilityhttps://web.dev/learn/accessibility/forms
22 different types of inputshttps://developer.mozilla.org/docs/Web/HTML/Element/Input#input_types
accepthttps://developer.mozilla.org/docs/Web/HTML/Attributes/accept
capturehttps://developer.mozilla.org/docs/Web/HTML/Attributes/capture
media capture specificationhttps://w3c.github.io/html-media-capture/#the-capture-attribute
:requiredhttps://developer.mozilla.org/docs/Web/CSS/:required
:optionalhttps://developer.mozilla.org/docs/Web/CSS/:optional
requiredhttps://developer.mozilla.org/docs/Web/HTML/Attributes/required
:defaulthttps://developer.mozilla.org/docs/Web/CSS/:default
checkedhttps://developer.mozilla.org/docs/Web/HTML/Element/input#checked
:enabledhttps://developer.mozilla.org/docs/Web/CSS/:enabled
:disabledhttps://developer.mozilla.org/docs/Web/CSS/:disabled
disabledhttps://developer.mozilla.org/docs/Web/HTML/Attributes/disabled
:read-writehttps://developer.mozilla.org/docs/Web/CSS/:read-write
contenteditablehttps://developer.mozilla.org/docs/Web/HTML/Global_attributes/contenteditable
readonlyhttps://developer.mozilla.org/docs/Web/HTML/Attributes/readonly
:read-onlyhttps://developer.mozilla.org/docs/Web/CSS/:read-only
:validhttps://developer.mozilla.org/docs/Web/CSS/:valid
:invalidhttps://developer.mozilla.org/docs/Web/CSS/:invalid
:in-rangehttps://developer.mozilla.org/docs/Web/CSS/:in-range
:out-of-rangehttps://developer.mozilla.org/docs/Web/CSS/:out-of-range
:user-invalidhttps://developer.mozilla.org/docs/Web/CSS/:user-invalid
:user-validhttps://developer.mozilla.org/docs/Web/CSS/:user-valid
:invalid CSS pseudo-classhttps://developer.mozilla.org/docs/Web/CSS/:invalid
validityState.valueMissinghttps://developer.mozilla.org/docs/Web/API/ValidityState/valueMissing
:out-of-rangehttps://developer.mozilla.org/docs/Web/CSS/:out-of-range
valididityState.rangeUnderflowhttps://developer.mozilla.org/docs/Web/API/ValidityState/rangeUnderflow
validityState.rangeOverflowhttps://developer.mozilla.org/docs/Web/API/ValidityState/rangeUnderflow
validityState.stepMismatchhttps://developer.mozilla.org/docs/Web/API/ValidityState/stepMismatch
minlengthhttps://developer.mozilla.org/docs/Web/HTML/Attributes/minlength
maxlengthhttps://developer.mozilla.org/docs/Web/HTML/Attributes/maxlength
validityState.tooLonghttps://developer.mozilla.org/docs/Web/API/ValidityState/tooLong
validityState.tooShorthttps://developer.mozilla.org/docs/Web/API/ValidityState/tooShort
https://developer.mozilla.org/docs/Web/HTML/Element/output
validityState.patternMismatchhttps://developer.mozilla.org/docs/Web/API/ValidityState/patternMismatch
validityState.typeMismatchhttps://developer.mozilla.org/docs/Web/API/ValidityState/typeMismatch
patternhttps://developer.mozilla.org/docs/Web/HTML/Attributes/pattern
TLDhttps://developer.mozilla.org/docs/Glossary/TLD
dynamically improve completionhttps://web.dev/learn/forms/javascript#validation_with_javascript
validityState.setCustomValidity('message here')https://web.dev/learn/forms/javascript#validation_with_javascript
Prettierhttps://prettier.io/
helping your users enter the right data in formshttps://web.dev/learn/forms/validation
Validation can be provided inhttps://web.dev/learn/forms/validation
designing formshttps://web.dev/learn/forms/internationalization
autocompletehttps://web.dev/learn/forms/autofill#how_does_autofill_work
Previous arrow_back Tables https://web.dev/learn/html/tables
Next Images arrow_forward https://web.dev/learn/html/images
Creative Commons Attribution 4.0 Licensehttps://creativecommons.org/licenses/by/4.0/
Apache 2.0 Licensehttps://www.apache.org/licenses/LICENSE-2.0
Google Developers Site Policieshttps://developers.google.com/site-policies
File a bug https://issuetracker.google.com/issues/new?component=1400680&template=1857359
See open issues https://issuetracker.google.com/issues?q=status:open%20componentid:1400680&s=created_time:desc
Chrome for Developers https://developer.chrome.com/
Chromium updates https://blog.chromium.org/
Case studies https://web.dev/case-studies
Podcasts & shows https://web.dev/shows
@ChromiumDev on X https://twitter.com/ChromiumDev
YouTube https://www.youtube.com/user/ChromeDevelopers
Chrome for Developers on LinkedIn https://www.linkedin.com/showcase/chrome-for-developers
RSS https://web.dev/static/blog/feed.xml
Terms https://policies.google.com/terms
Privacy https://policies.google.com/privacy
Manage cookies https://web.dev/learn/html/forms

Viewport: width=device-width, initial-scale=1

URLs of crawlers that visited me.