<a href="http://www.dalewoods.com" id="logo_link">
    <img src="images/logo.png" alt="Dale Woods" class="logo"/></a>

img.logo {
margin-top: 20px;

<map name="a">
  <area shape="rect" coords="25,25,75,75" href="http://www.dalewoods.com">
</map>
<img src="images/logo.png" alt="Dale Woods" class="logo" usemap="#a" />

<div id="logo">
  <a href="http://www.dalewoods.com" id="logo_link">Dale Woods</a>
</div>

#logo {
  width:200px;height:200px;position:relative;
  background:url(images/logo.png) no-repeat;overflow:hidden;
}
#logo_link {
  display:block;position:absolute;top:0;left:0;
  width:200px;height:150px;text-indent:-2000px;
}

<img src="example.gif" width="145" height="126" alt="Example" usemap="#Example">

<map name="Example">
  <area shape="rect" coords="0,0,82,126" alt="Firsthalf" href="#">
</map>

<h1><a href="http://www.dalewoods.com">Dale Woods</a></h1>

h1 { background: transparent url(images/logo.png) no-repeat 0 0; height: 40px; width: 40px; }
a { display: block; overflow: hidden; text-indent: -99999px; height: 20px; width: 20px; }

<div class="logo">
  <a href="#"></a>
  <img src="image.png" alt="Logo">
</div>

.logo {
  display: inline-block;
  position: relative;
}

a {
  position: absolute;
  left: 0; top: 0;
  height: 50%; width: 100%;
}

img { display: block; }