NHS Designs


Web Design

Chapter C Project Builder 1:
Working with Text and Graphics

Use the image below as a guide to continue your work on the Rapids Transit Web site that you began in Project Builder 1 in Chapter A. You are now ready to begin work on the guides page that explains the role of the guides in accompanying clients on float trips. You want to include a picture of one of the guides on the river and attractively format the text on the page.

  1. Open the Rapids Transit Web site.
  2. Open dwc_4.htm from the chapter_c Data Files folder and save it in the rapids root folder as guides.htm, overwriting the existing guides.htm file and update all links.
  3. Verify that the path for the banner is correctly set to the assets folder of the Rapids Transit Web site.
  4. Insert buster_tricks.jpg from the assets folder located in the chapter_c Data Files folder in an appropriate place on the page, copy the file to the assets folder, then add appropriate alternate text.
  5. Add a border to the image, then choose an alignment setting for the image.
  6. Add horizontal spacing of 5 to the buster_tricks image.
  7. Create a new CSS Style called .bodytext, making sure that the Class and New Style Sheet File option buttons are checked in the New Style dialog box.
  8. Save the style sheet file as rapids in the Rapids Transit Web site root folder.
  9. Choose a font, size, style, color, and weight of your choice for the bodytext style.
  10. Apply the bodytext style to the body text on the guides page.
  11. Verify that the Accessibility Preference option is turned on, then add alternate text for any images in the Web site that do not yet have alternate text.
  12. Save your work, then preview the page in your browser.
  13. Close your browser, then close all open pages.


resources · copyright information · Natomas High School Design Department