Live data from Hacker News

Using Bootstrap the Semantic Way

ostraining.com

41–50 of 71 posts

Re: Using Bootstrap the Semantic Way

#41
post #29

Earlier quoted context omitted.

Less has the same feature: http://lesscss.org/features/#extend-feature

Thank you so much for pointing this out, Moretti! It drives me crazy when people talk about the extend feature like only SASS has it. People are always underestimating how similar Less and SASS are.

To be fair, Sass did have it about 3 years before LESS

Re: Using Bootstrap the Semantic Way

#42
post #16
post #7

Earlier quoted context omitted.

You will start caring the day you want to update to Bootstrap 9000 and need to change the class names of all the properties that have changed. A counterargument could be that one could stick with the version already deployed, and that's fine too I guess. For me it's about being in control of the situation. I will find myself changing things just for them to look as they are supposed to look like, and soon realizing t…

Bootstrap already depends on the markup structure, which makes your point moot.

I do not really get your point, care to elaborate? Unless you mean that 'div' is subject to change over time…

Re: Using Bootstrap the Semantic Way

#43
I build web "apps". I don't treat HTML and CSS like a semantic document; it's just a declarative layout engine. Yes, I often use HTML elements and structure to define layout instead of CSS classes. My CSS class names often have little "semantic" meaning outside their single purpose, that is to define layout and style. Am I doing something wrong? We don't have these discussions when building native GUIs.

Perhaps if I were building a CMS or some other document-oriented site I would approach things differently.

Re: Using Bootstrap the Semantic Way

#44
post #29

Earlier quoted context omitted.

Alternatively use SASS (and the bootstrap SASS port[1]) which doesn't has this problem, as it instead rewrites selectors. i.e. if you have: .column { width: 100px; display: inline-block; } And you do: .cool-sidebar { @extend .column; } Then the generated css will be something like: .column, .cool-sidebar { width: 100px; display: inline-block; } [1] https://github.com/twbs/bootstrap-sass

Less has the same feature: http://lesscss.org/features/#extend-feature

Then, in Bootstrap terms and since the grid syntax is offered in mixins, should it be used as follows

    .foo-class {
        &:extend(.col-md-4, .col-md-offset-8)
    }
instead of using the mixin?

    .foo-class {
        make-md-column(4);
        make-md-column-offset(8);
    }

Re: Using Bootstrap the Semantic Way

#45
I've used Bootstrap and been forced to use it on existing projects already engulfed in it. It isn't pretty on a large project. I've sworn off using Bootstrap in any new project that isn't a prototype for a hack day. The only things I borrow from Boostrap these days are some of the JavaScript niceties like modal, tooltip, and scrollspy. And when I do that I'm very explicit in what code I pull in to use those.

Build the CSS for your next project using mixin libraries like Bourbon/Neat or Compass/Susy. You'll be glad you did.

Re: Using Bootstrap the Semantic Way

#46
post #36

We need a better word for this than "semantic". We're just passing the complexity back and forth between the HTML and the CSS, and the only "semantics" or meaning that arise are to the author/editor. Users don't care, machines don't care, and I've never, ever seen a large-scale site design that doesn't involve some reworking of both the HTML and the CSS.

That's because you aren't blind.

Re: Using Bootstrap the Semantic Way

#47

Earlier quoted context omitted.

That's no rebuttal, just an opinion. Oh we got this huge app and are to lazy to do everything properly.

I'm not convinced you read the link, rather than just the bits I quoted. Also, laziness is one of the three great virtues of a programmer according to Larry Wall. People are getting things done with Bootstrap every day.

> People are getting things done with Bootstrap every day.

That is not an argument for correctness of approach. If there arose a cult of builders who decided to pour foundations with wheelbarrows and bags of concrete rather than a mixer, I'd tell them they're doing it wrong no matter how many houses they built this way.

Re: Using Bootstrap the Semantic Way

#48
post #3

The point of using bootstrap is a reusable set of classes. I really dont care wether class names are semantic or not,it doesnt change anything,except for pedantic people looking at your source code. SEO doesnt care , users dont care, accessibility doesnt care either. Using new HTML5 tags is good enough and was designed for that specific purpose. If i want semantics I use nav,aside,section instead of div,and so on. No…

Couldn't disagree more with your statement. What if you have a sidebar that appears 20+ times throughout your application in different contexts. You might decide it is too wide. Are you going to go through all your templates and change class="col-md-blah" or are you going to change one mixin? Also, if you are providing a theme, I don't see how you lose portability. Your mixins will be relying on base bootstrap anyway…

For pretty much anything anyone could describe as a "web application" if you have the HTML for your sidebar copied around 20+ pages instead of stored in a common template somewhere, you have bigger problems than whether your HTML is semantic.

Re: Using Bootstrap the Semantic Way

#49

Earlier quoted context omitted.

I'm not convinced you read the link, rather than just the bits I quoted. Also, laziness is one of the three great virtues of a programmer according to Larry Wall. People are getting things done with Bootstrap every day.

> People are getting things done with Bootstrap every day. That is not an argument for correctness of approach. If there arose a cult of builders who decided to pour foundations with wheelbarrows and bags of concrete rather than a mixer, I'd tell them they're doing it wrong no matter how many houses they built this way.

The problem is that you can demonstrably point out objective flaws with using wheelbarrows and bags of concrete (or I assume you can - I know nothing about pouring foundations).

With the cult of semantic HTML, the flaws in using class names to describe presentation are almost always not explained beyond some vague notion of "correctness", and possibly an example that bears to relation to reality when you take into account that almost all HTML is being generated by some sort of templating engine anyway.

Re: Using Bootstrap the Semantic Way

#50
post #33

Earlier quoted context omitted.

no, but or are semantic, and there's no reason you couldn't use those instead of by using the features of LESS or SASS.

That still wouldn't be semantic. Their only reason for existing is for layout. If html/css were semantic you could write all of your html first without thinking about style or layout and then go do the css after, but that's simply not possible today.

I think you are using a different definition of "Semantic" - please provide a snippet of html you feel is semantic and I'll show how this approach can be used with it.
Post reply on HN