However, the design in Figure 8-15 isn’t as successful, even though the dancer
is positioned on the lower-left hot spot. Why?
Recall the positioning of the watch in Figures 8-4 and 8-6. One of the rules of
good composition is that you should violate white space, moving a focal
point so that it’s not framed or sunk into its background, but instead pokes
into the surrounding white space. In Figures 8-13 and 8-14, the dancer leaps
out of the background into the white space. That’s the better choice.
Of all these page designs, Figure 8-13 is probably the best. It’s the most bal-
anced because the dancer counteracts the weight of the large headline at the
top of the page. But the final choice is, as always, up to you.
Background image positioning ........................................................
The same concept of hot spots also applies to background images. Most
people would center the background image shown in Figure 8-16, thinking: Why
not? It’s balanced if it’s in the middle, right? True, but always remember that
you want balance combined with interest, and unity combined with variety.
When you center your background on a hot spot, you maintain balance
(hot spots do precisely that) while adding interest to your composition.
In Figure 8-17, the background radiates from the hot spot.
As I’ve often commented in this book, there’s really no substitute for using a
graphics application when designing a Web page. CSS is great for many
things, but you simply cannot make it do everything. The words Deals on
Wheels in Figure 8-18 are not composed of a special metallic font; the 3D
Figure 8-15:
The focal
point is
positioned
in one of the
hot spots,
but the
surrounding
dark area
swallows
the dancer
and frames
her as well.
166 Part III: Adding Artistry: Design and Composition with CSS