Working together for standards The Web Standards Project

Adding Multimedia in Web Documents (part 1)

Web browsers and devices that access the Web have evolved
greatly over the years. Items for document inclusion have reached far
beyond text and images to a variety of objects, including rich media file
types such as sound, videos and animation. Often,
developers and designers pose questions about the correct way
to include a variety of such items in their standards-conformant documents.
At the same time, many may wonder how well these formats are supported across
browsers and their versions.

In this two-part issue, we ask the W3C to give us some insight into the inclusion of multimedia into our familiar (X)HTML documents.

WaSP Asks

How do we insert multimedia objects into Web documents in a
backwards-compatible way?

The W3C responds

We decided to address this issue in a two-part article:

  1. The history of the birth of multimedia in HTML: the
    img tag, limitations, and a brief introduction of the
    object tag
  2. What object is, examples
    of how it can be used, test cases and user agent support

Introduction

Using multimedia objects in Web documents comes with a wide variety
of techniques depending on the technology and the types of
objects we are addressing. A Web document can be written in SVG, SMIL,
XHTML, MathML, CSS, and so forth. In Part 1, we will discuss the birth of the img element and explain its limitations, as well as introduce the object element. In the second part of this article, we will give usage examples of the object element and provide an overview on the state of implementation across various user agents.

History: Birth of Multimedia in HTML

Reading mailing-lists archives often helps to provide context for
the creation of a feature in a technology. There is always a tradeoff
between making the technology more universal (but often more complex)
and building it fast (but often limited and incomplete). Jeffrey Veen
gives an historic perspective on the birth of a long-awaited feature of
HTML: the ability to insert images in an HTML document.

In 1993, a debate was exploding on the fledgling HTML
mailing list, and finally a college student named Marc Andreessen added
<img> to his Mosaic browser. People objected, saying it was too
limited. They wanted <include> or <embed>, which would
allow you to add any sort of medium to a Web page with the much-touted
content negotiation used on the client. That was too big a project,
according to Marc, and he need to ship ASAP. Mosaic went with
<img>, and it would be years before including media in a page
using <embed> or <applet> or <object> would surface
again.

Mosaic shipped with <img>, Tim went off to the nascent World
Wide Web Consortium, and Marc left for California to start a little
browser company called Netscape.

The history of HTML – Jeffrey Veen

We can still find the original message sent by Marc Andreessen to
the www-talk mailing-list in 1993:


IMG

Required argument is SRC="url".

This names a bitmap or pixmap file for the browser
to attempt to pull over the network and interpret
as an image, to be embedded in the text at the
point of the tag's occurrence.

An example is:

<IMG SRC="file://foobar.com/foo/bar/blargh.xbm">

(There is no closing tag; this is just a
standalone tag.)


proposed new tag: IMG – Marc
Andreessen

Since then, the img element has been unfortunately used for layouts devoid of meaningful mark-up, such as where images are cut up into slices that are then placed into individual table cells.

The img element

The most common way to insert a graphical element in an HTML
document (from HTML 3.2 to XHTML 1.1) is to use an img
element.

The
IMG element embeds an image in the current document at the location of
the element’s definition. The IMG element has no content; it is usually
replaced inline by the image designated by the src attribute, the
exception being for left or right-aligned images that are “floated” out
of line.

The
HTML specifications do not define any requirements for the format which
have to be supported, but commonly supported formats are: GIF, JPEG,
PNG, TIFF and Bitmap — you can insert different images of various formats in any document. The list of formats supported by browsers have gradually evolved over time.

Markup examples
 <p><img src="http://example.org/bzcam.png" alt="Image de
l'étoile variable cataclysmique BZ Cam."/></p>

You will find explorative use of HTML markup to insert images in
documents at the following Web sites:

The need for a generic object inclusion mechanism

The img element does a good job for the inclusion of images, but there are plenty more multimedia objects one may want to embed in a Web document: sound, movies, interactive animations, small programs. Some elements were created as an attempt to broaden the range of objects to include.

First, the applet element was introduced for Java programs, but this only solved the issue for yet another type of object, thus it was eventually deprecated. Later, the embed element was a first proprietary attempt at creating a generic inclusion mechanism, but it was never formally included in HTML.

HTML 4.01 finally came with a standardized, generic object inclusion mechanism: the object element.

Introducing the object element

In response, the object element was introduced in HTML 4.01.
It has been created as a generic method to
insert multimedia objects of any kind in a Web
document. This element has a very powerful cascading fallback mechanism: in addition to the primary object to be rendered, an object element can contain another object or alternate text. User-agents can thus cascade through embedded objects in search of one they can render if they do not support the format of the primary object.

How well is object supported?

In the second part on this topic, we will show the use of the
object element and provide a framework to test the level
of support of this element in user agents.

References

Discussion

For clarification and discussion on this topic, please address your
comments and questions to the W3C Web Standards Education list.

To subscribe to the list, send an email to href="mailto:[email protected]">public-evangelist-
[email protected] with “Subject: subscribe”. You can read
archived posts at href="http://lists.w3.org/Archives/Public/public-evangelist/">http://
lists.w3.org/Archives/Public/public-evangelist/.

The Web Standards Project is a grassroots coalition fighting for standards which ensure simple, affordable access to web technologies for all.

All of the entries posted in WaSP Buzz express the opinions of their individual authors. They do not necessarily reflect the plans or positions of the Web Standards Project as a group.

This site is valid XHTML 1.0 Strict, CSS | Get Buzz via RSS or Atom | Colophon | Legal