[mantasm]

class="two-thirds columns" enforces a strong coupling between the HTML and how it is presented.

To change how wide a column is, you change its class. To change how wide an image is, you go into the CSS. To change how wide a column's border is, you go to the CSS. Doesn't changing the class seem a little out of place?

In theoretical terms, the class is semantically the category to which the component belongs. a <section class="cart"> is perfectly reasonable, whereas <div class="two-thirds columns"> is not. The <div> and it's children are not tied to the notion of how wide the div is. The fact that a section has class "cart" is important in understanding it's children.

[jordanlev]

I don't see how class="two-thirds columns" enforces coupling any stronger than using a different class name... what if that div only exists for the purposes of the grid layout? As long as the styles themselves are in CSS, how is it any different? I mean, of course if you just arbitrarily named the class with gibberish, that's no good -- but the point I'm trying to make is that the CSS classes exist to impart meaning to the designer (or the developer), not the end-user and not the screen readers and not search engine crawlers... so "two-thirds columns" is perfectly semantic because it is giving meaning to that div whose entire purpose in life is to be a two-thirds column in wide-screen view :)

I totally understand your point, and I'm kind of being obtuse for the sake of argument... but I do think the term "semantic" is thrown around without people really thinking about "semantic for whom" or "towards what purpose".

[wodenokoto]

> what if that div only exists for the purposes of the grid layout?

Those things aren't supposed to exist. HTML is supposed to look like:

    <div class="blogpost><h1> ...
    <div id="mainmenu"> ...

We never got enough power in CSS to actually do that, and current frameworks are a return to the table based layout of the 90s where structure of the layout (not structure of the content) is stored in the HTML.

If semantic in terms of HTML is ever thrown around meaning anything but description of the content, it is used wrong.

The question about "semantic for what purpose" is moot when talking about HTML. It is semantic towards what information the content conveys.

"Semantic HTML is the use of HTML markup to reinforce the semantics, or meaning, of the information in webpages rather than merely to define its presentation or look."

https://en.wikipedia.org/wiki/Semantic_HTML

The question of whether that is feasible to do with current technology is completely different, but it is too late to try and redefine semantic HTML.

[jordanlev]

Okay, let's say instead of calling those classes "columns", we instead call them "item". (I do this with my own "semantic grids" -- instead of "row" and "column", I use the terms "group" and "item", because on narrow screens the columns aren't actually columns). It seems to me that I could use a div to group content together in this way and it then is used to describe the structure of the content (which things are grouped together).

Everything is so loosey-goosey with HTML. HTML5 sectioning elements are a huge clusterfuck, no browsers utilize the document outline and screen readers primarily rely on ARIA roles. Google uses black magic to figure out what documents mean... so the "html can only contain information that defines the content" ship has sailed. You need to have divs in your html to achieve certain layouts. As long as those divs need to be there to serve that purpose, why not use class names that are related to the purpose you're using them for?

This is very different from table-based layouts. The <table> element does have a defined meaning! But div's do not... so using divs and styling them with CSS achieves proper separation of concerns. The label you use to describe them only has meaning to you (the designer/developer).

[wodenokoto]

> You need to have divs in your html to achieve certain layouts.

I'm not saying that semantic HTML is working today. But just because it isn't working doesn't mean we should start calling what is working for semantic HTML.