Creating valid names with the id attribute
When using the
id attribute to create a unique name for an element in an HTML document, there is a simple rule that defines which characters you may use for that name.
From Basic HTML data types:
ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens (“-“), underscores (“_”), colons (“:”), and periods (“.”).
It’s a simple rule, but judging by how often I see
id values that are invalid, for instance by beginning with a digit, this does not seem to be common knowledge.
My personal preference is to use only lower case letters ([a-z]), digits ([0-9]), and hyphens (“-“). It looks cleaner and avoids the great confusion that using colons (“:”) and periods (“.”) could lead to in combination with CSS selectors that also use those characters.
This post is a Quick Tip. Background info is available in Quick Tips for web developers and web designers.