HTML and CSS

Adding Images, Media, and Scripts

Images, media, and scripting help a site become "dynamic and rich." This is called dynamic because many of these features offer the opportunity for the site visitor to interact in an active way with the site. It's rich because the site becomes richer visually and in terms of content.

Images in this tutorial refers specifically to images you'll be adding to your page as part of the design itself or as a means of enhancing the content, such as with photos. Images must be processed in a specific way for the Web, using a good image editor; you can quickly learn the details.

Note: Web graphics can be created by a wide range of programs, but typically you're going to want to have a decent image editor, such as Photoshop (if your wallet is a little smaller, you can try Jasc's Paint Shop Pro). There are numerous other web graphic programs; you can find them by searching for "web graphics software" at your favorite search engine.

Two primary types of web graphic formats exist: GIF and JPEG. The GIF file format is best for images with few, flat colors and line drawings; JPEGs are best for images with many colors and color gradients, such as photos. A third type of web graphic format is PNG, but the lack of support for PNG in some browsers makes it a less stable choice.

Multimedia on the Web can refer to a number of things, including animated GIFs, Flash animations, audio, video, and Java applets. Scripts in this tutorial refers to JavaScript and DHTML effects that you can add to your documents, creating a richer user experience.

Note: Although images, media, and scripting can bring more options to your site, they also can add unnecessary clutter and download time. I like to think of most content of this nature to be decorative. Just as you wouldn't want to over-decorate a house, think about how less can be more when it comes to your page.