Sams Teach Yourself HTML 4 in 24 Hours
- Table of Contents
- Copyright
- About the Author
- Acknowledgments
- Tell Us What You Think!
- Put Your HTML Page Online Today
- I. Your First Web Page
- Hour 1. Understanding HTML and XML
- Hour 2. Create a Web Page Right Now
- Hour 3. Linking to Other Web Pages
- Hour 4. Publishing Your HTML Pages
- II. Web Page Text
- Hour 5. Text Alignment and Lists
- Hour 6. Text Formatting and Font Control
- Hour 7. Email Links and Links Within a Page
- Hour 8. Creating HTML Forms
- III. Web Page Graphics
- Hour 9. Creating Your Own Web Page Graphics
- Hour 10. Putting Graphics on a Web Page
- Hour 11. Custom Backgrounds and Colors
- Hour 12. Creating Animated Graphics
- IV. Web Page Design
- Hour 13. Page Design and Layout
- Hour 14. Graphical Links and Imagemaps
- Hour 15. Advanced Layout with Tables
- Hour 16. Using Style Sheets
- V. Dynamic Web Pages
- Hour 17. Embedding Multimedia in Web Pages
- Hour 18. Interactive Pages with Applets and ActiveX
- Hour 19. Web Page Scripting for Non-Programmers
- Hour 20. Setting Pages in Motion with Dynamic HTML
- VI. Building a Web Site
- Hour 21. Multipage Layout with Frames
- Hour 22. Organizing and Managing a Web Site
- Hour 23. Helping People Find Your Web Pages
- Hour 24. Planning for the Future of HTML
- VII. Appendixes
- A. Readers' Most Frequently Asked Questions
- B. HTML Learning Resources on the Internet
- C. Complete HTML 4 Quick Reference
- D. HTML Character Entities
Graphics Basics
Two forces are always at odds when you post graphics and multimedia on the Internet. Your eyes and ears want everything to be as detailed and accurate as possible, but your clock and wallet want files to be as small as possible. Intricate, colorful graphics mean big file sizes, which can take a long time to transfer even over a fast connection.
How do you maximize the quality of your presentation while minimizing file size? To make these choices, you need to understand how color and resolution work together to create a subjective sense of quality.
The resolution of an image is the number of individual dots, or pixels (the individual dots that make up a digital image), that make up an image. Large, high-resolution images generally take longer to transfer and display than small, low-resolution images. Resolution is usually written as the width times the height; a 300x200 image, for example, is 300 dots wide and 200 dots high.
You might be surprised to find that resolution isn't the most significant factor determining an image file's storage size (and transfer time). This is because images used on Web pages are always stored and transferred in compressed form. Image compression is the mathematical manipulation that images are put through to squeeze out repetitive patterns. The mathematics of image compression is complex, but the basic idea is that repeating patterns or large areas of the same color can be squeezed out when the image is stored on a disk. This makes the image file much smaller and allows it to be transferred faster over the Internet. The Web browser program can then restore the original appearance of the image when the image is displayed.
In the rest of this chapter, you'll learn exactly how to create graphics with big visual impact and small file sizes. The techniques you'll use to accomplish this depend on the contents and purpose of each image. There are as many uses for Web page graphics as there are Web pages, but four types of graphics are by far the most common:
- Photos of people, products, or places
- Graphical banners and logos
- Snazzy-looking buttons or icons to link between pages
- Background textures or wallpaper to go behind pages
The last of these is covered in Hour 11, "Custom Backgrounds and Colors," but you can learn to create the other three kinds of graphics right now.
Preparing Photographic Images | Next Section

Account Sign In
View your cart