Checkout not blocked by unnecessary account fields

Every required field that isn't essential for fulfillment is a chance for the shopper to abandon. Asking for company name, middle name, birthday, or newsletter opt-in as mandatory fields on a one-time purchase is a self-inflicted conversion cut. Baymard's checkout benchmark sets the median essential-field count near seven — forms demanding twelve required fields underperform the median by a wide margin, and the damage is concentrated on mobile where each extra tap compounds.

In src/components/CheckoutForm.tsx, mark only name, email, shipping address lines, city, region, postal code, country, and phone as required. Drop required from company, middle name, birthday, newsletter, and "how did you hear about us." Move opt-ins to unchecked checkboxes.

<input name="name" required />
<input name="email" type="email" required />
<input name="company" /> {/* optional */}
<label><input type="checkbox" /> Subscribe to newsletter</label>

• ID: ecommerce-cart-ux.address-forms.minimal-fields

• Severity: low

• What to look for: Count every required field (marked required or validated as mandatory) in the checkout form. Classify each as: (a) essential for fulfillment (name, email, shipping address, payment), (b) carrier-required (phone for shipping carriers), (c) non-essential (company name, middle name, birthday, marketing preferences, account profile fields). Quote the field names and their required status from the form component code. Count how many non-essential fields are marked as required.

• Pass criteria: No more than 2 non-essential fields are marked as required in the checkout form. Essential fields for shipping and payment are: name, email, street address, city, state/province, zip/postal, country (7 fields). Any additional required fields beyond these 7 plus phone should be justified. Report: "X total required fields, Y essential, Z non-essential required."

• Fail criteria: More than 2 non-essential fields are required (e.g., company, middle name, birthday, newsletter opt-in are all required).

• Skip (N/A) when: No checkout form exists (digital products with no shipping, or no payment processing).

• Detail on fail: Example: "Checkout form at src/components/CheckoutForm.tsx has 12 required fields. 7 are essential, 5 are non-essential (company, middle name, birthday, how-did-you-hear, newsletter). 5 non-essential required fields exceeds the 2-field threshold."

• Cross-reference: For guest checkout and avoiding forced account creation, see the guest-checkout check in Checkout Flow. For form accessibility of required field indicators, the Accessibility Fundamentals audit covers form labeling.

• Remediation: Reduce required fields in your checkout form at src/components/CheckoutForm.tsx:

  // src/components/CheckoutForm.tsx
  function CheckoutForm() {
    return (
      <>
        <label>Name *<input required /></label>
        <label>Email *<input required type="email" /></label>
        <label>Address *<input required /></label>
        <label>Phone *<input required type="tel" /></label>
        {/* Non-essential — make optional */}
        <label>Company Name<input /></label>
        <label><input type="checkbox" /> Subscribe to newsletter</label>
      </>
    )
  }