▲ 127 points
back
69 comments
I like the idea of having interface "skins", but I honestly could not tell this one apart from Bootstrap. I would love to see more varying interface styles, not another bootstrap clone.
I thought this was built on top of bootstrap.
It's not. It's a completely different codebase.
I welcome the intent which I understand is to provide another point of view on css frameworks. Honestly like others, I am a little overwhelmed with multitude of css frameworks. I think the point was to have a framework to provide aggregation and organization of multiple tools you used previously.
For me Bootstrap, Zurb are currently only really interesting in a sense I would use them in projects. For a while I used Skeleton, I think it lost pace a little and I get same benefits with Zurb.
Again, I welcome your vision of organized front-end, would appreciate a page that would outline differences and specific benefits.
How is this different from Bootstrap (http://twitter.github.io/bootstrap/)?
At this point, if your CSS framework doesn't start with "why we're different/better than Bootstrap" I'm pretty much out. I skimmed the docs and see very little here that isn't a direct "Bootstrap does that, we'll do that too".
They support IE7, which I believe Bootstrap 3 has dropped.
If you don't do the comparison yourself, you're at risk of losing out.
Serves the same purpose (building a UI) but seems to have style differences and a few different JS UI plugins.
Which, incidentally, don't require you to use jQuery. Just sayin'. (it's agnostic).
Forms is a nice addition over Bootstrap for me.
Literally JUST a skin. No idea how this crap gets voted up.
Can we please come up with a better markup for form element grouping than "div.control-group"?
Specifically, HTML has always allowed nesting an <input> inside <label> - and that's more than enough to create either a horizontal or stacked layout. No <div>s needed. And no "for" attribute needed with an unnecessary input ID.
Sometimes introducing more markup can be better architecturally. I agree, .control-group isn't the nicest way of doing things but I don't think nesting an input inside a label is any better.
To my knowledge this is incorrect. Assistive technologies don't recognize input names when nested inside of label elements, and as a result is frowned upon by the W3C. Unless you meant something else by, "...HTML has always allowed nesting an <input> inside <label>..."
That's a fair point. Although div's are not completely necessary for this purpose from a functional perspective, the standard definitely allows one to understand/create the layout of the page more efficiently.
If everyone's wondering how Ink is different from Bootstrap, the answer is: mainly in how Ink builds layouts. Instead of the column span philosophy, Ink uses percentage based blocks. That alone is a big difference.
Don't forget to mention that although we as a default support 3 screen sizes, our grid system is configurable, so you can add or remove as many breakpoints for as many screens as necessary. All with a couple of lines of code.
It looks good; You should add your framework to: http://usablica.github.io/front-end-frameworks/compare.html
One thing I like about this is that most of the class names are namespaced (as "ink-something"), unlike most of the other ui frameworks I've looked at. This makes it a lot simpler to integrate into an existing site without accidentally dealing with conflicting class names.
Yeah, that was one of the goals. Ink is supposed to co-exist with existing layouts when you have a legacy to maintain.
We desperately need something like todomvc for ui kits.
I like the colors and type of default theme of framework. It really looks neat. On the other hand, used markup looks less than Bootstrap. It definitely could be a selling point. Large screen concept and flexible columns also looks very good. I can give them a try.
Please do, and feel free to file issues on Github: https://github.com/sapo/Ink
Came across this UI kit a while back. I like their solution of a glossary page to show all classes in use: http://ink.sapo.pt/glossary
You've just made one of our design leads very happy - we're very proud of that page.
First of all congratulations or Parabens :)
Nice to see some portuguese projects here.
On a unrelated note, how did this end up on as the musicbox website framework? I worked in this project a while ago (backend and frontend clients only) and had no idea who did the musicbox.sapo.pt frontend.
Well, IIRC Ink came about due to the need to quickly build out sites like that (you'll notice SAPO is involved in a bunch of other services like that), and things dovetailed together when the site was revised recently.
It feels to close to Bootstrap without bringing enough new stuff to the table to be worth it. It's nice to see people making alternatives, but it needs to be a lot more developed.
Well, like I said above, it addresses some internal issues my colleagues had. It also tries to make a lot of things simpler for web designers (especially regarding the grid system) without tying you down too much.
I may give this a shot. The way they manage columns without needing to specify the number of columns in a div seems nice.
For instance, if I want a two column layout, I put two divs inside the '.column-group' container. Now (theoretically) if I were to dynamically add a third column, it seems that Ink would automatically adjust the other two columns to fit.
With bootstrap, I would need to change the '.spanx' of each div within the '.row'
Using Ink you just need to use math.
Using "large/medium/small" prefixes and specifying the percentage of each column (large-50 medium-50 small-100)
Take a look at http://ink.sapo.pt/layout
At first I thought the filepicker.io folks, who recently rebranded as Ink, had released a UI kit.
Of course they don't own those 3 letters which have a wide array of meaning, similar to words like "bootstrap", "ember", "buffer", or "backbone". I'd be hesitant to use those words in a product, open source or otherwise, however.
As someone who hasn't integrated Bootstrapped before, I have a clean slate to evaluate and use any interface kit that comes along. As long as it's more comprehensive that what's currently out there, it doesn't matter so much to me how much more of an improvement this latest project is over the prior standard.
Although it looks a lot like Bootstrap, the code is very different. For one thing they really do use LESS. The code is full of variables and mixins, much more than Bootstrap. The custom Javascript Core is interesting too.
Now just hesitating because of the end CSS size. 160KB minified is nearly twice the size of Bootstrap.
I think this is cool, so I say good job on that front. But I kind of feel like you're trying to introduce yet another low end sedan. There's already hundreds, and I've already purchased one. It's gonna take at least a few more years for me to be ready to shop for a new one.
Well, we're not actually selling, but rather giving it away :)
Seriously now, it's been in internal use for a good while because it solved problems that Bootstrap didn't address (like the particular grid flavour and some corner cases in responsive layouts), and the best way gather feedback and improve it is, of course, making it public.
I dig the way this handles multiple screen sizes instead of responsiveness, but my lifelong question continues to go unanswered:
Why does the W3C and every CSS framework avoid making 'center' a thing? Yes, I know how to do it myself...I'm just saying that it has its place.
Doesn't it?
http://ink.sapo.pt/icons#nav-textedit The link for Text Editor Icons is broken because the id for that section is set to nav-web. A copy-paste error most likely.
Thanks for the heads-up!
I have only tried out YUI pure and went back to bootstrap almost immediately. This feels more complete - I particularly like the icon collection.
The icon collection is worth a look for any web project.
It's an icon font, so colours and scaling can just be done with css.
Very easily integrable with Bootstrap as well, just include the css after the Bootstrap css and it works. (All you might have to test is icons that are a different colour now since they just use the font colour)
http://fortawesome.github.io/Font-Awesome/examples/
Random, but I think the site could benefit from font pairing. Ubuntu is pretty for the titles, but the body could use something less ornate.
I personally think this looks great. I was kinda of burnt out of Bootstrap. I'm gonna give it a shot!
Yet another! Foundation, Bootstrap, 960, unsemantic, etc.
Hooray for variety. Or do you prefer monopolies?
Is there any site like http://todomvc.com/ comparing all these CSS frameworks properly?