Anne van Kesteren

Namespaces

When you are comfortable with XHTML and CSS you have probably asked yourself the question: What's next? Extending your document language. This can best be done (in my opinion, there are other ways) using namespaces so that your newly created markup language is unique and easily style-able in browsers that support these standards (actually, styling is still a working draft, but already supported by "major" browsers).

Namespaces in XML is W3C recommendation since January 1999 (five years back) and is supported by some browsers. I know for sure it works in Mozilla (including DOM and CSS support), but I read that Safari supports it as well (at least CSS support) (Opera?).

Creating documents is probably the hardest part, since it has a "strange" syntax. Ever seen this (image):
<root xmlns:xhtml="http://www.w3.org/1999/xhtml">
 <xhtml:h1>This is a header.</xhtml:h1>
</root>

The above example renders as expected using a recent version of Mozilla (1.7, 20040301), in Opera (7.5, 3494) the text gets unreadable small. As you can see we define the namespace in the root element (which is named root as well). We do this using the XMLNS attribute, which stands for XML NameSpace, but you probably knew that. After the colon (':') we specified an abbreviation, in this case: xhtml. The value of the XMLNS attribute is a URI, which doesn't have to point to an actual existing document, it should be unique though. You probably noticed this is the exact same attribute value and same attribute you are using in XHTML documents. The difference is that you don't prefix it in those documents; you apply a default namespace for the entire document instead. Another example:

<html xmlns="http://www.w3.org/1999/xhtml">
 <title>Graphics</title>
 <graphic xmlns="http://example.org/#graphics-ns">
  <name>03-namespaces.png</name>
  <type>image/png</type>
  <size unit="B">3371</size>
  <height unit="px">162</height>
  <width unit="px">412</width>
 </graphic>
</html>

In that document, both the HTML and TITLE element are in the XHTML namespace (http://www.w3.org/1999/xhtml). The GRAPHIC element and all its descendents, attributes and descendents attributes are in the http://example.org/#graphics-ns namespace. As you can see, the XMLNS attribute on the GRAPHIC element "overwrites" the one on the HTML element. I think this notation is easier than the notation of the first example, but you might have a document where you heavily "mix" two or more markup languages.

I really like namespaces and I think they will be heavy used in the future. MathML and SVG have their own namespace for example. XHTML2.0 will have a new namespace, which makes it a lot easier for browser vendors to distinguish between the different versions of XHTML.

Comments

  1. Great post. I've always wandered about namespaces... I guess it must be the two different syntaxes confusing me. Thanks for clearing things up.

    Posted by David house at

  2. David: Why wonder? You know where you could ask to get a thorough explanation of the concept :)

    Posted by liorean at

  3. It's invalid xml : )

    >grahpic< and >/graphic< are tags that don't match.

    XUL and XBL are very much like this - especially XBL, where multiple namespaces are common.

    Posted by Chris Neale at

  4. Gah - < and > exchanged in preview box, but not previewed a 2nd time : ]

    Posted by Chris Neale at