Practical Ecommerce

Frameworks For Web Designers

I’ve written previously about frameworks and how they help developers build web applications. For the most part, my praise of frameworks has been directed at those of us who develop web applications, such as coding up the Ruby, Perl, PHP or .Net scripts that make applications work. However, frameworks can also be used to help teams work together, as in the case of a graphic designer and a web application developer. I can say from experience that it is often difficult to get creative people from different disciplines to work effectively together. Enter the Blueprint CSS framework.

What is Blueprint CSS?

Blueprint CSS is a framework for visually styling web pages with Cascading Style Sheets. Rather than writing your own CSS for every website that you work on, Blueprint provides a foundation of CSS styles to work with and build upon. As CSS gets more advanced, and the shortcomings of web design are overcome, a framework like this can prevent problems, as well as give developers the tools to bring the designer’s vision to reality. Let’s take a look at some of the features of the Blueprint CSS framework to get an idea of how it can help.

To start, all browsers have default styles set for particular HTML elements. Consider the margins that appear by default between paragraphs, and you have an idea of what are called “default CSS styles” By clearing these defaults, Blueprint provides a “clean slate” to start working with. From there, Blueprint sets some basic typography rules, which is something that most websites ignore completely. For example, Blueprint sets the line height at 1.5 times the font height, which is a basic print rule for readability.

Layout Grid Helps Developers and Designers

Second, Blueprint provides a layout grid for creating CSS layouts. While this seems basic, the customizable grid allows a developer (or designer) to generate a grid that is tailored to his vision. The designer can then use that grid as a layout guide, and by sharing the grid CSS both the designer and developer can be on the same page. Considering that small tweaks to get a layout right can eat away a lot of valuable time, it’s refreshing that Blueprint provides a resource that both designers and developers can benefit from. Blueprint CSS is available for free.

Brian Getting
Brian Getting
Bio  |  RSS Feed


Get the Practical Ecommerce RSS feed

Comment ( 1 )

  1. Legacy User March 29, 2008 Reply

    In essence, frameworks save time and money. You get a base and you can customize it any way you want. That's the philosophy my company takes with our ecommerce framework–we give you a base, and with the right .NET developers at hand, you'll have what you need in a fraction of the time.

    Thanks for the Blueprint CSS suggestion. That's definitely useful for me =)

    Richly Chheuy
    http://ecommerce.mediachase.com

    — *Richly Chheuy*

Email Newsletter Signup

Sign up to receive EcommerceNotes, our acclaimed email newsletter.
And receive a free copy of our ebook
50 Great Ecommerce Ideas