Semantic UI 1.0 released | Hacker News Reader

Semantic UI 1.0 released

github.com

185 pointsrtcoms47 comments

By the scope and polish, it's obvious many hundreds of hours of work have been invested in this library. It's at least as comprehensive as Bootstrap or Foundation, and only a casual review is needed to see that it's a lot easier to use then either. And yet all the comments are about the CSS transform in the header, or a knee jerk snipe about the name of the framework itself.

Kitchen Sink example: http://semantic-ui.com/kitchen-sink.html

Lots of examples in there, useful to Inspect. I'm glad this got resubmitted or I might have missed out, it seems extremely comprehensive to prototype with.

I'm an hour through checking it out, and as it already solves problems for me, I'm just going to try to bring it into my work toolset as quickly as possible .. only hiccup was getting through the 'gulp' install, but relatively smooth sailing throughout. (Plus, I just learned about better-console, which is actually now some other thing on my Todo list, but a good one. ;)

As a relative troglodyte on the subject of CSS and web-UI stuff, I have to say that its thrilling to see so many takes on the same ol' thing. A vibrant and thriving scene indeed.

The main home page would benefit from a sentence like "Semantic UI is a user interface framework" explicitly written down somewhere...

Relying on context to convey that idea seems to me a glaring omission. Other than that, I like their stated goal and approach.

http://learnsemantic.com/preface/introduction.html

There's no clear instructions on how to use it so most people are confused.

There should be a getting started that makes clear that the framework works by adding classes on html tags and that's about it.

There is indeed a GETTING-STARTED.md file, and its relatively well-written, imho. It answers all sorts of things you may ask .. "There's no clear instructions" !true, imho.

EDIT: Plus, if you follow the documents in the sources (i.e. README and so on ..) you get to http://learnsemantic.com/ .. which is clearly a useful set of documents for developer needs. Quite some polish.

I'm not even joking when I say that the creator of this framework should consider going into marketing or sales. It's pretty impressive that he managed to take a framework that violates so many semantic HTML principles that it seems like it's being done on purpose, have the audacity to then call it "Semantic UI," and actually have it get some level of traction.

It's like if someone took a bunch of iron beams, claimed that they were actually 100% natural wood, and managed to get a bunch of people to buy them.

Well, the people buying would probably be those who were interested in buying iron beams to start with, then saw some guy selling them at the price of a wood beam.

At first blush I was like great another UI framework, but going through the kitchen sink - they seem to have added all the “normal” UI patterns like Cards - seems like an excellent framework for banging out a prototype.

I went to their homepage - http://semantic-ui.com/ - the page is slow on my macbook pro '14. ~ 25FPS...

After click a couple of the transitions at the bottom of the kitchen sink page, the transitions stop working. Firefox 33.0

http://semantic-ui.com/kitchen-sink.html#transition

Same happened to me. I clicked through the top row and when I got to the bottom row, they didn't work. The top row then no longer worked either. Chrome 39 here.

I think the Vertical Flip transition is the one with an issue. Not only does it not work, but it breaks the others.

I concur. Everything works fine unless I click the Vertical Flip transition. Whenever I click it, animations stop working.

Same thing happened in Chrome, think it's just a bug with their demo JS.

This is simply too slow.

On my phone the home page takes ages to load and repaints too many times before reaching it's final state.

If we're going down anecdote avenue, on my phone it loads and displays just fine on both Chrome and Firefox. Even the Kitchen Sink page is ok (scrolling is not so smooth, but acceptable for a page with so many interactive elements).

Here's the discussion from last time this was posted:

https://news.ycombinator.com/item?id=6381220

Good discussion, I believe the best option is to use semantic html5 tags together with Semantic UI css, which would be way more semantic than html5 tags + bootstrap css, for example.

Not semantic.

The FPS is good.

The amount of painting on some of the objects is Too Damn High.

What button is this? <div class="ui animated fade button">

Meh.

The word "semantic" isn't semantic.

The problem with being semantic (where I guess "semantic" means, to you, that the CSS class is representative of the human readable content of the element?) in underlying UI code is that it doesn't make sense to have a CSS class for every unique item in the UI. The projects I'm working on a UI for would literally have thousands of classes. Even if I categorized them down to some subset (e.g. "apache-config-item"), it would still be in the hundreds, and would be unnecessary information; my UI doesn't need for Apache configuration textboxes to be differently styled than Postfix configuration textboxes. In fact, it would be counter-productive and ugly to give them different styles.

The "semantic" in "Semantic UI" seems to be that the classes describe the resulting visual output. This is semantic. It's just not semantic for the end user (which it doesn't need to be). It is semantic for the developer. The developer, at a given moment, doesn't (generally) care whether the text box is for Apache of Postfix configuration options; they only care if it is the kind of text box they want the user to see.

Presumably, you'll also have IDs that uniquely identify your divs and your input elements. Which still allows styling for specific use cases.

In short, I can't imagine a "semantic" framework being useful if it is semantic for the end user rather than semantic for what the developer is interacting with.

I agree completely. The resulting HTML is unreadable. All div tags, and you have to dive through the classes to see what it is.

Looks really good, besides whether it is really semantic or not, do you feel that the page is very slow? I have a good computer with a good gpu but the page seems slowing down, even in the individual components' page.

Looks quite beautiful.

Wondering why these frameworks always need a build tool written in ruby, javascript, ...or OCaml? Anyone know "gulp?"

I'd prefer a build tool that does not require runtimes to be installed, i.e. something in C, python, even perl for example.

> I'd prefer a build tool that does not require runtimes to be installed, i.e. something in C, python, even perl for example.

Since when does python or perl not require a runtime? It may be more common that OS distros include a perl or python runtime, but that doesn't mean that its not required.

(And, of course, its quite possible for a tool in any of those languages to be packaged in such a way that it includes the necessary runtime in its own distribution rather than require it to be separately installed.)

"runtime to be installed."

Bravo to the Semantic UI team! The Developer Experience seems very smooth and this kit is now a contender... I am now planning to use it on my next small project. Previously I may have only considered Bootstrap or Foundation.

Very pretty, but is it really semantic? "A button can have different sizes. A button can have different colors." </soapbox>

I'm more surprised that the button is defined using a <div> tag instead of a <button> one. http://semantic-ui.com/elements/button.html A lot of these elements seem to be using div tags instead of list, button, ...

“Semantic is tag agnostic, meaning you can use any html tags with UI elements.”

It's unfortunate that they chose to use un-semantic tags in all their examples. It's almost backwards. Other than that, it's extremely well documented and a pleasure to work with, and much easier to pick up than Bootstrap these days.

So is it the obvious usability fail that this statement would seem?

I believe last time this was discussed it was broadly agreed that the framework isn't semantic, it's Semantic. I.e. it's just the name of the framework. Of course, it's incredibly misleading ...

Author here, semantic doesn't refer to the misappropriation of the word "semantic" by developers as "adherence to W3C specification", but instead a reference to linguistic semantics, particularly Montague grammar and compositionality.

This is not a topic that you can very easily introduce, so mostly I prefer to convince others of the library's usefulness rather than getting into a philosophical debate nobody enjoys (or benefits from) about 'the nature of meaning'.

I think that semantic-ui.com looks gorgeous.

I also think it eats a full core on my 2013 Macbook. This, unfortunately, is a poor advertisement for the framework.

I have been using this and love this UI framework. +1

On Chrome v37, if you change the theme, the "Download Now" button breaks.

A lot of the UI elements are really great, especially the Views section.

I think an optimization pass for speed is due. I really like the styles and animations though.

The menus are flickery and unresponsive on my Nexus 7.

ifyoumakeit, your account is hellbanned.

ifyoumakeit wrote: "On Chrome v37, if you change the theme, the "Download Now" button breaks."

"A lot of the UI elements are really great, especially the Views section."

EDIT: the down-vote on this meta-discussion is a real tyranny-of-the-minority situation. What, there's not enough room in this little crack in the paint of the Internet for a little in-context self reflection? Stay precious.

On that note, why would HN hellban this user https://news.ycombinator.com/threads?id=ifyoumakeit, https://news.ycombinator.com/submitted?id=ifyoumakeit? Obviously, their offensive comment or submission is probably deleted, but they hardly post and their posts aren't bad. Broken system.

Thanks glibgil.

triangleman, I'm not sure why I was hellbanned. After 100+ days of lurking and a handful posts/comments, I decided today to start trying to start participating again. My comment history is pretty vanilla, with one random link that I don't remember even posting on the Uber article and didn't even make any sense in the context of the article.

Also, there was never a deleted offensive comment on my account, so I'm not sure why I would be hell-banned. Is there anything I can do to reverse this?

That account was not banned.

All: please follow the HN guidelines and email us (hn@ycombinator.com) rather than posting in the threads. There are two reasons: (a) it's the only reliable way to get things like this fixed, and (b) these meta-subthreads add noise.

https://news.ycombinator.com/newsguidelines.html

Great, the site kept my CPU cores (and cooling fans) very busy, I accidentally clicked on the download link, which brought me 2.5 MB zip file. This thing ain't light. But gosh! 10k stars on github? are you people crazy?

A lot of the bulk is due to the different themes included, 20 (!) total. Also the distribution folder is packed in as well , with the source. The source, by itself, without all the themes, is about one MB. Not bad, but still quite heavy. I haven't used it but it seems to cover a lot, like TWBS, so I can see why people like it.

The source, by itself, without all the themes, is about one MB

That's just the basics. You still need to override/add more. 1MB to get you out of the gate is appalling.

Reply on news.ycombinator.com