Hi

 

I did submit a post regarding SASS and Compass in the CSS and HTML forum and not sure whether this question/discussion point should go there aswell but this is more to do with Layout than actual coding.

 

I have been looking into frameworks for speeding up the design of a webpage and I was just curious to see whether it is worth looking into such a framework.

 

I have watched a tutorial on Twitter's Bootstrap and as I was seaching I came across Foundation and HTML5 Boilerplate. Has anyone had any experiences with frameworks and if so what are the pros and cons of using them. Also which frameworks are people using.

 

Any feedback and opinions on this subject would be much appreciated.

Regards

Chris

I am afraid I can't give you much of advise. I have used Html 5 boilerplate for a static website and I have found it good actually. I think Twitter bootstrap is overloaded with stuff that probably you won't use.

 

I work mostly with Wordpress, so I don't do many static websites, but I would prefer a framework that is stripped down to bare bones.

As far as I remember, even with the HTML5 boilerplate, there were a lot of things I didn't need at all.

Thanks for your reply Teodora, I haven't really looked into WordPress as I have not done that many projects that require that amount of functionality, I have tried WP once and I was just confused and it sounded like alot of work to produce custom themes. I would appreciate some guidance about WP as I have heard many good things about it as a CMS but as I am not up on the customisation of WP I have always shyed away from it.

 

I am only looking into Frameworks as I was reading an article about their use and as I had never really heard of them I decided to research them as I think that some of them support responsive web design which is something I am interested in at the moment and it its a buzz word in many articles on web design at the moment.

 

What is your website which uses WordPress Teodora I would be interested to see how you have used it.

 

If anyone else has any comments about Frameworks or WordPress it would be interesting to know people's views.

I find Wordpress very easy to use and to theme. I am not much of a coder, so Wordpress is a very good CMS for me.

I use html5blank http://html5blank.com/ and sometimes blankslate http://wordpress.org/extend/themes/blankslate

They are both starter themes and are easy to use, not bloated at all, so building custom sites on them is easy.

html5blank is responsive ready and retina display ready, plus it comes with options for different browsers specific stylesheets and scripts. It is also translation ready, which is handy.

My portfolio is built on Wordpress and most of the sites in it, too.

 

Hope that helps

Hiya, Chris.

 

I've used most of the well known frameworks but now work on my own stuff (albeit, not to the standard of what you'd find included in a framework). Frameworks have taught me a lot and they have been very practical in the past but I prefer to do things from scratch whenever feasible. Everyones tastes and abilities are different, but I would recommend three frameworks if you decide to go that route. Bear in mind that the following is based on my experience and preferences.

 

Skeleton is one of my favourites (getskeleton.com). It's light, doesn't use JavaScript (well, when I last used it) and is very straight forward to use. It doesn't have much code bloat on it and it's fairly intuitive to use. As long as you get used to the conventions of the grid and the use of alphas and omegas (not as complicated as it sounds - honest!), it gives some pretty good results.

 

Second to those would be Zurb's Foundation and Twitter's Bootstrap. They're very similar to each other and have their uses. Foundation has recently been revamped (Foundation 4) and goes with the Mobile First approach - something I highly recommend you look into. The new Bootstrap will also implement Mobile First. Bootstrap is the more popular of the two and has an extensive library for UI, etc.. Out of the two, my preference is Foundation. The grid it uses is very practical.

 

These days I don't use frameworks and use my own grids based on SASS. If you're looking to get into SASS, Foundation (and I think Bootstrap will/is using) comes with the option. Beforehand I used Foundation using vanilla CSS. If I were to use it again using SASS, I'd assume my workflow would improve.

 

As per Teodora, I'm not a coder either and WordPress is the CMS of choice with that in mind. You could also look at Perch and Concrete5 for CMS. There are of course others such as Drupal and Joomla! but I've never used them. The links Teodora gave you are excellent and they would be a good place to get involved when/if you make the jump to WordPress. I'll also throw in a couple of names for WordPress themes. Bones http://themble.com/bones/ (my favourite), Roots (a little complex) http://www.rootstheme.com/ and Underscore S http://underscores.me/.

 

This reply has dragged a little, so apologies for that. If you intend to follow up on WordPress themes, have a look at this tutorial for theme development http://themeshaper.com/2012/10/22/the-themeshaper-wordpress-theme-tutorial-2nd-edition/ (I think I should add that as a signature the amount of times I've linked it

I have looked so many times at LESS and SASS and never used it, just seems a bit scary to me

Edited March 31, 201313 yr by teodora

I have looked so many times at LESS and SASS and never used it, just seems a bit scary to me

 

Your not the only one!

Seriously: LESS and SASS is not so hard to get stuck into - honestly! I made the mistake of thinking it was a whole new learning curve to get accustomed to, but it's really not that bad. If you're working on a small site, stick to CSS but try SASS or LESS with larger sites. When I say larger, I'm not talking Amazon but something that has a lot of colour and typography settings. You can change one setting and it can apply to the whole site.

 

I recommend this http://coding.smashingmagazine.com/2011/09/09/an-introduction-to-less-and-comparison-to-sass/ as your starting point. Sure you have to read some an article, but it's really not that much Secondly, get something like CodeKit. I bought it for something like $40 dollars or something around that. You can specify your price (within reason) and I selected a higher price as it really is a good piece of software. I haven't scratched the surface with it yet but it's indispensable when I use SASS. Of course, it's available as a trial for something like a week or two. An alternative is the less.app. It's made by the same person and I think it's free. Doesn't do SASS though.

 

To get used to it, I would recommend practicing with a small custom grid like semantic.gs or delving further into Foundation or Bootstrap and tinker around with it. If you know CSS, you'll know SASS. You can get some great plugins for your text editors too. I use Sublime Text 2 and have a plugin that outputs SASS/LESS. Can't think of the name of it off hand, but if you're interested, I'll have a look and post the name. It's free of course.

 

Finally, if you want to go even further (this is Abyss level stuff ) head over to bourbon.io and can make some custom mixins. I used some for my current grid. It was a bit of a brain melt at first, but I got there in the end

Thanks for the links Teodora, I will have a look into WordPress soon.

 

4lil4s thanks for your very comprehensive replies, and you didnt drag on as you put it, I found your posts very interesting and I will look into SASS and LESS as I feel that as they support the grid system and are all about RWD and the new techniquews that it would be beneficial to look into them.

 

I decided to get a better understanding about Frameworks and have been watch the Frameworks and Grids training on Lynda dot com where he focuses on the Foundation framework. I am really looking forward to trying it out. My web design skills were very old school and with the insights which I have learned about from this forum and by doing google searches, frameworks are alot more popular than I realised, I like the way they do alot of the repetive tasks and the layouts are responsive.

 

I would be intrested to know a good program which you can use to convert SASS files.

I cant recommend SASS highly enough. I notice here that there are a couple of posts which state that it is 'scary', whilst I agree it can be a bit daunting I find that even if you use it to write CSS it will increase your workflow & in time you will be more confident using it. Throw into the mix defining variables & mixins and its a real winner. I'm really impressed with Susy Grids http://susy.oddbird.net/ which Eric Meyer has contributed too..

 

Theyre existing CSS frameworks that are a good starting point, Blueprint http://www.blueprintcss.org/ & 960 http://960.gs/ spring to mind but I have found that even then they're are bloated.

 

I do feel that after a break from this forum for a couple of years have been promoting SASS but its really is worthwhile at least try.

 

The beauty is that you can even begin creating your own customised framework & tweak it per project

 

Try using scoupapp at first (its cross platform as I dont know what platform you use) to compile your files, again even it is just to use a one color variable for example, it will make your life easier.

 

Having checked out scoutapp then perhaps upgrade to CodeKit if you are on a Mac.

 

There was an interesting video tut on using SASS that made everything look so easy (well I thought it was interesting anyways), I'll try dig it out for you

 

Edit: The whole series which hasnt finished yet AFAIK starts here http://codeboxers.com/woodsman-theme-development-screencast-part-1/

Edited April 3, 201313 yr by nellyshark