[html5] Appropriate markup for index documents

Fri Dec 26 13:21:01 PST 2014

On 12/23/14 8:14 AM, Andrew Croce wrote:
>
> It seems to me that there is a gap in the semantic options for marking
> up index, or list, pages. Now, to be clear I realize there are list
> elements, but these are strictly for marking up the specific set of
> listed items. However, a list may have a larger context, which I am
> calling an index.

I'm not sure what you want. There is no specific element for different 
kinds of pages; since there are virtually unlimited kinds of pages, html 
would need unlimited different elements to contain them. There is 
microdata, which is perhaps what you want:

https://html.spec.whatwg.org/multipage/microdata.html

There is a collection of schema:

http://schema.org/

All of them are supposedly used by Google et. al., but on most types 
there seems to be no difference in how clients treat them.

The specific schema you want is probably

http://schema.org/CollectionPage

[rant:]

But I honestly don't see the point. It's parent type is

http://schema.org/WebPage

and what on earth is the point of that? Are we supposed to use microdata 
to tell search engines that our webpage is a webpage? What the #$@# else 
would it be?

If you feel the need to add pointless semantics, than use the 
CollectionPage schema. But I wouldn't bother.

[rant over]

> Like an article, an index might have a header and footer, and should
> probably contain a <ul> or <ol> where the items are listed. What comes
> to mind is something like a catalog, where the list itself has some meta
> information, and could itself contain sections or navigation. An
> <article> seems inappropriate since that should, I believe, be a single
> piece of content. A <section> also seems inappropriate in itself, unless
> its part of an even larger context.

I don't see why you discount section and article. They are perfectly 
good elements. You can put a nav element if it's appropriate, or break 
it up into sections if that's appropriate.

<body>

  <p>other content</p>

<section>

  <nav> (what would a nav element do here?) </nav>

  <h1>list of foo bar pages</h1>

  <section>
   <h1>foo</h1>
    <ul>
     <li><a href="foo1">foo 1</a></li>
     <li><a href="foo2">foo 2</a></li>
     <li>etc.</li>
    </ul>
  </section>

  <section>
   <h1>bar</h1>
    <ul>
     <li><a href="bar1">bar 1</a></li>
     <li><a href="bar2">bar 2</a></li>
     <li>etc.</li>
    </ul>
  </section>

</section>

</body>

If your list, the index of pages, is the sole piece of content on a 
page, than you don't need a container element.

<body>

  <h1>list of foo bar pages</h1>
   <ul>
    <li><a href="foo1">foo 1</a></li>
    <li><a href="foo2">foo 2</a></li>
    <li><a href="bar1">bar 1</a></li>
    <li><a href="bar2">bar 2</a></li>
    <li>etc.</li>
   </ul>

</body>

-- 
Brian Tremblay