<header>
<nav>
</nav>
</header>
Tu chyba czegoś brakuje.
<body style="background-color:lightblue">
Unikaj takiego stylowania. Od tego są klasy i CSS.
<section>
<p><small>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</small></p>
</section>
Jako "wypełniacze" tekstu możesz użyć np lorem ipsum.
<a href="obrazek.jpg" alt="nie ma takiego obrazu"><img src="obrazek.jpg" width="100" alt="nie ma takiego obrazu"/></a>
Używaj atrybutu aria-label przy takich konstrukcjach.
<a><small>(Kliknij w obraz aby powiększyć)<small></a>
Tu brakuje atrybutu href.
<br>
<br>
Unikaj takich konstrukcji. Odstępy twórz w css np za pomocą margin-bottom.