Definition of semantic

[mrmrs]

Wondering what you are using for a definition of semantic?

Good and bad examples of class names

Try and spot the difference between non-semantic and semantic class names…

You use the word semantic a lot in your site, but your use of it seems to be inaccurate from my understanding of the definition.
Some definitions and etymology:

1655-65; < Greek sēmantikós having meaning, equivalent to sēmant (ós) marked ( sēman-, base of sēmaínein to show, mark + -tos verbal adjective suffix; akin to sêma sign) + -ikos -ic

noun, ( used with a singular verb)
1.
Linguistics.
the study of meaning.
the study of linguistic development by classifying and examining changes in meaning and form.
2.
Also called significs. the branch of semiotics dealing with the relations between signs and what they denote.
3.
the meaning, or an interpretation of the meaning, of a word, sign, sentence, etc.

Semantics (from Ancient Greek: σημαντικός sēmantikós, "significant")[1][2] is the study of meaning. It focuses on the relationship between signifiers—like words, phrases, signs, and symbols—and what they stand for, their denotation. Linguistic semantics is the study of meaning that is used for understanding human expression through language.

Can you explain how the example classes you use below fall outside of the definition and spirit of the word semantic?

<!-- bad -->
<div class="red pull-left"></div>
<div class="grid row"></div>
<div class="col-xs-4"></div>

[adamsilver]

@mrmrs

I used something I read years ago, so don't have a reference to it for you.

I believe it to be about adding meaning using words but feel free to correct me further.

I know there is a school of thought that says "red is meaningful because i am making this thing red" but I disagree for many reasons, all of which are explained in the guides for you :)

HTH

[rjgotten]

I know there is a school of thought that says "red is meaningful because i am making this thing red" but I disagree for many reasons, all of which are explained in the guides for you :)

The idea that semantic names should follow content, just so that you can alter presentation is folly.
From a maintainance perspective there's nothing wrong with something like

<div class="pull-left"></div>

as long as you don't change the implementation of that rule under different media conditions. E.g. if I need that thing to render at the right under a smaller viewport, I add a different class specific to that media condition:

<div class="pull-left pull-right@small"></div>

Or you go one step further and identify the pull component's direction as configuration which you can steer via data attributes:

<div class="pull" data-pull-dir="left right@small"></div>

In other words: follow the open-closed principle and write in a way that is open to extension and closed to modification, and use of layout semantics will be fine.

Infact; layout semantics such as "grid" or "toolbar" should be used together with content semantics to drive development, where content modules or parts of content modules are laid out inside layout modules (and never shall the two mix).

This enables layout mechanisms to be re-used wholesale without copying between modules and without layout properties such as padding or margin needing individual tailoring per-module. And if your content modules are layout-agnostic, it allows you to re-use them in different layouts.

[adamsilver]

No worries if you disagree.