Cheat Sheets
CSS (V2)
HTML
Microformats
HTML Character Entities
CSS (V1)
RGB Hex Colour Chart
Articles
robots.txt File
Learn how and why you should add a robots.txt file to your website.
The Box Model For Beginners
An explanation of what the box model is and how it is treated by different user agents.
HTTP Status Codes for Beginners
All valid HTTP 1.1 Status Codes simply explained.
DTDs for Beginners
DTDs, Document Type Definitions, are rarely used by web designers, but they are absolutely essential in HTML code.
Accesskeys for Beginners
Accesskeys enable a user to navigate a site using keyboard shortcuts, improving both the usability and accessibility of your site.
META Tags
META tags are rarely used well, but can be a boost to your search engine placement. This guide explains which tags to use and how to use them effectively.
Blog and Lab
Hex Codes for Crayola Crayon Colors

Hex Codes for Crayola Crayon Colors (posted from ZooTool).
04 February 2011 | 2 comments | color, colour, design, art, colors, crayons, hesse, hex, html, list
"Select All" JavaScript for Forms Posting to an Array
The problem that led to this snippet of code was that when posting from a form to a PHP script, you may sometimes want to have several fields with the same name and different values. For example, you might want people to be able to tick boxes to indicate which cities they have been to from a list. You would normally add "[]" to the name of the field inputs, like so:
<input type="checkbox" name="cities[]" value="London"> London
<input type="checkbox" name="cities[]" value="Paris"> Paris
<input type="checkbox" name="cities[]" value="Berlin"> Berlin
<input type="checkbox" name="cities[]" value="Madrid"> Madrid
<input type="checkbox" name="cities[]" value="Rome"> Rome
When the form is received by PHP, whichever items are ticked in the cities list above are accessible in the array $_POST['cities']. This is very handy.
Unfortunately, the addition of square brackets causes trouble with JavaScript, especially with a "Select All" function - which allows you to check all boxes at once by clicking a single one. This script works around that using regular expressions.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Checkbox Fun</title>
<script type="text/javascript"><!--
var formblock;
var forminputs;
function prepare() {
formblock= document.getElementById('form_id');
forminputs = formblock.getElementsByTagName('input');
}
function select_all(name, value) {
for (i = 0; i < forminputs.length; i++) {
// regex here to check name attribute
var regex = new RegExp(name, "i");
if (regex.test(forminputs[i].getAttribute('name'))) {
if (value == '1') {
forminputs[i].checked = true;
} else {
forminputs[i].checked = false;
}
}
}
}
if (window.addEventListener) {
window.addEventListener("load", prepare, false);
} else if (window.attachEvent) {
window.attachEvent("onload", prepare)
} else if (document.getElementById) {
window.onload = prepare;
}
//--></script>
</head>
<body>
<form id="form_id" name="myform" method="get" action="search.php">
<a href="#" onClick="select_all('area', '1');">Check All Fruit</a> | <a href="#" onClick="select_all('area', '0');">Uncheck All
Fruit</a><br><br>
<input type="checkbox" name="area[]" value="1" />Apples<br />
<input type="checkbox" name="area[]" value="2" />Bananas<br />
<input type="checkbox" name="area[]" value="3" />Chickens<br />
<input type="checkbox" name="area[]" value="4" />Stoats
<br><br><a href="#" onClick="select_all('location', '1');">Check All Locations</a> | <a href="#" onClick="select_all('location',
'0');">Uncheck All Locations</a><br><br>
<input type="checkbox" name="location[]" value="1" />Brighton<br />
<input type="checkbox" name="location[]" value="2" />Hove<br />
</form>
</body>
</html>
28 July 2005 | 54 comments | select, html, php, array, forms, javascript, checkboxes, form, all
On-The-Fly Validation
A tool to help automatically fix most common (X)HTML errors before outputting a page to the user.
Click here to read this post »
01 July 2004 | 12 comments | regexp, xhtml, html, php, validation
Faux Columns for Liquid Layouts
Using CSS for layouts can be a problem when using backgrounds for two columns that are not of equal length. This article expands on the solution to this problem from AListApart.
Click here to read this post »
22 June 2004 | 30 comments | tutorial, html, fluid, layout, reference, liquid, design, web, faux, webdesign, css, hacks
US States Select Box
A populated select list (input box) with the states of the USA as options.
Click here to read this post »
14 February 2004 | 26 comments | select, webdev, development, html, reference, resource, design, forms, webdesign, states, resources
Countries Select Box
A populated select list (input box) with the countries of the World as options.
Click here to read this post »
24 October 2003 | 31 comments | list, select, countries, html, resource, design, forms, webdesign, form, resources
