There are five elements for embedding objects in HTML. Leaving aside img, iframe, and applet, there are two tags that look plausible for SVG:

The embed syntax was introduced with Netscape Navigator 2, but has never been part of any HTML standard. This is partly because it cannot fit in to XML (or SGML) because its syntax depends on the type of the embedded content. The object tag is much better thought out, and works with all modern browsers (such as Microsoft Internet Explorer 3.0 and later, Mozilla, Netscape Navigator 6.x, Opera, et al.). but sadly can crash Apple’s Safari 1.0 (released 2003), so should not be used web sites designed for a general audience until 2008. According to Netscape’s documentaion, it also works for NN 4.x, but in tests it seems to get confused if there is no embed within it.

Does this mean that, as suggested by the SVG Wiki, one must choose which tag to use according to what browsers will be used? Well, no. The object tag allows us will allow us to embed an embed tag within it, to be rendered if the object tag is not understood:

<object data="foo.svgz" type="image/svg+xml"
    width="400" height="300">
  <embed src="foo.svgz" type="image/svg+xml"
      width="400" height="300"
      pluginspage="http://www.adobe.com/svg/viewer/install/" />
</object>

Netscape Navigator 2.0 and 3.0 will ignore the object tags (because they do not understand them), and instead attempt to render its contents (the embed tag). Newer browsers will render the object element (if they think they know how to), and fall back on the inner tag if they cannot.

Remember that this only applies if you want to support really quite old web browsers—didn’t NN 4 come out in 1996?—and will not work in Safari 1.0.

Well-formed vs. valid (X)HTML

The embed tag can be made well-formed by inserting a space and a slash before the closing >, (as described in Appendix C of the XHTML Recommendation):

<embed ... />

For many applications (and existing web browsers), being well-formed is good enough. It is, however, not valid HTML or XHTML. This is because embed is not included in the DTDs that specify standard HTML 4.

Of course one can supply one’s own DTD and thus change the definition of ‘valid’: either by editing the DTD, or by adding definitions in the internal DTD subset (outlined in the SVGWiki entry cited above).

Neither of these are necessary for current web browsers; they do not validate HTML against its DTD explicitly. In the future, when XHTML validity matters more, the embed tag is probably best consigned to the dustbin of history. we need to settle on a standard XHTML-1 module that defines an embed tag with a reasonable collection of attributes.

On this site...

My readers will have noticed I often use object without anything inside it except a petulant message; I did this because that way my friends will be able to tell whether their browser groks SVG by seeing if an image appears at all... Some time I should change it to use an inner embed—or possibly content in a different format entirely, such as PNG.

Update (14 February 2004). Safari 1.0 crashes when I use SVG embedded with the object tag. For this reason, I have removed object tags from this site; I will reconsider this decision in 2008, when we can assume that the vast majority of Safari users will have upgraded their Macs beyond Mac OS X 10.2 (you cannot get Safari 1.1 or 1.2 for 10.2). In the meantime, the embed tag works fine in Safari, and in all other browsers.

Article Archive by Year