Product Overview

The Principles of Beautiful Web Design

Corrections & Typos

Found a mistake that’s not listed here? Contact us to let us know!

Fourth printing: March 2007

Some of the errors listed here may also apply to previous editions (see below).

• p.22, first paragraph
  

  The wording of the second sentence implies that the blockquote element should be used to achieve a purely presentational effect. The element should be used when it makes semantic sense to do so, and styled using CSS.

• p.29, first paragraph
  

  Dan's last name is spelled Cederholm, not Cedarholm. Sorry, Dan!

• p.81, second paragraph
  

  The keywords for the vertical position should be top, center or bottom, not top, center or right.

• p.81, Note
  

  The note at the bottom of the page reports that Firefox and Opera do not allow you to mix keywords, percentages and measurements for the background-position property. Since the first print, these browsers now support the W3C standard and correctly allow one to mix units.

  Also, the values in the example at the bottom of the note should be reversed. The declaration should therefore read:

  background-position: center 100px;

• pp.95-97
  

  In the following images, it is difficult to discern the patterns in the background on the printed page. They are reproduced here, where it is clearer to see the pattern:
  

  • Figure 3.40: Final body background graphic with pinwheel tile pattern and drop shadow for content container
    

  • Figure 3.41: Zoomed-in image of the header area of the layout, showing the scan lines and highlight
    

  • Figure 3.43: Zoomed-in image of the form on the right-hand column with a gradient stripe behind the form fields
    

  • Figure 3.44: Florida Country Tile layout after texture is applied
    

• p.105, item 11
  

  The reference to Figure 4.6 should be to Figure 4.5.

• p.106, item 14
  

  The reference to Figure 4.6 should be to Figure 4.5.

• p.124, second paragraph
  

  The paragraph advises that the entity is copy, whereas it is, of course, © as indicated by Table 4.1.

Third printing: February 2007

• No known errors.

Second printing: January 2007

• No known errors.

First Edition: January 2007

• p.81, second paragraph
  

  The examples of background-position have the numerical values in reverse order. The property accepts values as follows:

  background-position: <horizontal> <vertical>

  The second half of the paragraph should therefore read:

  If you wanted to top-align a background image within an element, and center it horizontally, you could specify this using keywords (background-position: center top) or using percentages (background-position: 50% 0%). If we wanted to position the image 300 pixels down from the top edge, and 200 pixels in from the left edge of the element, we could use the declaration background-position: 200px 300px. The effect of both of these possible values is shown in Figure 3.21.

  Figure 3.21: Animal crackers with different background-position settings

  

  background-position: center top or background-position: 50% 0%

  

  background-position: 200px 300px

• p.123, first paragraph
  

  The text advises using font-size: 10px on the body element to ensure uniform scaling. A better value is in fact to set the font-size to 62.5%.

  body {
    font-size: 62.5%;
  }