Rule 1: Make Fewer HTTP Requests(Chapter 1 of High performance Web Sites)

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

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

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

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