The rules described in later chapters also present guidelines that help reduce the number of

HTTP requests, but they focus primarily on subsequent page views.

Image Maps

<img usemap="#map1" border=0 src="/images/imagemap.gif">

<map name="map1">

<area shape="rect" coords="0,0,31,31" href="home.html" title="Home">

<area shape="rect" coords="36,0,66,31" href="gifts.html" title="Gifts">

<area shape="rect" coords="71,0,101,31" href="cart.html" title="Cart">

<area shape="rect" coords="106,0,136,31" href="settings.html" title="Settings">

<area shape="rect" coords="141,0,171,31" href="help.html" title="Help">

</map>

CSS Sprites

 1 <style>

 2 #navbar span {

 3 width:31px;

 4 height:31px;

 5 display:inline;

 6 float:left;

 7 background-image:url(/images/spritebg.gif);

 8 }

 9 .home {

 background-position:0 0; margin-right:4px; margin-left: 4px;}

10 .gifts {

 background-position:-32px 0; margin-right:4px;}

11 .cart {

 background-position:-64px 0; margin-right:4px;}

12 .settings {

 background-position:-96px 0; margin-right:4px;}

13 .help {

 background-position:-128px 0; margin-right:0px;}

14 </style>

Inline Images

1 <IMG ALT="Red Star"

2 SRC="data:image/gif;base64,R0lGODlhDAAMALMLAPN8ffBiYvWW

3 lvrKy/FvcPewsO9VVfajo+w6O/zl5estLv/8/AAAAAAAAAAAAAAAACH5BAEA

4 AAsALAAAAAAMAAwAAAQzcElZyryTEHyTUgknHd9xGV+qKsYirKkwDYiKDBia

5 tt2H1KBLQRFIJAIKywRgmhwAIlEEADs=">

Combined Scripts and Stylesheets