Recently I'm starting to become a meaningful-markup freak so now I'm confused of what HTML markup to use in my page. Basically I want to display a list of stories, the title, author, when it was created and some content.
<h2>Story 1</h2>
<em>by: Author X January 17, 2012</em>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book...</p>
So, what meaningful markup should I use to make a list of the above markup?
The h2 headings divide the content to sections. This is the old HTML practice, and you don’t need anything else, unless you wish to style sections in some special way or refer to them as units in client-side scripting or in linking. If you do need something like that, div with a class is the practical way. Advocates of HTML5 may suggest section, but no actual benefits have been described, and section needs extra JavaScript code to introduce it to old versions of IE.
You don’t need any list markup. Just having two or more somewhat similar elements in succession does not mean that you need some markup for a list of elements. The HTML list elements ul (bulleted list), ol (numbered list), and dl (list of named descriptions) are specialized constructs, normally used for lists consisting of short pieces of text. Tables may be treated as lists of rows sharing the same structure, but this normally makes sense only when the rows represent “records” of some kind and you really gain something from presenting them tabularly.
If your items are really short descriptions of stories, rather than stories themselves, they might be treated as bibliographic records and therefore tabulated. But realistically speaking, this is useful only when it makes sense to present them in a tabular manner, one row for each record. That would mean that the descriptions are fairly short. Consider whether a tabular approach could be needed e.g. to make it possible to reorder the records (via client-side scripting), to copy the table from HTML to a word processor or Excel, etc.