There are pros and cons to both HTML and XHTML.
When creating form fields, you need to give them both a name
attribute and an id
attribute (which should be the same. Then only use the id
for referencing them, using document.getElementById()
. More on ID vs. Name in Form Fields
<label>
is a neat, if underused, tag that lets you indicate that some bit of text should be 'attached to' a particular form element. If the user clicks on the text, the form control is toggled.
Use it like this:
<!-- if somebody clicks on the text 'Enter Your First Name', then the cursor will be put in the 'firstName' text input field --> <label for="firstName">Enter Your First Name:</label> <input type="text" name="firstName" id="firstName">
It's rather popular these days to put a bunch of related images in a single file, and then use positioning to show the appropriate image where you want it. If you do this in a form (say for a 'Save' button), your form won't have a true <input type=“submit”>
button. Instead, you'll have a <div>
(or <a>
link or something) that probably has an onclick
event handler to run your form submission code.
This works great if you click, but falls apart in Firefox and IE6/7 if a user presses enter in the form. Thus always be sure to include a real submit button, either a true <input type=“submit”>
button, or an <input type=“image”>
button with an onclick
handler. That will allow the enter key to work in all browsers. If you want, you can still use the background image positioning technique using an <input type=“image”>
button.
It's a fairly well known fact that you need to encode certain characters, such as ampersand, as an HTML entity. In other words, use &
instead of &
in the phrase Bob & Susan
. What isn't quite as well known is that you must do this everywhere, including in URLs. So the URL:
/foo.php?foo=bar&raz=jaz
is invalid (X)HTML. You must use:
/foo.php?foo=bar&raz=jaz
for your document to validate.