I'd argue that <main> should be used to contain all of the content that is unique to that specific page. So having your <h1> outside of the main element seems a little odd, right? You're effectively saying "Here's what this page is about" then a little later saying "And here is everything that this page is about." What about turning this:
<body>
<h1>Computer & Technology Books</h1>
<p>Browse a wide selection of <a href="#">Programming guides</a>, <a href="#">Anderoid resources</a>, and <a href="#">Java books</a></p>
<h2>Shop by category</h2>
<main>
<div>
<img src="http://placekitten.com/200/300"/>
<p><a href="#">Programming</a></p>
</div>Into something like this:
<body>
<main>
<h1>Computer & Technology Books</h1>
<p>Browse a wide selection of <a href="#">Programming guides</a>, <a href="#">Anderoid re/sources</a>, and <a href="#">Java books</a></p>
<section>
<h2>Shop by category</h2>
<article>
<img src="http://placekitten.com/200/300"/>
<a href="#">Programming</a>
</article>I also replaced your <div> (which doesn't mean anything) with an <article> (which means a fully encapsulated idea) and removed your <p> because you didn't have a paragraph (which means a series of sentences) there.
more-css-practice/amazon/index.html
Line 21 in 5c63032
I'd argue that
<main>should be used to contain all of the content that is unique to that specific page. So having your<h1>outside of the main element seems a little odd, right? You're effectively saying "Here's what this page is about" then a little later saying "And here is everything that this page is about." What about turning this:Into something like this:
I also replaced your
<div>(which doesn't mean anything) with an<article>(which means a fully encapsulated idea) and removed your<p>because you didn't have a paragraph (which means a series of sentences) there.