HTML attributes without quotation marks?

Question

I've always thought html requires quotation marks in his properties:

<div class="service_definition"> or <div class='service_definition'>

But recently i noticed that the w3 validator doesn't recognize the following as an error:

<div class=service_definition>

So is it all right if i omit the quotation marks? Or are there any restrictions?

Answer 1

Always use quotation marks.

I don't believe that HTML properties without quotation marks are classed as Invalid HTML, but they will potentially cause you problems later on down the line.

By default, SGML requires that all attribute values be delimited using either double quotation marks (ASCII decimal 34) or single quotation marks (ASCII decimal 39). Single quote marks can be included within the attribute value when the value is delimited by double quote marks, and vice versa. Authors may also use numeric character references to represent double quotes (") and single quotes ('). For double quotes authors can also use the character entity reference ".

In certain cases, authors may specify the value of an attribute without any quotation marks. The attribute value may only contain letters (a-z and A-Z), digits (0-9), hyphens (ASCII decimal 45), periods (ASCII decimal 46), underscores (ASCII decimal 95), and colons (ASCII decimal 58). We recommend using quotation marks even when it is possible to eliminate them.

Source: http://www.w3.org/TR/REC-html40/intro/sgmltut.html#h-3.2.2

---

I think they're a great way of clearly defining when an attribute value starts and finishes.

Take for example the class attribute which can have multiple classes seperated by spaces:

<div class="classa classb" id="123">

This clearly shows the browser that my classes are classa and classb, with an element id of 123.

Take away the quotation marks and we've got:

<div class=classa classb id=123>

A browser could now interpret this as 3 classes, with no id. classa, classb and id=123.

Or it may even interpret it as 3 attributes. class="classa", classb="" and id="123"

(Even stackoverflow's syntax styling is struggling with this one!)

Answer 2

You can omit the quotes from an attribute value if the value consists of the following characters only (cf to the technical concept of name):

letters of the English alphabet (A to Z, a to z)
digits (0 to 9)
periods .
hyphens -

Thus, WIDTH=80 and ALIGN=CENTER are legal shorthands for WIDTH="80" and ALIGN="CENTER". A reference to a URL like HREF=foo.html is acceptable, but in general URLs must be quoted when used in attributes, e.g. HREF="http://www.hut.fi/". - Some browsers are more permissive. Some browsers may even accept elements with a starting quote but without any closing quote. Such use is very bad practise.

refer http://www.cs.tut.fi/~jkorpela/HTML3.2/3.4.html

Answer 3

Sometimes you can use HTML properties without quotation marks.

I recently created a text document in SharePoint that links to a company web application. I was getting an error message when using quotation marks for an href value (website url). Which is technically correct.

I noticed in the DOM, that a set of quotes was being added automatically to the href value by the browser. So I tried entering the href value without quotation marks, this fixed the navigation error.

Answer 4

The rules depend on HTML version.

In all flavors of XHTML, attribute values must always appear in quotes, since XHTML is XML. Validators naturally check this. In browser practice, it's different. In genuine XML mode, a missing quote aborts document interpretation: the content is not shown, only an error message (which may contain an extract of source code) is shown to the user. But when XHTML is served as HTML, which is the normal way (especially due to the XHTML-illiteracy of old versions of IE) browsers treat it by HTML rules.

Otherwise in HTML, the formal rules vary by specification, but browsers accept attribute values without quotation marks. HTML5 drafts reflect this liberal attitude: the quotes are needed only if the value contains a space, a line break, grave (`), equals sign (=), less than sign (<), greater than sign (>), Ascii quote ("), or Ascii apostrophe (').

What you do in practice is large a matter of convention, and it should depend on the opinions of coworkers or others who may work on your code, rather than public opinion. Many people think that the restrictive syntax of XHTML is cool. Others may think that unnecessary quotes mess up the code and have even some risks: whenever you need to use some characters in pairs, there’s always a chance of forgetting the closing component or mistyping it.