7

I've been looking for a suitable set of HTML5/CSS3 foundation files to start new projects on. I started off piecing together my own files, but I believe I might be better served in finding a solid and fairly compatible(with me) CSS3/HTML5 framework and then tweaking certain things that may not best suit my own process.

I'd love to find something that is responsive and that includes aspects focusing on layout, type(hor and vert baselines), form and interface components, cross-browser issues, and preferably built on something other than a just imple css reset, but that does include rebuilding elements consistently across browsers for a clean work slate. Extra features like polyfills or others area great, as is good documentation and examples.

So far, off the top of my head I know of,

  • Skeleton
  • 1140 Grid
  • 320 & Up (plus BP)
  • HTML5 Boilerplate 2.0 and Mobile
  • Inuit.css
  • Less Framework
  • Fluir
  • Perkins.Less
  • A few WP themes

Are there any great one I don't know about? I work a lot in WP, and something that is easily incorporated (but also stand alone) is ideal. Plugins and wide set feature while maintaining the ability to cut it down when needed(flexibility) is also a big plus, and in par with a faster learning, since I want to start using whatever I find immediately .

What are some of the better options you guys might be able to recommend? Systems or scripts, plugins, and other related tools are also welcome, Thanks!

Improve this question

4 Answers 4

Reset to default
5

Joni Korpi, creator of the 'Less' framework, just released his 'Golden Grid System', an adaptive framework that's notable for its elastic gutters and zoomable baseline grid.

Beyond that, though, you've mentioned the popular ones; if they don't meet your needs, you'd be wise to consider building your own framework. Two books I recommend that will help:

In building your own framework (or starting template), you'll learn a great deal and end up with something that caters to your specific tastes and requirements. Frameworks can be great, but you often end up making a lot of changes to them to suit your needs; why not simply start from scratch?

Improve this answer
2
  • I've been away from the nitty gritty of coding for a bit, & have jumped head first back in this year working on several projects, so I'd prefer something that's already around while I get back into the game. Id be using it as a starting point for creating my own set of boilerplate files anyways, cutting parts and adding others, but would like a solid base to start using immediately since I don't have the luxury of taking ages to build all the elements I'd wish to. Also, do you have an opinion on whether one of them may be designed to better lend itself to reworking existing sites with?
    – Jayhal
    Aug 23, 2011 at 23:41
  • @Jayhal Lets design a car, I wonder what the perfect shape for a wheel is.
    – user31515
    Sep 24, 2013 at 23:06
3

Twitter Bootstrap is a great framework to build off of http://twitter.github.com/bootstrap/ one thing to keep in mind is what you plan to build. If wordpress can handle the bulk of the functions your looking for in an app then you'll need to be looking at WP templates.

If you're building an app from scratch something backend then twitter bootstrap and some others you listed are good. I use wordpress as a front end to manage the content of our site but the backend is zend framework with jquery ui (moving to bootstrap next commit).

Improve this answer
2

I spent the past week working with those you mentioned. I also tried Bootstrap by Twitter, HTML5 Boilerplate Mobile, and Foundation by ZURB. They all seemed bloated and more than what I really wanted.

I started searching forked projects of all those that interested me on Github. Then I took the better parts from all the above "frameworks" to build something for myself. I ended up with Normalize.css instead of Meyers Reset. Preboot.less bootstrap with plenty of .LESS mixins. Some components from the Twitter Bootstrap. And put them all into the responsive .LESS 960-inspired framework from Semantic.gs.

I couldn't be happier!

The best part is that I know every single line of code in all my files, and it's actually very small compared to the rest.

You just might be better off doing something like that. I too was against the idea of 'reinventing the wheel'. But I really wanted something to call my own.

Improve this answer
1

I have been using the 960gs for a while now, and I have been getting quite used to it. I like the dimensions, and the easy way you can create good layouts fast.

Now with all the new devices, the 960gs got a little outdated for me, as it will not fit always on every device. And I was also not a fan of using javascript to sniff out the browser and then load the css for it.

Responsive wesbites are a great and elegant solution to fix the problem of the different devices. Since I was used to using the 960gs, I looked for something similair, and the Skeleton framework turned out as winner for me. It just ads a responsive layer to the 960 system.

One thing that I like also is the fact that it has 4 fixed stated. With some of the framework the layout changes on every single browser re-size. The skeleton framework snaps only to 4 states.

One mayor downside I have found is that pinch-zoom does not work with the frameworks. It resizes the screen, but the layour stays the same.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.