form: The Form element

The <form> HTML element represents a document section containing interactive controls for submitting information to a web server.

Attributes

Specific attributes

Recommended attributes

method="[HTTP method]" specifies the HTTP method used when submitting the form. Possible values are:

• get: Form data is appended to the URL as query parameters (default)
• post: Form data is sent in the request body (recommended for sensitive data)

Allowed attributes

action="[URL]" specifies where to send the form data when the form is submitted. If not specified, the form is submitted to the same URL as the current page.

enctype="[encoding type]" specifies how form data should be encoded when submitted with method=“post”. Possible values are:

• application/x-www-form-urlencoded: Default encoding
• multipart/form-data: Required when uploading files
• text/plain: Plain text (rarely used)

name="[name]" the name of the form, used to reference it in scripts.

novalidate prevents the browser from validating form inputs before submission.

target="[target]" specifies where to display the response after submitting the form:

• _self: Same window (default)
• _blank: New window or tab
• _parent: Parent frame
• _top: Full window

Global attributes

accesskey Specifies a keyboard shortcut to activate or focus an element.

aria-* Defines accessibility properties and states for assistive technologies.

class Specifies one or more CSS class names for styling the element.

data-* Stores custom data private to the page or application.

dir Sets the text direction (left-to-right, right-to-left, or auto).

hidden Hides the element from display and assistive technologies.

id Defines a unique identifier for the element within the document.

inputmode Hints which virtual keyboard type to display on mobile devices.

itemid Provides a global identifier for microdata items.

itemprop Defines a property name-value pair for microdata.

itemref Associates properties with an item via element IDs for microdata.

itemscope Creates a new microdata item container.

itemtype Specifies the vocabulary URL for microdata items (like Schema.org).

lang Specifies the primary language of the element’s content.

nonce Provides a cryptographic nonce for Content Security Policy.

role Defines the element’s semantic role for accessibility.

tabindex Controls keyboard navigation order and focusability.

title Provides advisory information displayed as a tooltip.

Example

<form action="/newsletter-signup" method="post">
  <h2>Join Our IndieWeb Community</h2>
  <p>Get updates about personal websites, open web standards, and community events.</p>
  
  <label for="email">Email Address:</label>
  <input type="email" id="email" name="email" required>
  
  <label for="website">Your Website (optional):</label>
  <input type="url" id="website" name="website" placeholder="https://your-domain.com">
  
  <fieldset>
    <legend>Interests</legend>
    <label><input type="checkbox" name="interests" value="static-sites"> Static Site Generators</label>
    <label><input type="checkbox" name="interests" value="webmentions"> Webmentions</label>
    <label><input type="checkbox" name="interests" value="microformats"> Microformats</label>
    <label><input type="checkbox" name="interests" value="indieauth"> IndieAuth</label>
  </fieldset>
  
  <button type="submit">Join Community</button>
</form>

<form action="/contact" method="post" enctype="multipart/form-data">
  <h2>Submit Your Site for Review</h2>
  
  <label for="site-url">Website URL:</label>
  <input type="url" id="site-url" name="site-url" required>
  
  <label for="screenshot">Screenshot (optional):</label>
  <input type="file" id="screenshot" name="screenshot" accept="image/*">
  
  <label for="description">Tell us about your site:</label>
  <textarea id="description" name="description" rows="4" cols="50"></textarea>
  
  <button type="submit">Submit for Review</button>
</form>