Zen Wireframe v3.0 Released!

Friday, June 26, 2009

By: Gregory Remington

Zen Wireframe v3.0 introduces the 960 Grid System CSS framework, Superfish v1.4.8 jQuery menu plugin and SEO friendly graphical headers. View Demo.

The 960 Grid System is an effort to streamline and standardize web development workflow by providing commonly used dimensions, based on a width of 960 pixels. The system can be used for rapid prototyping, production environments and providing a standardized and well documented code base for future development.

For more information about the 960 Grid System, demos and templates, please visit these links.

Superfish is an enhanced Suckerfish-style menu jQuery plugin that takes an existing pure CSS drop-down menu and adds the following much-sought-after enhancements:

Suckerfish-style hover support for IE6.
Timed delay on mouseout
Animation of sub-menu (fade-in by default).
Keyboard accessibility.
Supports the hoverIntent plugin.

For more information, please visit users.tpg.com.au/j_birch/plugins/superfish/ For a complete list of changes please see the ChangeLog.

In addition, 4 SEO friendly graphical header styles using GIFBUILDER have been added. You can add additional graphic headers in TSconfig. Styling the headers (TrueType font, size, effects, etc.) are done in a new basis TypoScript template called + SEO Graphic Headers on page ID=1.

   # Graphic Header Styles
   #######################################
   #TCEFORM.tt_content.header_layout.removeItems = 1,2,3,4,5
   TCEFORM.tt_content.header_layout.addItems.6 = Graphic Header 1
   TCEFORM.tt_content.header_layout.addItems.7 = Graphic Header 2
   TCEFORM.tt_content.header_layout.addItems.8 = Graphic Header 3
   TCEFORM.tt_content.header_layout.addItems.9 = Graphic Header 4

The TypoScript located in the root page (ID=1) have been broken down into additional basis templates for better organization and to make TypoScript subparts markers easier to identify in the 960 CSS Grid HTML templates 1column.html, 2column-style1.html, 2column-style1.html, 2column-style3.html, 3column.html.

   + Header Graphic
   + Search Form
   + Member Links
   + Breadcrumb Menu
   + Print Link
   + Tip a Friend
   + Copyright Links
   + Footer Menu

People have asked me why I chose the 960 CSS Grid Framework over the Blueprint CSS Framework. The truth is, I only had time to implement one of the frameworks so I chose the easiest and fastest! A Zen Wireframe Blueprint CSS is planned as well.

Both 960 and Blueprint CSS Frameworks have various advantages and like the Superfish jQuery menu, are licensed under dual GPL and MIT licences. This means we can mix and repackage features like Blueprint's CSS Typography for 960 and vice-versa.

Zen Wireframe has also changed licensing for it's files from Creative Commons Attribution-ShareAlike 3.0 to dual MIT and GPL licenses
www.opensource.org/licenses/mit-license.php
www.gnu.org/licenses/gpl.html

If you require commercial support, training and/or development, please contact any of us for availability. Thank you for your continued support and enjoy!

Gregory Remington
Mediatech Consulting, Inc.
support(at)mediatech.net
Phone : +1 (760) 525-1770 . Fax: +1 (760) 542-1990
--------------------------------------------------------------------------------

Back to Mediatech News