ENG 573/679: Writing for the Web

Chapter 8 Textbook Exercises

Due date: Sunday, September 21, 2025 at 11:59 pm

Points value: 10 points

Are you ready for more CSS after your introduction in Chapter 7? Here we go. It's time to dive into common CSS properties, fonts, and color. Get ready to have your mind blown.

Note that this chapter is text-heavy, but everything discussed will come into play. Read carefully.

Instructions for Chapter 8

For this chapter, you'll be using the files you created in Chapter 3. Start by making a copy of your own Chapter 3 files and pasting them into your Chapter 8 folder.

The exercise starts on p. 319 ("Getting Tony a new font-family").

On p. 325 ("How to add a Web Font to your page"), we're going to go a little off the rails because the textbook's provided fonts are finnicky. Instead, we're going to use one of the many, many free options at Google Fonts. Read Steps 1–3, but for Steps 4–6, follow my instructions instead:

Step 4: Import the Web font

Instead of the font-face property, we're going to import a font from Google Fonts called Solway.

Add this line to the top of your "journal.css" file:

This line tells the browser to grab the Solway font family from Google Fonts at the provided URL and use it throughout the web page when called for. (If you visit the URL, you'll see how Google uses import to simplify the font-face property.)

Step 5: Use the font-family name in your CSS

Once you've imported a font from a web source like Google fonts, you can use the font by referencing its name in the font-family property.

Let's change the font of the h1 heading to use the Solway font. To do so, add a rule for h1:

We specify the name of the font like normal, only this time, it's the font we imported from Google. And just in case something goes wrong, we specify sans-serif as a fallback.

Step 6: Load the page!

Save your work and reload "journal.html" to see the changes.

Remember to let me know if you have any questions.