Live data from Hacker News

Semantic UI – A language for sharing UI

semantic-ui.com

41–50 of 85 posts

Re: Semantic UI – A language for sharing UI

#41
post #7

The bootstrap markup is actually more semantic than Semantic UI. Classes like large, red, floated, right, circular etc.. are presentational not semantic. If you want to use a framework and keep semantic CSS then look in to using the LESS/SASS version of Bootstrap or Foundation. Edit: After a more detailed look, the framework is actually really nice (and very comprehensive). The name still doesn't make much sense thou…

I don't understand this. It's CSS. Of course it's presentational. Do CSS class names have to describe the semantic structure, as well as the DOM structure?

No, it is about marking up the data (HTML) with labels that have a representation described in the CSS.

So the HTML should say "this is important" (em) while the CSS is free to define "important" as bold, different color or some other font change.

For example the HTML should not contain anything about number of columns. It will be 1 column on iPhone, 2 on iPad and 4 on Desktop - but the HTML does not change.

Re: Semantic UI – A language for sharing UI

#44

This is semantic: Title Home Link Link not this: Title Home Link Link Signed in as user

Yes, this EXACTLY. We need CSS libraries that encourage the use of new HTML5 tags. We're no longer living in a world of scrambled DIVs, we have a page structure to follow now. I feel as if this may even be a step backwards, just the third example code in which the Bootstrap version has button while the semantic version is a DIV makes no sense, it's a button, not a DIV.

Re: Semantic UI – A language for sharing UI

#45
post #25

In their examples, none of their buttons were actually buttons. Nor were they even links. They were all DIVs. This is pretty terrible HTML, for many reasons, especially for accessibility.

I really liked it visually speaking but yes, buttons implemented as divs it's sad.

Although it's sad, what's really sad is that buttons don't render consistently across browsers. I try to avoid buttons for that reason :(

Re: Semantic UI – A language for sharing UI

#46
Very nice, and has lots of components. I like it.

Regarding the semantic-ness of the class names - I see people complaining that "ui three column grid" is not semantic. I don't understand what the big fuss is about - how could a generic, non-preprocessed grid be semantic ? It's presentational by definition, and the class names reflect that. If they implemented the framework as SASS mixins, sure, you can be as as semantic as you want when you use those mixins. That's what I like about Foundation. For example:

  .my-foobar {
    @include grid-columns(3);
    @include panel;
  }

Re: Semantic UI – A language for sharing UI

#49
post #32

Earlier quoted context omitted.

Frankly, Bootstrap is exactly that, for me. I've been converting our products (Webmin/Virtualmin, which are 15 and 10 year old codebases, respectively, and it shows badly in the current UI). Converting to Bootstrap, while extremely time-consuming, is not requiring significant design skill on my part to make everything look freaking awesome.

Thank you for redesigning Webmin. I used it for a client's server and the functionality was fantastic, the design a bit less so. A Bootstrap'd frontend sounds fantastic.

You're welcome. Here's the most recent screenshot of progress:

http://i.imgur.com/l5gEwUJ.png

It is also immediately theme-able with any Bootstrap theme, which is a major leap forward. And, it is responsive...another major leap forward. The old way of handling mobile is to have a custom theme for mobile devices (currently based on Joe Hewitt's iUI, which is pretty long in the tooth, and looks like ancient iOS versions).

We're about a week away from an alpha release (suitable for testing in the wild), a month away from a beta release (suitable for daily use by people who understand how to file bug reports), and two months away from it being the default theme in all of our products, both Open Source and commercial. Assuming I am able to maintain the current pace of development.

Bootstrap (and maybe moreso, jQuery) is pretty miraculous, honestly. I've tried to do this on two separate occasions in the past with YUI and ExtJS, and failed miserably, because they simply don't work well in a progressive enhancement environment (and my brain doesn't work the way their developers brains work...jQuery fits my Perlish brain a lot better).

Post reply on HN