I'm writing a Twitter application that will display the following three (3) things about a Twitter user:
- GET statuses/user_timeline
- GET friends/ids
- GET followers/ids
My question is, is it symantically correct to put the above-mentioned three (3) things inside one (1) <article> tag and separate them using three(3) <section> tags? (See Option 1 below)
Or is it symantically correct to just use three (3) <article> tags (one for each item above)? (See option 2 below)
Option 1:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Twitter App</title>  
</head>
<body>
    <article>
        <section>
            <h2>User's Timeline<h2>     
            <!-- Displays GET statuses/user_timeline here -->
        </section>      
        <section>
            <h2>User's Friends<h2>      
            <!-- Displays GET friends/ids here -->
        <section>   
        <section>
            <h2>User's Followers<h2>        
            <!-- Displays GET followers/ids -->
        </section>
    </article>
</body>
</html>
Option 2:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Twitter App</title>  
</head>
<body>
    <article>
        <header>
            <h2>User's Timeline<h2>
        </header>
            <!-- Displays GET statuses/user_timeline here -->
        <footer></footer>
    </article>
    <article>
        <header>
            <h2>User's Friends<h2>
        </header>
            <!-- Displays GET friends/ids here -->
        <footer></footer>
    </article>
    <article>
        <header>
            <h2>User's Followers<h2>
        </header>
            <!-- Displays GET followers/ids -->
        <footer></footer>
    </article>
</body>
</html>
 
     
     
    