Producing Online Heritage Projects

2. Project Development

2.3 Multimedia Content Treatment

It is important for the project team to review the multimedia choices made during the planning phase of the project, and to decide on the next phases.

Digitizing Content

A basic understanding of file sizes, compression and file types for images, audio and video will help you determine the best online solutions, given your project goals and the needs of your audience(s). Capture Your Collections ²⁴, gives detailed instructions for those interested in learning more about photographing, scanning and cataloguing images of collections.

One option for digitizing images is to do it in-house. If your institution does not have digitizing services, you will need to acquire the necessary hardware and software.

One of the first steps in digitization projects is to decide upon the contents or objects to be digitized. The types of materials selected for digitization will determine the imaging equipment to use.For some items, the use of a digital camera may be more appropriate than a scanner, whereas a scanner may be better suited for capturing other objects. Most two-dimensional objects such as photographs, prints, drawings, etc. can be digitized using a flatbed scanner. A digital camera can capture both two- and three-dimensional objects. Another option is to use a traditional camera to capture images of two and three-dimensional objects on film, and then to digitize the film images or slides with a flatbed or slide scanner.

When shopping for a flatbed scanner, look for a scanner with a cold-cathode light source ²⁵. Most scanners come with "lite" graphics manipulation software. However, the more you pay for a scanner the better the quality of the graphics software included. For example, if you are producing a publication you may need more sophisticated image editing software such as Adobe Photoshop. Complete a requirements assessment for your project and then conduct a comparison assessment of scanners and cameras (digital or traditional) to identify the hardware and software required and to ensure that they also meet your requirements, technical specifications and budget.

For large digitization projects, more than one scanner and software program may be required. Whenever people working in-house use several pieces of technology, it is important to maintain consistency and establish internal standards. For example, images may appear different when viewed on different monitors. Calibration is the process of adjusting your monitor's color-conversion settings to a standard, so that the images displayed on a variety of monitors will look the same. The ideal method is to use monitor-calibration hardware and accompanying software available with CMS (Colour Management Systems).

Expert Advice

Would you like to create 3D images, or a virtual tour of specific rooms in your institution, with QuickTime VR? Since this is not a standard plug-in, and the content can be time-consuming to download, you may want to include this feature as an optional section of your online product.

Assuring Good Design

As stated earlier in this handbook, having a graphic designer on the team who has experience working with online content facilitates the development of a good design. Provide the designer with information about the target audience(s), project goals, navigational plan, Web architecture, and the amount and types of content that are to be included.

Making an impression

Imagine that your product is finished and that you have completed an interactive game or virtual exhibition. Imagine people seeing and using it for the first time, and then describing it to a friend. What words would you like them to use?

playful	innovative	professional
edgy	beautiful	earthy
intellectual	challenging	academic
colourful

If you can communicate the mood or impression that you want to create for a user, your choice of words will assist your designer in the creative process of selecting colours, fonts, graphics and layout for your online content. A good designer needs guidelines but should be left with some freedom to bring creativity to the project.

The graphic designer should provide a couple of mock-ups of the design layout to give an idea of the look and feel of the product. Following discussion and a review of the design options, modifications are made and a final design is agreed upon. Once the modified version is approved, the graphic designer can start building the layered graphic files that become the design template for your online heritage product.

File formats

There are many file formats, depending on the software being used—BMP, TIF, PCX, EPS, PCT (Mac), PNG, PSD, GIF, and JPEG to name a few. GIF and JPEG are the two main graphic file formats used on the Web. Refer to the glossary for more information on file extensions and formats.

Expert Advice

When using video or other large files, you can help users predict the response time by indicating file size next to file name.

GIF, JPEG and the Web

GIF stands for Graphic Interchange Format. GIF was developed specifically for online graphics. It supports a maximum of 256 colours and is best used on images with sharply defined edges and large, flat areas of colour. Text and line-based drawings usually fall into this category. GIF uses compression to make files smaller for rapid transfer over a modem. GIF is a lossless format, meaning that it does not discard information to save space. But converting an image with thousands or more colours to 256 colours is a change that requires the loss of some colours, and will therefore result in decreased image quality. GIFs have basic format characteristics. An image can have more than one of these characteristics, for example, be interlaced and transparent.

• Non-interlaced: you must wait until the entire image loads before you see it.
• Interlaced: the image loads in poor quality, and gets progressively better over time.
• Transparent: you can make any colour within the image transparent.
• Animated: a sequence of still images, much like a traditional cartoon flipbook. When the series of images is played back in sequence an animation effect results.

JPEG (also JPG) stands for Joint Picture Experts Group. This format is usually used for larger graphic elements, such as photographs. JPEG is a lossy compressed format that is common on the Web. When saving in this format you choose a quality setting. The higher the quality, the lower the compression and the larger the file size. JPEG's compressed format is ideal for high colour photographs and is used as the stock format in many of today's digital cameras.

Image file sizes

Working in the electronic environment, file size is always an issue that needs to be considered and managed. For Web and multimedia delivery, the file size of a scanned image is the major issue.

To keep your visitor's interest, it is recommended to keep the total size of your Web page under 50 KB (this is the total of all elements on the page including images and animation). This will ensure your page will load in under 10 seconds with a 56 K modem.

File size factors:

• The physical size of an image (width and height) affects file size.
• The number of colours (typically between 256 to 16.7 million) affects file size.
• Image resolution, measured in dots per inch (dpi), affects file size.
• File format capabilities (e.g., GIF forces a max. of 256 colours; JPEG allows compression) ultimately affect the size.
• Image compression (e.g., JPEG has a number of compression choices) changes file size.

File size advice

• If an image file is still large after optimization, it should be organized into slices. Software such as Adobe Image Lab or Macromedia Fireworks can be used for image optimization.
• Use WIDTH="" and HEIGHT="" in the <IMG> tag to specify the image size. By setting these attributes, you are reserving space for that image to load, and the browser does not have to refresh the screen once the images are loaded. (No text or information will load in that area even if the image never loads.)
• Do not use WIDTH and HEIGHT to resize an image, only to specify its actual size.
• Avoid unnecessary use of icons, graphics and photographs, except for titles. Avoid using images to display words in special fonts; it is better to code font changes into your HTML, using <B>, <I> etc., rather than create images of the words.
• Instead of using large full-size graphics images on your page, insert a thumbnail in the page and link from the thumbnail version to the larger image. Indicate the full image size (in kilobytes and megabytes) and the file format, so the user knows the file size and type before loading the full-size image.
• Re-use images where possible. Once an image has been loaded, it can be loaded quickly each time it is called in the HTML document. Each HTTP request requires additional time for the browser and server to deliver the image, unless the same cached image is reused on the Web page.

Compression

The JPEG file format allows for varying degrees of compression. Be aware that this is lossy compression. This means that once you compress a file with the JPEG format, the information removed to perform the compression can never be reclaimed. For this reason, it is important to save a copy of the original scan in case you need to make changes later.

While monitor resolution (e.g., 640 x 480, 800 x 600) is measured in picture elements (pixels), graphic image resolution is expressed in dots per inch (dpi).

When scanning images for your project, you can scan them at 300 dpi if you intend to archive them or use them for print. However, you should reduce the resolution to 72 dpi for your on-line project. Images are normally displayed at 72 pixels per inch on a computer monitor, using images of greater resolution only increases the file size.

Digitizing audio and video

The quality of your source material is very important. If the quality is poor when you start, it will sound or look worse when compressed and streamed. It is important to work from the highest quality source material available.

Expert Advice

Hearing-impaired users can be supported by the use of video captions and transcripts of audio files. These text alternatives must be in HTML to make the content more accessible to search engines.

Audio

There are two main ways to digitize audio. You can record sound by connecting a microphone directly to your computer through the microphone input. This method can pick up background sound, so check for quality when you play it back. The other recording option is to use a microphone and record onto a cassette recorder or into a digital recorder.

After making a recording on cassette, you digitize the audio by connecting the line output of the recorder to the line input on the sound card of your computer. If your audio is on videotape you can also connect the audio outputs from the VHS or digital tape deck into the line input on the sound card.

Expert Advice

Audio is very useful in teaching users the pronunciation
of words.


To digitize audio, you need audio editing software, which enables you to set recording levels as you digitize and create sound files. You can also use it to enhance the quality of sound files.

Video

When digitizing video, you will usually begin with a videotape source. There are two types: analog and digital. Your video material needs to be captured and transferred from the videotape to the hard drive of your computer. To perform this transfer, you need special hardware and software. The process of capturing, digitizing and editing video files is much more technical than working with audio only. The video files are very large, and there are choices to make regarding the size of the playback window and video quality. These choices include presenting higher quality video, which will mean a larger file size for streaming download, or higher compression, which will ensure smaller files, but poorer quality video when played online. You would do well to contact someone with experience in working with video on the Web.

Expert Advice

When presenting a longer video, break it into segments, with subject headings, so the user can download and play the video content that is of specific interest.

Current and Emerging Web Technologies

To put the current and emerging technology comments in context, please note that this handbook was written in 2002. It is important to keep up with developing Web and Internet technologies, as well as the World Wide Web Consortium's (W3C) recommendations and international accessibility guidelines (see section 2.4, Technical Possibilities, for more information on the W3C).

Ensure that you include links to Web sites that offer free software programs users can download to view your online content. Adobe Acrobat and QuickTime are two examples of such software.

Expert Advice

Experimenting with current Web technologies provides you and your team with an opportunity to learn something new and your Internet audience with a unique experience.

Flash

Flash is a very good way to create fast-loading animation clips, but it is a difficult program for the casual Web designer. Flash is often used as an animated introduction to online content. Flash introductions are interesting the first time, but repeat users often click on the "skip intro" button to get into the content as quickly as possible. That is why a more effective way to use Flash can be to integrate it with the content of a virtual exhibition.

Some sites are all Flash, which prevents a site from being indexed by search engines and makes a site very difficult to register. These sites need a separate HTML site, at additional cost, so that search engines can find them. If you have someone on the team who is experienced with Flash, by all means use it, but use it judiciously.

Flash with QuickTime video

You can add custom playback controls and subtitles to version 4 and above of QuickTime videos using Flash. The Flash Player is built right into the QuickTime player, and you can create interactive QuickTime presentations right in the Flash-authoring environment.

Video can also be incorporated into Flash in all video formats played by QuickTime and Windows Media Player, including MPEG, DV (Digital Video), MOV (QuickTime) and AVI. Flash MX allows you to manipulate, scale, rotate, skew, mask, and animate video objects, and make them interactive using scripting.

Shockwave

Macromedia Shockwave allows you to make movies for the Web. Macromedia Director is the software required to create a Shockwave movie, converted for playback in a Web browser. Users need a plug-in (Macromedia Shockwave 8 Player), which they can download and install free of charge. Director is an expensive software application and has a steep learning curve. Speak with professional developers about your Web plans to determine the most appropriate approach for movies, games and interactivity.

Expert Advice

The Macromedia Shockwave Player and Flash Player are pre-installed on all new PCs and Macintosh computers (January 2002).

Streaming Webcasts

These are used for live events, and require a microphone to capture the presenter's voice and a video camera to capture live images. A specially configured computer is required at the event location to capture all of the media sources (audio, video, PowerPoint slides) and immediately convert them to a streaming format. This computer either acts as a streaming server itself and broadcasts the material over the Web, or it connects over a network to a streaming server for Web distribution.

Expert Advice

When choosing what technology to use in your project, do not be afraid of experimenting with something new. Create an area within the online product in which to use this technology, so you can be innovative without risking the entire project.