1. Section 8.1 Section 8.2 Create a custom theme Design a color scheme
Use shared borders
Section 8.2
Identify types of graphics
Identify and compare graphic formats
Describe compression schemes

2. Section 8.3 Section 8.4 Identify image sources Use graphics ethically
Use clip art
Describe graphic input tools
Create WordArt
Section 8.4
Crop, resize, and resample a graphic
Create a photo gallery
Create a thumbnail

3. Using Custom Themes and Shared Borderspp
Using Custom Themes and Shared Borders
8.1
Guide to Reading
Main Ideas
You can create custom themes that reflect your site’s purpose. Using shared borders allows page components such as banners and link bars to appear on all pages of your site.
Key Terms
external style sheet
embedded style sheet
cascading style sheet
shared border

4. Using Custom Themes and Shared Borderspp
Using Custom Themes and Shared Borders
8.1
Creating a Graphic Foundation
Custom themes and shared borders create a good graphic foundation.
Both of these are features are available in FrontPage to simplify the task.

5. Using Custom Themes and Shared Borderspp
Using Custom Themes and Shared Borders
8.1
Custom Themes
If FrontPage does not include a theme that exactly matches your needs, you can modify an existing theme. You can:
Customize graphics and colors
Specify fonts using one of the following style sheets:
external
embedded
cascading
external style sheet A style sheet containing format and layout settings stored in a separate file. (p. 214)
embedded style sheet A style sheet that contains format and layout settings that only apply to the current Web page. (p. 214)
cascading style sheet A style sheet that consists of code that defines formatting and layout settings for HTML tags. (p. 214)

6. Using Custom Themes and Shared Borderspp
Using Custom Themes and Shared Borders
8.1
Custom Themes
You can modify a theme’s font in the Customize Theme dialog box.

7. Using Custom Themes and Shared Borderspp
Using Custom Themes and Shared Borders
8.1
Shared Borders
Shared borders are a great way to show relationships between pages.
You can also specify that certain shared borders only appear on certain pages.
shared border An area that remains the same on all (or some) of the pages in a Web site. (p. 215)

8. Using Custom Themes and Shared Borderspp
Using Custom Themes and Shared Borders
8.1
Shared Borders
Check the boxes in the Shared Borders dialog box as shown here.

9. Using Custom Themes and Shared Borderspp
Using Custom Themes and Shared Borders
8.1
Activity 8A – Creating a Custom Theme (p. 213)
Activity 8B – Modifying the Styles Used in a Theme (p. 214)
Activity 8C – Creating Shared Borders (p. 216)
Activity 8D – Inserting a Banner and Link Bar (p. 216)

10. Web Graphics Types and File Formatspp
Web Graphics Types and File Formats
8.2
Guide to Reading
Main Ideas
The two basic types of graphics are raster and vector. The two most common graphic file formats are GIF and JPEG.
Key Terms
raster graphic
paint program
vector graphic
draw program
GIF (Graphic Interchange Format)
JPEG (Joint Photographic Experts Group)
lossless compression
lossy compression

11. Web Graphics Types and File Formatspp
Web Graphics Types and File Formats
8.2
Types of Graphics
There are two basic types of graphics:
Raster graphics, usually made with paint programs.
Vector graphics, usually created with draw programs.
raster graphic A graphic made up of pixels; also known as a bitmapped graphic. (p. 219)
paint program A type of software application that is used to create raster graphics (p. 219)
vector graphic A graphic composed of simple lines defined by mathematical equations. (p. 219)
draw program A type of software application that is used to create vector graphics (p. 219)

12. Web Graphics Types and File Formatspp
Web Graphics Types and File Formats
8.2
Graphic File Formats
There are two basic graphic file formats used in Web design: GIF and JPEG.
Both file formats work well in Web design.
GIF (Graphic Interchange Format) A graphic file format that can save only a maximum of 256 colors. (p. 220)
JPEG (Joint Photographic Experts Group) A graphic file format that can support millions of colors; preferred format for saving photographs. (p. 220)

13. Web Graphics Types and File Formatspp
Web Graphics Types and File Formats
8.2
Compression Schemes and Download Times
Web designers often must have to compress files to speed download times. There are various strategies to speed downloads:
Lossless compression
Lossy compression
Reduced color palette images
Converting image file formats
lossless compression A compression scheme in which a graphic file loses no data when it is compressed. (p. 221)
lossy compression A compression scheme that removes data from a graphic file so that the file is significantly smaller and downloads more quickly in a Web browser than one saved with lossless compression. (p. 221)

14. Web Graphics Types and File Formatspp
Web Graphics Types and File Formats
8.2
Compression Schemes and Download Times
A download time of 56 Kbps means the page will require 11 seconds to download with a 56 Kbps modem.

15. Obtaining and Creating Graphicspp
Obtaining and Creating Graphics
8.3
Guide to Reading
Main Ideas
You can use pre-made graphics, such as clip art, on your Web pages. You can also create original graphics using either input devices or FrontPage toolbars. Always check the terms of use before downloading pre-made graphics.
Key Terms
scanner
dots per inch (dpi)
digital camera
inline graphic
WordArt

16. Obtaining and Creating Graphicspp
Obtaining and Creating Graphics
8.3
Obtaining Pre-Made Graphics
Pre-made graphics can be found on the Web or in image collections from software packages.
Unless you have specific permission to use an image, doing so can violate copyright laws.
You can use clip art collections found on your computer as well.

17. Obtaining and Creating Graphicspp
Obtaining and Creating Graphics
8.3
Creating Graphics Using Input Devices
Scanners and digital cameras are both input devices to create graphics.
Scanners define resolution in dots per square inch. For Web use, a 600 dpi scanner is sufficient.
scanner A hardware device that converts a printed image into a digital format that can be used on a Web page. (p. 225)
digital camera A photographic device that saves images in a digital format so they can be easily used on the Web. (p. 225)
dots per inch (dpi) A definition of resolution that states the number of pixels created for every linear inch of an image, such as 600 dpi. (p. 225)

18. Obtaining and Creating Graphicspp
Obtaining and Creating Graphics
8.3
Creating Graphics Using Input Devices
When you insert a picture file into a Web page, the picture is referred to in the HTML code. The browser must request the graphic file, called an inline graphic, and insert it into the page.
inline graphic Created by storing a graphic in an electronic format on a hard drive and inserting the graphic into a Web page. (p. 225)

19. Obtaining and Creating Graphicspp
Obtaining and Creating Graphics
8.3
Creating Graphics Using FrontPage
FrontPage provides tools to create simple graphics:
WordArt
Drawing Tool
WordArt Text objects with special formatting applied. (p. 226)

20. Obtaining and Creating Graphicspp
Obtaining and Creating Graphics
8.3
Activity 8E – Adding Clip Art to a Web Page (p. 224)
Activity 8F – Adding WordArt to a Web Page (p. 227)
Activity 8G – Adding a Drawing to a Web Page (p. 228)

21. Editing and Formatting Graphicspp
Editing and Formatting Graphics
8.4
Guide to Reading
Main Ideas
You can use the Pictures toolbar to modify images in FrontPage. A photo gallery is a collection of images. Thumbnails are small images that link to full-size versions of the same image.
Key Terms
resizing
aspect ratio
resampling
cropping
photo gallery
thumbnail

22. Editing and Formatting Graphicspp
Editing and Formatting Graphics
8.4
Modifying Graphics
To make major changes to a graphic, use a graphic or drawing application.
FrontPage can be used to make minor modifications, such as resizing images, without changing the aspect ratio, resampling, or cropping.
resizing Changing the size of the image as it appears on the screen without changing the file size of the graphic. (p. 233)
aspect ratio The relationship between an image’s height and width. (p. 233)
resampling Changing the number of pixels in a graphic file to match the new screen area occupied by the image; this changes the size of the graphic file. (p. 233)
cropping To remove portions of an image that you do not want to use. (p. 233)

23. Editing and Formatting Graphicspp
Editing and Formatting Graphics
8.4
Modifying Graphics
The tools on the Pictures toolbar allow you to manipulate pictures.
Contrast and Brightness Buttons
Resample
Select
Rotate and Flip Buttons
Restore
Crop

24. Editing and Formatting Graphicspp
Editing and Formatting Graphics
8.4
Creating a Photo Gallery with Thumbnails
FrontPage makes it easy to create a photo gallery with thumbnails of each image.
photo gallery A collection of photographs with brief descriptions. (p. 235)
thumbnail A small image that links to a larger version of the same image; lets users decide if they want to view the larger image, which takes longer to download. (p. 235)

25. Editing and Formatting Graphicspp
Editing and Formatting Graphics
8.4
Activity 8H – Manipulating an Image with the Pictures Toolbar (p. 232)
Activity 8I – Cropping, Resizing, and Resampling a Picture (p. 234)
Activity 8J – Creating a Photo Gallery in FrontPage (p. 235)

26. Chapter 8
Resources
For more resources on this chapter, go to the Introduction to Web Design Web site at webdesign.glencoe.com.