HTML5: Marking-up a list of bloggers.

bloggers.html

<!-- ... content before ... -->

<section>
	
	<header>
		
		<hgroup>
			<h1>Bloggers</h1>
			<h2>Bloggers at site.com</h2>
		</hgroup>
		
	</header>
	
	<!-- Using "Person" microdata: http://rgne.ws/LhlxOn -->
	
	<div itemscope itemtype="http://schema.org/Person">
		
		<a href="#" itemprop="url">
			
			<img src="john-thompson.jpg" alt="John Thompson portrait" itemprop="image">
			<h3><span itemprop="givenName">John</span> <span itemprop="familyName">Thompson</span></h3>
			
		</a>
		
	</div>
	
	<hr>
	
	<div itemscope itemtype="http://schema.org/Person">
		
		<a href="#" itemprop="url">
			
			<img src="tom-paulson.jpg" alt="Tom Paulson portrait" itemprop="image">
			<h3><span itemprop="givenName">Tom</span> <span itemprop="familyName">Paulson</span></h3>
			
		</a>
		
	</div>
	
	<hr>
	
	<div itemscope itemtype="http://schema.org/Person">
		
		<a href="#" itemprop="url">
			
			<img src="paul-johnson.jpg" alt="Paul Johnson portrait" itemprop="image">
			<h3><span itemprop="givenName">Paul</span> <span itemprop="familyName">Johnson</span></h3>
			
		</a>
		
	</div>
	
</section>

<!-- ... content after ... -->