Posts tagged framework

Blueprint: A CSS Framework

Blueprint

"Spend your time innovating, not replicating."

Blueprint is a CSS framework, which aims to cut down on your development time. It gives you a solid foundation to build your project on top of, with an easy-to-use grid, sensible typography, useful plugins, and even a stylesheet for printing.

Blueprint offers:

  • A CSS reset that eliminates the discrepancies across browsers.
  • A solid grid that can support the most complex of layouts.
  • Typography based on expert principles that predate the web.
  • Form styles for great looking user interfaces.
  • Print styles for making any webpage ready for paper.
  • Plugins for buttons, tabs and sprites.
  • Tools, editors, and templates for every step in your workflow.

Of course, Blueprint isn’t the only choice. It’s just the most popular, according to Google Trends:

keyword searches on Google

You may also be interested in 960 Grid System, or Yahoo! User Interface Library (YUI).

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading ... Loading ...

Compass: CSS Stylesheet Framework

Compass is a stylesheet authoring framework that makes your stylesheets and markup easier to build and maintain. With compass, you write your stylesheets in Sass instead of CSS. Using the power of Sass Mixins and the Compass community, you can apply battle-tested styles from frameworks like Blueprint to your stylesheets instead of your markup.

Compass

It’s a Ruby on Rails project. You run a CLI utility that watches a directory where your .css and .sass reside. The changes you make to your .sass files get automatically parsed and translated to .css files. The .sass format allows you to have a simplified less repetitive stylesheet markup, in addition to the ability to use variables, functions, mathematic operations, and more.

  • In CSS, ever wished you could store the color palette for your site design in a few variables and then just reference those variables through the stylesheet?
  • Ever wished you could perform cross-browser compatible mathematical addition on layout column widths?
  • Ever wished you could easily gather a library of commonly used CSS, and then selectively include them in your various designs with a single line?

Now you can, with Compass.

Installation on Debian/Ubuntu 9.10 Karmic is like:

sudo aptitude install ruby gem; # dependencies
sudo gem sources --add http://gems.github.com/
sudo gem install chriseppstein-compass; # install
sudo gem install chriseppstein-compass-960-plugin; #optional plugin
compass -f blueprint project; # example usage
compass -r ninesixty -f 960 project; # example plugin usage

Looks promising! See more detailed Compass install instructions.

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading ... Loading ...