define use of article tags in page templates

[soniktrooth]

From looking at the existing markup on the about page (which came over from Pinnacle) as well as the css in it seems the _global.scss, there seems to be an assumption that the entire content region will be wrapped in an article tag. See:

main > article {

  border-radius: 0;
  @extend .col-sm-9;
  @extend .row;

I'm sure we don't want to have huge discussions about semantics here but I was wondering if this is a pre-decided convention for all pages or if other pages that aren't considered articles should be wrapped in something else.

[andrewmallis]

The article element represents a complete, or self-contained, composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.

Potential sources for the

element:

• Forum post
• Blog post
• News story
• Comment

http://www.w3schools.com/tags/tag_article.asp

[andrewmallis]

Article tag should be for articles but not static pages like about imho

[soniktrooth]

@andrewmallis, I agree, that's why I was confused as to how it was being used, but this could have been confusion due to my lack of perspective on the previous project. You mentioned a page tpl in #27, which I don't think I've seen anywhere, but which should help with this issue.

For me this issue was really about trying to keep the css clear and concise so it's easy to identify on each page which element was the main .container. I was hoping for a rule like this:

main {
  @extend .container;

> article,
>  .content,
> .some-other-thing  {
  @extend .row;
}

Note that .content is just a suggestion and could be whatever element or class we decide to wrap the main page content in on pages that aren't articles.

[thiagodemellobueno]

Hmmm, article is misunderstood in the same way that address is.
Article in html5 imho means "a single discrete thing" like "article of clothing."

The spec:

The article element represents a component of a page that consists of a self-contained composition in a document, page, application, or site and that is intended to be independently distributable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content."

So if it would be an entry in an rss feed, or in drulap a 'representation of a node' (say a view item)...

Mozilla

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/article

Usage notes:
When an

element is nested, the inner element represents an article related to the outer element. For example, the comments of a blog post can be elements nested in the representing the blog post.

More examples and discussion.

http://html5doctor.com/the-article-element/

[thiagodemellobueno]

Now differentiating semantics of document types, is the realm of schemas and microformats:
http://microformats.org/wiki/microformats2#h-entry
http://schema.org/Article
http://schema.org/Comment
http://schema.org/Recipe
etc
all types of: http://schema.org/CreativeWork

and we KNOW the robots are listening.

[andrewmallis]

Lots of things can be articles, agreed.

I think it's the distributable part that puts into question our de-facto use of article for static pages like a contact page, which would never hit the RSS.

[andrewmallis]

and I think what's being suggested is that we could be better off with a more neutral wrapper like a div across the board, then article as a child when it makes sense (which would be most, but not 100% of the time).

[soniktrooth]

I think for outer scaffolding it makes sense to go with generic div that we can use as the .container element for all pages. Then whoever is marking up the page can decide what makes semantic sense for that page as the first element inside this wrapper. This way we can know on any page we already have a .container in place and can start adding layout (.row and .col-) that is specific to that page.

[thiagodemellobueno]

@soniktrooth this issue's pretty ancient... what about <main>

[thiagodemellobueno]

Things have evolve much.
Move to close.