Digital UK Design Blog

The internet is big, as as this illustration proves, it’s growing faster than the Solar System. It’s amazing when you put all these figures down in one place, it makes you feel quite inadequate in comparison. 210 billion daily emails is staggering, if I just try a little harder I’m sure I’ll be able to increase that to 211,000,000,000 emails. Simply leave your email below and we’ll get the ball rolling :)

A Day in the Internet
Created by Online Education

Boris has grids

What’s a CSS framework?

A CSS framework can help you achieve rapid development of websites, web apps and mashups. It eliminates repetitive tasks while prototyping designs by using a pre structured CSS/XHTML grid-based framework.

Main features of good CSS Framework is to:

1) Rapidly speed up our development time
2) Very small file size
3) Good documentation
4) A clean grid structure.

You will need a basic understanding of CSS to enable you to utilise the full potential of your chosen framework.

Frameworks currently available

960 CSS Framework

The 960 Grid System is an effort to streamline web development workflow by providing commonly used dimensions, based on a width of 960 pixels. There are two variants: 12 and 16 columns, which can be used separately or in tandem. The 960.css file itself is only 3.6 KB compressed.

960 framework

Tutorial: A Detailed Look at the 960 CSS Framework

Demo: Live Demo

Blueprint CSS Framework

Blueprint css framework

Blueprint is a CSS framework, which aims to cut down on your CSS development time. It gives you a solid CSS foundation to build your project on top of, with an easy-to-use grid, sensible typography, nice-looking forms and even a stylesheet for printing. One of its main feature is performing a mass reset of browser default styles, offering a methodology to use for customizable layout grids and most important is that all elements are override-able.

Tutorial: A Closer Look At the Blueprint CSS Framework

Demo: Live Demo

The jQuery UI CSS Framework

jQuery CSS Framework

jQuery UI includes a robust CSS Framework designed for building custom jQuery widgets. The framework includes classes that cover a wide array of common user interface needs, and can be manipulated using jQuery UI ThemeRoller. By building your UI components using the jQuery UI CSS Framework, you will be adopting shared markup conventions and allowing for ease of code integration across the plugin community at large.

Tutorial: jQuery UI CSS framework

Demo: Live Demo

YAML

YAML

Yaml (Yet Another Multicolumn Layout) focused on flexible layouts and offers column and grid based design elements for flexible, elastic or fixed layouts. You will need a license to use it.

Demo

Yahoo YUI Grids CSS

Yahoo CSS Framework

The foundational YUI Grids CSS offers four preset page widths, six preset templates, and the ability to stack and nest subdivided regions of two, three, or four columns. The 4kb file provides over 1000 page layout combinations. Features include: Self-clearing footer, customization of width for fixed-width layouts, Supports fluid-width (100%) layouts and more.

Demo

Articles explaining CSS Frameworks

What’s not to love about CSS frameworks?
CSS Frameworks + CSS Reset: Design From Scratch
What Are The Benefits of Using a CSS Framework?
Blueprint CSS Framework vs YUI Grids
Battle of the CSS Frameworks
The Lessons of CSS Frameworks
When to use CSS framework?

Illustration by Kevin Cornell from A List Apart

A List Apart, the original online magazine targeting ‘people who make websites’, is 10 years old. Jeffrey Zeldman, co-founder of A List Apart, has written an interesting article detailing the last 10 years for A List Apart, the history, the development and the future for the site. Ask any web developer and they would have heard of, and most probably used, A List Apart, I certainly have, so congratulations on the anniversary and all the best for the future, I’ll be following it’s progress.

Screenshot of A List Apart - for people who make websites

Screenshot of A List Apart - for people who build websites

Read the full article here: A List Apart: Ten Years

This evening I finally got round to implementing a new WordPress theme for piggynap.com. It wasn’t a full theme build this time but it still took up the best part of my evening. I’ll be interviewing the owner of piggynap.com over the next few days so watch this space.

©2006 - 2009 The Floating Frog