I’m pleased to announce a preview release of Blueprint Layout Tool 0.4. This version marks the migration of BLT to its own site at http://www.blueprintlayouttool.com and a focus on dramatic improvements to the source view. Unfortunately, the current development version only supports Firefox, IE, Opera & Safari support will be coming soon.

Key Features:

• Improvements to style and polish of the interface
• Dramatic improvements to source view (Powered by CodePress & PHPTidy)
  • Generated Source is well formatted and polished
  • Generated Source is Syntax Highlighted
  • Generated Source is cleaned of most extraneous markup

Known Issues:

• Source View does not work in Safari and Opera
• Formatting is off in IE
• Generated source contains several Mozilla specific tags that still need to be cleaned.

I would also like to take a few moments and draw your attention to Christian Montoya’s Blueprint Constructor application. He takes a different approach to the interface and design of the Layout Tool and has created something quite useful and fun to use. We will be working together to try and achieve similar conventions between our apps.

Check out Constructor at http://lab.christianmontoya.com/construct/

You can read about his design process on his blog at http://www.christianmontoya.com/2007/12/08/construct-01-alpha/

Today I’m pleased to announce the release of SilkSprite 2.0.  Everything about SilkSprite stays the same but the decompressed file size drops by an astounding 46%.

Key Improvements

• 11% decrease in size for sprite.css
• 50% decrease in size for sprites.png

My special thanks go out to Andrew France for achieving such amazing compression of the png file.

You can find the new version here:

http://www.ajaxbestiary.com/Labs/SilkSprite/ 

Stu Nicolls released this excellent CSS menu.  It’s javascript free and provides incredibly rich interaction for something solely CSS based.

Check it out here: http://www.cssplay.co.uk/menus/pro_drop6#nogo53 

I’ve posted a bug fix release to the Layout Tool.

Changes:

• Dramatic improvements to selecting
• Fixed script error for IE 7.

Known Issues:

There are still major issues with IE 7 and it doesn’t work well in IE 6 yet.  If anyone has a clue why the color of the div gets progressively darker in IE 7, I’d appreciate it.

You can testdrive the new version at:

http://www.ajaxbestiary.com/Labs/BLT2/index.htm

Today, I’m proud to announce the release of SilkSprite a CSS Sprite plugin for Blueprint based on the widely used Silk Icons.

Benefits

• 1000 icons compressed into 1 file
• Entire Plugin is only 3 files
• Easy to use

Usage

• Place this directory inside blueprint/plugins
• Add this line to “blueprint/screen.css”,
  • @import ‘plugins/silksprite/sprite.css’;
• Use the sprites by attaching classes ss_sprite & ss_(name of sprite) to an a, span or div element. You can use test.htm as a key to the names of sprites.
• example:

  <span class="ss_sprite
  ss_add"> </span><br />

Credit

• Silk Sprite is Based on the Silk Icon Set by Mark James [famfamfam.com]
• Compiled & Adapted for Blueprint by Don Albrecht [ajaxbestiary.com]

Check it out online here:

http://www.ajaxbestiary.com/Labs/SilkSprite/

When I first started using CSS frameworks & standardized resets to streamline my web development, I adopted a process that I’m sure is familiar to many of you.  I would first link to the frameworks CSS files and then link to a project specific stylesheet.  The project specific stylesheet would build on the frameworks foundation to provide color & background data, special classes and all the other bits and bobs unique to the design.

For me, this system worked quite well.  I gained the benefit of the frameworks without excessive overhead and while I was no longer coding my CSS from the ground up, the process was surprisingly smooth.  When I first heard about plugins, I really didn’t see the point of adopting them.  They seemed an arbitrary way to include functionality that really belonged in the project stylesheet.  A recent project, however, completely changed my mind.  I was working with a client on a site that required support for several different templates (holiday sale, investor relations, technical support, etc).  While many of these sections employed radically different looks, they needed to be consistent in terms of typography, form elements, tooltips, etc.  They also needed support for seasonal theming as much of their marketing was holiday & special event oriented.

Suddenly, the plugins systems made sense.  I built a single plugin for all site wide styling and a second plugin to allow for seasonal color schemes (simply upload a different folder to the same location and you can change the colorscheme site wide).  Once I realized the power of plugins for complex projects, the realm of uses has exploded for me.

Where I use CSS plugins:

• Site specific typography & branding
• Common form elements (error, required field, etc)
• turn on and off debugging styles (great for troubleshooting)
• My personal CSS widget toolkit ( pullquotes, notes, etc.)
• Custom Grid (Instead of replacing grid.css in blueprint, I may deploy a new grid as a plugin during development)
• CSS Sprites

Plugins are currently supported by Tripoli & Blueprint.

I’m curious who here has started working with plugins or some other formal, modular system for CSS.