What's up with all these CSS frameworks and others? [closed]
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this questionI'm digging into the world of CSS and I'm having some difficulties understanding the use of everything that exists.
There is LESS, SASS, Compass, Blueprint, HAML, e开发者_JS百科tc. Which ones should I use together? Can someone explain what goes with each other?
LESS and SASS are server-side CSS generation frameworks -- they allow you to create stylesheets using syntax that is close to CSS, but allows you to use items like variables and functions. Compiling these files will then generate a CSS file that you use. An important thing to note here is that SASS is only available for Ruby.
HAML is another item that is only available for Ruby, but doesn't do CSS. It's actually an alternate to creating ERBs (a Ruby partial view).
Compass is a library that is added on top of the SASS framework, allowing a bit more functionality and several default classes / styles.
Blueprint is another library that is basically a CSS file with preset classes, allowing for common use-cases like creating multi-column layouts.
However, none of these are needed to write CSS, and for the most part, aren't even good enough to really look into yet. While I love the functionality of SASS, it's really not for everyone, and ends up creating more bloated CSS than necessary.
If you're just starting to experiment with CSS, I would recommend resources like Transcending CSS and Hardboiled Web Design by Andy Clarke. HTML5 for Web Designers and CSS3 for Web Designers are also both pretty good resources. A good understanding of HTML markup and semantics are also important for taking advantage of CSS and using it correctly.
HAML and SASS go together, HAML is a shortcut language for writing HTML, SASS (or SCSS) is a shortcut language for writing CSS you have to know how to write both HTML/CSS "longhand" in order to get the best out of the HAML/SASS shortcut versions.
The shortcuts should only be used in DEV, unless you have a RUBY server - I get really annoyed when I see that both of the above languages are a "replacement" for "dumb" languages.. In particular all you have to search for is that "CSS is Dumb" to find references to SASS/SCSS - it's a vicious linkbait ploy ;) you cannot use one without knowing the other
COMPASS is a Ruby Gem that aids in the compilation of HAML and SASS/SCSS (to HTML and CSS) in a local environment - in a development environment it means that changes made via those languages will be compiled to "proper" HTML and CSS serverside on an appropriate server
LESS is a javascript equivalent of SASS. You can use it on the server-side (via node.js) or clientside(by just importing a js file) it takes the short cuts you write and compiles it into valid CSS (with multi browser or vendor extensions)
BLUEPRINT is a Framework that can be used with plain CSS or shortcut (disclaimer: I don't like frameworks as they add unnecessary classes) If you want to use the Blueprint or Yahoo Grids Framework within Compass/SaSS/LESS then you'd better understand what they're doing first before blaming the tools which try to make their implementation easier - These tools do not make these Frameworks work, they will however make the amount of typing you have to do decrease if you really want to use them.
I recently tried LESS/SaSS and SCSS.. I like them but then I know how to write the CSS in the first place I don't want them to do more than become a tool to make my life easier.. they don't "do" CSS better than CSS can do already, they can however do nesting and organization of your CSS, which I really like!
You really shouldn't use any of these 'languages' or 'tools' for any reason. They present themselves as shortcuts for multi-browser or parameterized css generators, which is a nice idea, but in the end these things can be achieved many other ways very elegantly using plain old CSS.
They should not be a replacement for using plain old CSS, and the bloat that they can generate prevents that possibility in many cases.
A very compelling reason to NOT use these things is that it raises the install requirements significantly for any developer joining a project, or a developer wanting to move from one machine to another, or a team of developers needing their machines to homogenize in order to contribute. For instance, requiring the installation of ruby, or various python versions, or php stubs to dynamically compile css based on timestamps, etc., all change a tool like SASS, which wants to make things simpler, into a potentially very complicated thing.
With the promise of CSS3, a lot of the things these tools hope to facilitate will become obsolete.
Using SASS + Compass + Suzy has been the biggest breath of fresh air for my web development workflow in a long time. Styling a beautiful fluid / elastic / fixed custom grid layout with these tools is incredibly fast. I only wish I knew about them sooner.
CleverCSS is a Python program that is nearly identical to SASS from what I can tell, although you can't do @import with CleverCSS. Also SASS doesn't have a semicolon after each CSS selector, just CSS properties, while CleverCSS has semicolons before both (which makes it a little more syntactically inferior IMO).
This article is good to check out if you're a Django / Python person. You won't feel dirty if you decide to use SASS rather than CleverCSS or others. Just suck it up and install Ruby and setup SASS / Compass to watch a folder and autogenerate your CSS on saving .sass files. Just don't mess with the generated CSS files if you want to save your changes. No further "integration" with your otherwise all-Python setup is needed.
加载中,请稍侯......
精彩评论