Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Semantic UI

semantic-ui.com

Post reply on HN
Print view View original

151–160 of 257 posts

Re: Semantic UI

#151

Post by YCode »

olegkikin wrote: post #137
jameslk wrote: post #34

I've always found it ironic that this library calls itself "Semantic UI" but doesn't follow the practice of semantic HTML/classes[0]. W3C suggests[1] that classes should be used for semantic roles (e.g. "warning", "news", "footer"), rather than for display ("left", "angle", "small" -- examples taken from Semantic UI's docs). So instead of giving a button the class of "button" it would be better to give it a class suc…

They also use tag for icons. https://semantic-ui.com/elements/button.html

Is that a problem, give em/strong cover b/i these days?

Re: Semantic UI

#152

Post by ryanbrunner »

rimliu wrote: post #100
jasim wrote: post #58

Earlier quoted context omitted.

The concept of 'semantic classnames', even if propagated by w3.org has caused as much grief as the concept of 'separation of concerns' between HTML & CSS fad. The reason we need semantics in HTML is to make the markup accessible for screen-readers, and no screenreader considers the class name of an element when reading it out. What we instead need are semantic tags like article, section etc. and aria tags like role.…

Semantic names for CSS classes have the same utility as good variable/function/method names in code. They describe what is this for, not how should it look. I have seen enough .red12px where it was green and 10 px already. Cannot wait for the new web standards movement to start already.

`.red12px` is for sure a bad example, but often-times "what is this for" in the context of a tag with a class on it is purely for styling. This div is here because I want padding here / a different font / whatever, and I can either be upfront about that (maybe with something a little more maintainable like `.padding-large` rather than `.padding-40px`), or I can do a little dance and invent some semantic name like `.widget-inner-details` that serves no purpose other than giving me a hook to say "I want larger padding here"

Re: Semantic UI

#153

Post by YCode »

tomelders wrote: post #104

Please stop with these things. They're never fit for purpose, and now there's another thing that looks - to non technical people - like a panacea for all development woes. Designers will never follow your constraints. Managers will never understand why this hasn't magically reduced our estimates by 90%. And yet again, it's just "developers being difficult" because there's a bunch of guys in India who say they CAN wor…

Not sure about your definition of "these things" -- are you including say Bootstrap, jQuery or Angular/React/Vue/etc.?

Re: Semantic UI

#154

Post by spectistcles »

jameslk wrote: post #34

I've always found it ironic that this library calls itself "Semantic UI" but doesn't follow the practice of semantic HTML/classes[0]. W3C suggests[1] that classes should be used for semantic roles (e.g. "warning", "news", "footer"), rather than for display ("left", "angle", "small" -- examples taken from Semantic UI's docs). So instead of giving a button the class of "button" it would be better to give it a class suc…

This has always been my understanding as well. I've always tried to write HTML in a manner that would remove all presentational aspects to the point that I could redesign an entire site by changing the CSS only.

Re: Semantic UI

#155

Post by harel »

TomFrost wrote: post #32

Semantic recently adopted my team's React adaptation as their official React port. It's lighter weight, eliminates jQuery, and all components are standard React components that can be extended or dropped in as-is. https://react.semantic-ui.com/

The react port is top notch. I'm switching my app to it.

Re: Semantic UI

#156

Post by SippinLean »

tomelders wrote: post #104

Please stop with these things. They're never fit for purpose, and now there's another thing that looks - to non technical people - like a panacea for all development woes. Designers will never follow your constraints. Managers will never understand why this hasn't magically reduced our estimates by 90%. And yet again, it's just "developers being difficult" because there's a bunch of guys in India who say they CAN wor…

Working on enterprise-level sites this stuff is essential, not useless. CSS modals are a solved problem, I don't feel like solving it again. Designers won't follow any constraints.

Re: Semantic UI

#157

Post by brightball »

jorgeer wrote: post #70
jlukic wrote: post #44

For people who are curious about theming here is classic GitHub done entirely in Semantic UI. http://semantic-org.github.io/example-github/ (Click the small paint icon in the top menu to swap themes to see in native SUI) I did a meteor dev night where I talked about some of the ideas behind Semantic UI, which might clear up some of the linguistic origins for the library and it's ideas about language: https://www.yout…

Fantastic work. Our company use Semantic-UI for pretty much every project, as do I privately. A pleasure to work with, way above other frameworks I've used.

Are there decent options for themes out there? I really like what I see but my design talents are...lacking. :-)

Re: Semantic UI

#158

Post by adamwathan »

jameslk wrote: post #34

I've always found it ironic that this library calls itself "Semantic UI" but doesn't follow the practice of semantic HTML/classes[0]. W3C suggests[1] that classes should be used for semantic roles (e.g. "warning", "news", "footer"), rather than for display ("left", "angle", "small" -- examples taken from Semantic UI's docs). So instead of giving a button the class of "button" it would be better to give it a class suc…

I used to think this way until reading this article by Nicolas Gallagher:

http://nicolasgallagher.com/about-html-semantics-front-end-a...

These days I'm quite convinced trying to author your markup such that you can redesign a site by applying a different stylesheet has the dependencies backwards.

If you try to keep visual information out of your HTML, you end up authoring stylesheets designed to nimbly navigate your DOM structure to precisely target elements to style in a way that makes your CSS extremely coupled to the particular site you are building.

Your HTML documents are already coupled to your project, so rather than writing CSS that's coupled to that HTML, I've found it to work much better to author CSS from a mindset that the CSS knows nothing about the document it's trying to style.

This leads to writing what I call "library-style" CSS, where you are almost trying to build your own Bootstrap or similar; something that you could actually use on multiple projects if you wanted.

A class like "download-book" is not very useful if you have multiple buttons in a project that are meant to look the same way and not all of them trigger a book download.

Re: Semantic UI

#159

Post by WA »

malloryerik wrote: post #17

Might also check out Ant Design. https://ant.design/ It's integrated with React and there's a separate mobile UI for it. Ant is Chinese, with docs translated into English. Like China, it's huge^^ I've just been fooling around with it today for the first time in create-react-app and seems good so far. Haven't tried on mobile.

Slick, first library that gets many things right I think. However, there's apparently a desktop-version and a mobile-version. Is this normal? Don't people make responsive designs these days, but separate UIs for mobile/desktop?

Re: Semantic UI

#160

Post by du_bing »

brightball wrote: post #157
jorgeer wrote: post #70

Earlier quoted context omitted.

Fantastic work. Our company use Semantic-UI for pretty much every project, as do I privately. A pleasure to work with, way above other frameworks I've used.

Are there decent options for themes out there? I really like what I see but my design talents are...lacking. :-)

https://semantic-ui-forest.com
Post reply on HN