Bootstrap is a lovely little thing. I use it for all new projects, as it kindly stops me from being nerd-sniped by CSS features and cross-browser comparability quirks. I usually end up needing to supplement it or replace it eventually, but it gives you so much for so little.
This!! All my little dashboards and apps I use bootstrap for them initially. Once they've come to a suitable position where the bootstrap framework gets in the way by being a little clunky/big/not specialised enough in certain ways/just looking boring (:D) I go ahead and rip it out. But that feels like the whole point of a framework called bootstrap right? Like its name is literally its purpose :).
The first time I looked at semantic-UI, I honestly thought it was a joke. "Anything can be a <button>, just throw this class on it!" I see they've toned down their "just use divs and spans" examples a bit, but many of their examples are still terrible from an accessibility standpoint [1] and are anything but semantic.
SUI is designed with 3,700+ variables under the hood, and a six level deep theming system (site default theme -> site packaged theme -> site user theme -> component default theme -> component packaged theme -> component user theme).
It becomes very possible to build large codebases around SUI that can be extended over the course of a startups growth that can build all of the company-specific changes purely in theming variables, custom components and css "override" files. After setting up your core UI in SUI you can simply fork our doc style guide to use as branded style guide for your company.
Deploying a new "on brand" microsite can be as simple as copying over a theme folder, tweaking things like @primaryColor @fontSize, @fontFamily, and changing some button shading to create a new variant.
With regards to the build size, most of why we are larger is that SUI includes 50+ components. With our gulp pipeline you can narrow it down to only the components you want. There's even a PR that I'm looking at which, when merged, will let you specify only the specific parts of a single component you want to include in your build, narrowing down file size even more.
Seconded. Semantic-UI is for practical work: if you need a reasonably good-looking app/site right now, go with it. You will be laughed at by purists (so many divs! large! suboptimal!), but you'll get the job done quickly, and they won't.
Also, Semantic UI is the most complete library that I've found. If you build an app, that is really important, you don't want to find out one day that there is a gaping hole because a certain widget hasn't been implemented.
That's an impressive set of UI elements, and impressively consistent.
But their use of jQuery in front page examples hardly inspires confidence. I tried to find out in a few clicks whether jQuery is required, and couldn't.
I made the switch about a year ago and love it. There are some edge cases that you run into every so often but on the whole, it works great. I also appreciate that it is more minimalist than bootstrap.
It seems potentially cool, but the propensity for their docs to seem to assume that I'm going to have my inspector open to poke around at their classes and HTML structure is pretty annoying.
semantic-ui has some nice components and their look and feel is nice, but it breaks in a lot of ways when you try to create something yourself. This is the big benefit of BootStrap; it's robust and lets you fiddle.
It's not a big knock on semantic-ui's part; there aren't a lot of products that don't break within an hour or so after I start using them, it is however, a big plus to bootstrap that it rarely does break when I try something.
While we're plugging our favourite Bootstrap alternatives, I just want to give a shoutout to Bourbon: http://bourbon.io/
I find it a lot more flexible than Bootstrap, but equally useful for fundamentals and cross-browser support. It is also less opinionated about the HTML markup and styling, at the cost of requiring more setup (rather than just, say applying classes) than Bootstrap. But with the additional modules of Neat, Bitters, and Refills, you can get the same sort of UI suite going quite easily.
This is apples vs. hammer comparison. Totally different tools for different purposes.
Bootstrap is for copy-paste website/app sketching and bourbon is for speeding up SASS coding. I tried it, but I ended up using 1-2 functions of it, so it got dropped.
I remember that before BootStrap came to the scene, we used to work with BluePrint CSS. BluePrint gave a nice canvas and concealed all the IE6 related issues. However, once Google Chrome became mainstream, it was time to move up to the next level. BootStrap emerged to the scene and completely won over so many hearts. The world is a better place because of BootStrap! Many many thanks for the team that put this together.
Bootstrap is awesome, but initial loading of my apps was taking a while. I reconfigured to use the Skeleton framework. Not nearly as feature packed, but works amazing well at a very tiny fraction of Bootstrap's size.
Doesn't Foundation require jQuery? Seems like it's a non-starter for anything written in the past 2 years. Maybe Bootstrap does too, I haven't used it in ages.
[+] [-] zeta0134|9 years ago|reply
[+] [-] nstart|9 years ago|reply
[+] [-] whatnotests|9 years ago|reply
You might just like it too.
[+] [-] taspeotis|9 years ago|reply
Bootstrap [1]: 118 KB
SemanticUI [2]: 537 KB
Don't forget to add the JavaScript. I know GZip is a thing, but still...
[1] https://github.com/twbs/bootstrap/blob/master/dist/css/boots...
[2] https://github.com/Semantic-Org/Semantic-UI-CSS/blob/master/...
[+] [-] steveax|9 years ago|reply
[1]: http://semantic-ui.com/elements/label.html
[+] [-] jlukic|9 years ago|reply
See our examples of GitHub layout clones in SUI (be sure to hit paint can icon in top right to swap in other themes)
Modern GitHub http://semantic-org.github.io/example-github/index.html
Classic GitHub http://semantic-org.github.io/example-github/index-classic.h...
SUI is designed with 3,700+ variables under the hood, and a six level deep theming system (site default theme -> site packaged theme -> site user theme -> component default theme -> component packaged theme -> component user theme).
It becomes very possible to build large codebases around SUI that can be extended over the course of a startups growth that can build all of the company-specific changes purely in theming variables, custom components and css "override" files. After setting up your core UI in SUI you can simply fork our doc style guide to use as branded style guide for your company.
Deploying a new "on brand" microsite can be as simple as copying over a theme folder, tweaking things like @primaryColor @fontSize, @fontFamily, and changing some button shading to create a new variant.
With regards to the build size, most of why we are larger is that SUI includes 50+ components. With our gulp pipeline you can narrow it down to only the components you want. There's even a PR that I'm looking at which, when merged, will let you specify only the specific parts of a single component you want to include in your build, narrowing down file size even more.
[+] [-] 49531|9 years ago|reply
[+] [-] jwr|9 years ago|reply
Also, Semantic UI is the most complete library that I've found. If you build an app, that is really important, you don't want to find out one day that there is a gaping hole because a certain widget hasn't been implemented.
[+] [-] eyelidlessness|9 years ago|reply
But their use of jQuery in front page examples hardly inspires confidence. I tried to find out in a few clicks whether jQuery is required, and couldn't.
[+] [-] dopeboy|9 years ago|reply
[+] [-] faitswulff|9 years ago|reply
Specifically: http://semantic-ui.com/examples/grid.html
[+] [-] NKCSS|9 years ago|reply
It's not a big knock on semantic-ui's part; there aren't a lot of products that don't break within an hour or so after I start using them, it is however, a big plus to bootstrap that it rarely does break when I try something.
[+] [-] dqv|9 years ago|reply
[+] [-] epberry|9 years ago|reply
[+] [-] Accacin|9 years ago|reply
[+] [-] elcct|9 years ago|reply
[+] [-] ZeroGravitas|9 years ago|reply
-- HN whenever Bootstrap comes up (paraphrasing Yogi Berra).
[+] [-] _petronius|9 years ago|reply
I find it a lot more flexible than Bootstrap, but equally useful for fundamentals and cross-browser support. It is also less opinionated about the HTML markup and styling, at the cost of requiring more setup (rather than just, say applying classes) than Bootstrap. But with the additional modules of Neat, Bitters, and Refills, you can get the same sort of UI suite going quite easily.
[+] [-] kowdermeister|9 years ago|reply
Bootstrap is for copy-paste website/app sketching and bourbon is for speeding up SASS coding. I tried it, but I ended up using 1-2 functions of it, so it got dropped.
[+] [-] trumbitta2|9 years ago|reply
[+] [-] ceejayoz|9 years ago|reply
[+] [-] unknown|9 years ago|reply
[deleted]
[+] [-] jvannistelrooy|9 years ago|reply
[+] [-] tomhoward|9 years ago|reply
[+] [-] ramanathanrv|9 years ago|reply
I remember that before BootStrap came to the scene, we used to work with BluePrint CSS. BluePrint gave a nice canvas and concealed all the IE6 related issues. However, once Google Chrome became mainstream, it was time to move up to the next level. BootStrap emerged to the scene and completely won over so many hearts. The world is a better place because of BootStrap! Many many thanks for the team that put this together.
[+] [-] joeblau|9 years ago|reply
[+] [-] mosen|9 years ago|reply
[+] [-] renownedmedia|9 years ago|reply
[+] [-] andegre|9 years ago|reply
[+] [-] mosen|9 years ago|reply
[+] [-] MOARDONGZPLZ|9 years ago|reply
http://getskeleton.com/
[+] [-] cloudjacker|9 years ago|reply
[+] [-] the_common_man|9 years ago|reply
[+] [-] bart3r|9 years ago|reply
[+] [-] matude|9 years ago|reply
[+] [-] acdha|9 years ago|reply
[+] [-] seattle_spring|9 years ago|reply
[+] [-] EugeneOZ|9 years ago|reply
[+] [-] chj|9 years ago|reply
[+] [-] Enindu|9 years ago|reply
[+] [-] aporetics|9 years ago|reply
[+] [-] halis|9 years ago|reply
[+] [-] joeblau|9 years ago|reply
[deleted]