HTML and CSS Reference
1.14 Adding Links to Block-Level Content
You want to wrap your site logo and main heading with a single hyperlink.
Contain both the logo image and the heading with the a element:
<h1>HTML5, for Fun & Profit</h1>
<img src="logo.png" alt="HTML5 for Fun and Profit" />
Previous versions of HTML restricted a to inline content. So, if you had different
elements that all needed to be linked to the same resource, you had to individually
specify the a for each:
<h1><a href="http://html5funprofit.com">HTML5, for Fun & Profit</a></h1>
<a href="http://html5funprofit.com"><img src="logo.png" alt="HTML5 for Fun and
Now, with HTML5, a elements can contain block-level elements. You can also still use
a as in the past, for containing inline content. The only thing you can't nest inside an
a is another a .
Wrapping links around block-level elements is justification enough for
using the HTML5 DOCTYPE.
HTML5 Doctor's article “'Block-level' links in HTML5” at http://html5doctor.com/
1.15 Marking Up Figures and Captions
You want to include an illustration with a caption on your web page.