Semantic HTML

<body>

    <header>
        
        <div id="logo">...</div>
        <nav role="navigation">
            <ul>
                <li><a href="/"><span>Home</span></a></li>
                <li><a href="/archives/"><span>Archives</span></a></li>
                <li><a href="/about/"><span>About</span></a></li>
                <li><a href="/contact/"><span>Contact</span></a></li>
            </ul>
        </nav>
        
    </header>
    
    <main role="main">
        
        <h1>...</h1>
        <p>...</p>
      
        <article>
            
            <header>
                <h2>...</h2>
                <p>...</p>
            </header>
            
            <p>...</p>
            
            <section>
                
                <h3>Comments</h3>
                
                <article>
                    <header>
                        <h3>...</h3>
                        <p>...</p>
                    </header>
                    <p>...</p>
                </article>
                
            </section>
            
        </article>
        
        ...
        
    </main>
    
</body>
</html>
 

More Resources