Author - Web Developer - Educator
Found 2 results for tag "oatmeal"
RSS Feed

Simple but effective: <label for=''>

It's amazing how something so simple can go a long ways, especially when most people don't know about it.

I'm talking about labels. Specifically, the <label for=''> attribute.

Common sense says "If you have a radio button or a checkbox on an HTML form, give it a label so people know what it is for."

Experience says "Make sure that each item has an id and name so it's universally accepted."

Better experience says "Add the for attribute to the label so your visitors don't require a microscope to click in the teeny-tiny little circle/box."

I will admit that Matt Inman (The Oatmeal) said it best:
The Oatmeal describes what [for] is for


If you don't code, here's what it looks like (click the label - doesn't do anything):

<label>Check Me</label> 
 
<input type='checkbox' name='ckbx'/>


Here's what the difference is (click the label, see the difference?):

<label for='ck_box'>Check Me</label> 
 
<input type='checkbox' name='ckbx' id='ck_box'/>


I just wanted to get that out in the open.

In summary, if you hand-code forms (like me), use the for attribute in your labels. It makes everybody's lives easier.


Tags:#label #for #labelfor #html #oatmeal #rant #tutorials

RSS Feed

This guy sent me an email so I decided to grade it.

Email Grade

Thanks to The Oatmeal for the idea. I'm not as funny as Matt Inman, but I thought I'd give it a try


Tags:#theoatmeal #email #grade #fail