Quick Introduction to HTML
Media

Overview

The HTML 5 standard specifies how of a variety of media, including audio and video, can be included in a web page, as well as extensive interactive graphics capabilities. This should greatly relieve the compatability problems that earlier plagued Web environments, and provides a unified interface for the production of application programs that run in a web page.

This replaces the older methods of incuding media into web pages, which relied on the installation of software that is not part of the browser, usually called a plug-in.

Common uses of browser media are:

  1. on-line games
  2. very flashy, interactive, dynamic page content
  3. interactive visualization of graphical data

This page will not teach you how to create such plugin objects (which involves bona fide computer programming). It is intended to familiarize you with some of the concepts and technologies involved, and with the strengths and weaknesses of some of the technologies.

Scalable Vector Graphics

SVG is the long-awaited web standard means of including “vector graphics” into web pages. In vector graphics, the parts of the image are described as objects, e.g. lines, circles, curves, with colors, textures, etc, as opposed to being described pixel-by-pixel as in pixmap images such as GIF, JPEG.

For certain applications, primarily line drawings, vector graphics have huge advantages over pixmaps. For one thing, they can be scaled to any size without losing their sharpness. Also, they can encode some kinds of data much more compactly than a pixmap can.

SVG is coded in plain text, a variety of XML, which in principle can be read and edited by humans.

HTML 5 provides a special tag, <svg>, for direct inclusion of code for SVG graphics. The contents of the tag is the SVG code for the image, followed by some plain text that is rendered in case the browser doesn't recognize the svg tag.