Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Labelling form elements

Featured Replies

I'm trying to validate this site to WAI guidelines but am failing because of the search box. I'm having trouble understanding what I need to do from this error message:

 

* Failure - INPUT Element, of Type TEXT, at Line: 38, Column: 1 in FORM Element at Line: 36, Column: 1

# Rule: 12.4.2 - Identify all TEXTAREA elements that do not have an explicit LABEL association.

 

I've tried labelling the text input and adding an alt but neither works.

 

Can anyone help me understand labelling etc in plain language?

You need to associate a LABEL tag with the form control...

 

<label for="firstname">Search</label> <input type="text" name="firstname" id="firstname" /> <input type="submit" value="search" />

 

Reference http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/H44

 

Or you can add a TITLE attribute to the INPUT tag

 

<input type="text" title="Type search term here" value="Type search term here"/> <input type="submit" value="Search"/>

  • Author

Thanks bluedreamer! The label worked, screwed up the look of the input box for some reason but now I just need to style it.

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.