Designing Site IDs
This exercise uses several techniques to create a graphical site id. Any of these is an appropriate way to create a site id. The method you choose depends on what you want your site id to look like and whether you have a hover style in the image.
1: Site ID Fonts
You will style this using a background image in the anchor tag, and also styling the text using a google font. The video on Canvas is not accurate because I just changed the design, but the instructions on the exercise page itself will tell you how to do it, and we'll do it in class as well, so watch the recording.
This design has a hover style for the text, so be sure you create a hover style! There is also a hover graphic.
2: Site ID Image Replacement (FIR)
You will style this using image replacement in the anchor tag. You'll need to add some markup to the anchor tag for image replacement to work (suppress the display of the site id text in the page). Watch the video and read PDF lecture notes for more details on how Image Replacement works.
This design has a hover for the image, so be sure you create a hover style!
3: Site ID Linked Image
You will create this using a linked image. Your image is in place of text in the h1. The image tag goes inside the h1 and the alt text for the image is the exact text of your site id (you'll see it in the document outliner). Watch the video for details and more refined styles.
This style does not have any hover at all, because you cannot create hovers with images in the page unless you use scripting (which we will not be doing).
As always, be sure your pages validate (html and css)