HTML relies on open and closing tags <tag> ... </tag> to separate code blocks. Placement of HTML selectors within a pair of tags designates nesting.
In the following example you will see that all the content for this block is nested within the <article> ... </article> tags. The nested <p> ... </p> tags contain the nested <a> ... </a> tags stating that the <a> inline-block element will be inside the <p> block element.
<article>
<h1>primary header title for paragraph below</h1>
<p>
<a href="#">Example of body text link</a>
</p>
</article>
It's interesting to note, that while returns and tabbing in HTML is a good form of writing clean code and does make the code easier to read, it is not necessary for nesting or block separation. The clear advantage here is with HTML minification of course.
It isn't until we begin to append styles, actions and other attributes to the markup, that reading becomes increasingly difficult. Notice in the following example by simply adding a few additional attributes to the HTML that it becomes more difficult to visually parse out the content from the functionality.
<article class="primary-article" id="main-author" data-author-id="999">
<h1>primary header title for paragraph below</h1>
<p>
<a href="#" class="external-link">Example of body text link</a>
</p>
</article>
The worst part is, this is still static HTML. Things only get worse as we begin to add logic and insert dynamic content.