SitePoint Sponsor

User Tag List

Results 1 to 7 of 7

Hybrid View

  1. #1
    SitePoint Addict
    Join Date
    Jun 2005
    Posts
    262
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Marking up a list of articles: Unordered list or definition list

    Which do you think is most appropriate?

    With H2 headers in list items:
    Code:
    <h1>Electronics Articles</h1>
    <ul>
        <li>
            <h2>Article Title 1</h2>
            <p>Posted June 1, 2009</p>
        </li>
        <li>
            <h2>Article Title 2</h2>
            <p>Posted June 1, 2009</p>
        </li>
    </ul>
    No H2 headers in list items:
    Code:
    <h1>Electronics Articles</h1>
    <ul>
        <li>
            Article Title 1
            <span>Posted June 1, 2009</span>
        </li>
        <li>
            Article Title 2
            <span>Posted June 1, 2009</span>
        </li>
    </ul>
    As a defintion list:
    Code:
    <h1>Electronics Articles</h1>
    <dl>
        <dt>Article Title 1</dt>
        <dd>Posted June 1, 2009</dd>
        
        <dt>Article Title 2</dt>
        <dd>Posted June 1, 2009</dd>
    </dl>

  2. #2
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,478
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'd probably go with the definition list.

  3. #3
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2006
    Location
    Augusta, Georgia, United States
    Posts
    4,139
    Mentioned
    16 Post(s)
    Tagged
    3 Thread(s)
    first and last split.

    If the design requires a wrapping element for the term and definition pair you'll probably end with something more like this.

    HTML Code:
    <dl>
        <dt>Article Title 1</dt>
        <dd>Posted June 1, 2009</dd>
    </dl>
    <dl>    
        <dt>Article Title 2</dt>
        <dd>Posted June 1, 2009</dd>
    </dl>
    Which in my opinion sucks, so I rather use the first.

    if the below were possible though I would be all for the definition list.

    HTML Code:
    <dl>
        <di>
             <dt>Article Title 1</dt>
             <dd>Posted June 1, 2009</dd>
        </di>
        <di>   
            <dt>Article Title 2</dt>
            <dd>Posted June 1, 2009</dd>
        </di>
    </dl>
    personal preference of course.
    The only code I hate more than my own is everyone else's.

  4. #4
    SitePoint Addict
    Join Date
    Jun 2005
    Posts
    262
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by oddz View Post
    First because it supports the use of a heading. Although, I wouldn't hold it against you for using the first or last.
    Would you still say 1 even if the only content following the heading was that single date blurb? Also, would the heading still make sense even without any additional content following it, such as the date blurb.

  5. #5
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2006
    Location
    Augusta, Georgia, United States
    Posts
    4,139
    Mentioned
    16 Post(s)
    Tagged
    3 Thread(s)
    yeah I changed my mind as you'll see.
    The only code I hate more than my own is everyone else's.

  6. #6
    SitePoint Addict
    Join Date
    Jun 2005
    Posts
    262
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dan Schulz and oddz, thanks for the helpful input. I'm now further along than I was.

  7. #7
    SitePoint Wizard silver trophybronze trophy
    Join Date
    Jul 2008
    Location
    New York, NY
    Posts
    1,432
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Before using a definition list, you should be aware that it may not be the best option in every case.

    The <dt> within definition lists cannot contain block level elements – particularly the <hn> element. If content within a <dt> cannot be flagged as a heading, it cannot be given “heading” importance within the document hierarchy. Also, Google and other search engines will not index definition list content in the same way that they do for heading-based content.
    I would stick to an unordered list in your situation...


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •