There are five elements for embedding objects in HTML.
Leaving aside img, iframe, and applet,
there are two tags that look plausible for SVG:
-
<embed src="..." />, the old-style plug-in syntax; and -
<object data="..." >...</object>, the HTML 4 syntax.
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
we need to settle on a standard XHTML-1
module that defines an
embed tag is probably best consigned to the
dustbin of history.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.