Web developers are charged with producing Web sites which continue to attract users who are becoming rapidly more demanding and sophisticated. Consequently, sites are including dynamic content which is more flexible, functional and complex than the traditional static HTML content. The use of dynamic content allows for interactivity with the user.

There are numerous technologies available to create both static and dynamic content. This module considers the main Internet development technologies. They are divided into static systems such as HTML and XML and dynamic systems including JavaScript, Cascading Style Sheets, DHTML, VBScript and server programming interfaces.

Text Authoring Tools

Any text editor can be used to create HTML documents; for example, Edit, Notepad, WordPad, Vi, Emacs or Joe. Some specific HTML editors are able to color the tags to aid the author.

WYSIWYG Authoring Tools

What You See Is What You Get (WYSIWYG) authoring tools provide graphical user interfaces to simplify the creation of HTML documents. They are renowned for producing complex and excessive code (overtagging). Tools such as this are excellent for beginners and provide experienced users with a good basis for creating HTML documents.

However, there are drawbacks to these tools; sometimes, software releases lag behind the latest HTML specification, while in other cases the authoring tools anticipate HTML commands before standards have been set. WYSIWIG tools are more expensive than text authoring tools.

Examples include:

• Dreamweaver by Macromedia - this produces clean HTML and is becoming industry-standard
• FrontPage by Microsoft - a popular development tool. It can use MS-specific tags, provides an HTML editor and also web site administration
• FrontPage Express - the HTML editor extracted from FrontPage. This is supplied free with the IE4 suite of software
• PageMill by Adobe
• Composer by Netscape - part of the Communicator package (free) and similar to FrontPage Express
• Fusion by Net Objects

Extensible Markup Language (XML)

XML is the universal language for data formatting on the web. The current specification is version 1.0. XML is a subset of the Standard General Markup Language (SGML). This is an international standard for describing the structuring and content of electronic documents. The complexity and file sizes of SGML make it unsuitable for web applications.

The design of HTML is also loosely based on SGML. Consequently XML and HTML are closely related, and authors are expected to use both XML and HTML in documents for data and page formatting respectively.

The limited capabilities of HTML mean that many data types cannot be presented in a consistent and sophisticated manner, while XML can be customized by developers for any particular task.

For example:

• financial data
• scientific data
• legal information

A Document Type Definition (DTD) is a reference file used to define tags and associated parameters. The DTD is used by applications to ensure that tags are interpreted in a consistent way. XML using a DTD file is known as valid XML. Authors do not have to provide a DTD file; they can instead use well-formed XML, which must conform to the standard.

An example of XML in use is:

CML (Chemical Markup Language): for managing and presenting networked molecular and technical information.

VRML

This stands for Virtual Reality Modelling Language. The language is used to create three dimensional objects with different colors and textures which can be placed in a virtual reality space through which the user can move.

Like HTML, the VRML language is interpreted by the browser. The current specification is VRML 2.0 which supports Java and JavaScript as well as sound and animation.

Graphics and File Formats

One difficult aspect of web design is finding a balance between striking content, and acceptable download times. Web browsers typically handle two formats for graphics (GIF and JPEG), and another format (PNG) has also been introduced more recently.

File compression is important because it must achieve maximum quality and minimum file size. Different compression techniques work best on certain image types. For example:

• GIFs should be used for images with flat colors and sharp lines of contrast, such as corporate logos, cartoons and icons
• JPEGs should be used for images with smooth color, shading or tonal transitions like photographs and paintings

Graphic Interchange Format (GIF)

GIF was the first graphic format to be displayed by browsers and universally supported. It was originally developed by CompuServe. The current version of GIF is GIF89a. It uses indexed color, LZW compression, it can be interlaced and it supports transparency and animation.

GIFs provide a maximum of 8-bit (256color) information. The colors used in the image (the palette) are defined in a color table.

Other features of GIF files include:

• Lepel-Zev-Welch (LZW) compression which uses repeated data. This is most efficient when the same color is repeated (for example, flat color)
• interlacing - the image is displayed in four passes. This is useful for slow connections with a coarse version being displayed initially. The image becomes more defined with each pass. Interlacing requires a slightly larger file size
• transparency - this enables the background color to show through the image. The entry in the color table is designated as ‘transparent’ (uses background color). Web designers can use a pointer to indicate the color to be made transparent

Images use their own color table unless the designer stipulates the use of the Web palette. This is a standard palette built into the browser (designers often use this palette to ensure display uniformity).

Joint Photographic Expert Group (JPEG)

This format is supported by all but the oldest browsers and provides a maximum of 24 bit color (~16.8million colors, aka ‘true color’). It can also handle grayscale images. When no color palette is specified it uses the Web palette.

JPEG files allow you to control degree of compression using a number between 1 and 100 (100 represents the least compression and therefore the largest file). JPEG files are progressive; a designer can specify the number of passes to use when displaying the image (like GIF interlacing).

Portable Network Format (PNG)

PNG is an open standard. It was developed in 1995 under the threat of Unisys enforcing its LZW patent (requiring a license fee from GIF application developers). Adoption of the standard has been restricted because there is currently limited browser support. However, it is generally supported from version 4 browsers onwards.

PNG has an impressive specification which includes:

• 48 bit color
• a compression system (up to 25% better than GIFs), but still larger than JPEGs
• any type of image
• interlacing using 7 passes
• transparency - support for 8-bit transparency which allows multiple colors to be configured

Other File Formats