Yahoo! UI and DP Libraries Updated

Share this article

Yahoo! has announced the first updates to the Yahoo! UI Library and the Yahoo! Design Patterns Library (see JavaScript Libraries and Patters: Yahoo! Does AJAX).

As expected, the update to the Yahoo! UI Library introduces a handful of new JavaScript-powered user interface components. Most notably, the library now includes components for generating mouse- and keyboard-accessible hierarchical menu systems based on semantically-correct unordered lists in the HTML code.

More unexpectedly, the UI library now includes some valuable CSS code in addition to the JavaScript wizardry. CSS Reset smooths out the many differences between the default styles applied to HTML elements in current browsers, thereby providing a common baseline for you to apply your own styles to. CSS Fonts provides predefined font family groups and font sizes that work reliably and consistently across current platforms.

Finally, and this is a big one, CSS Page Grids drastically simplifies the task of CSS page layout by offering a set of seven reusable, stretchy, two-column page layout templates with headers and footers. Each column can be further divided into vertically stacked sets of sub-columns using <div>s with a set of predefined grid classes for various percentage widths.

Although Yahoo! does not provide any, it would be very practical to produce pluggable style sheets to apply visual formatting to the page layouts produced using CSS Page Grids. If this layout technique gains traction, I would expect a site skinning community (if not a commercial market) to spring up around such styles. This approach to laying out pages is also readily toolable, and supporting them is the next logical step for WYSIWYG design tools like Dreamweaver.

Even more unexpectedly, Yahoo! has open-sourced the development of the Yahoo! UI library by placing it on SourceForge, where developers will be able to report bugs and obtain minor updates and fixes between major releases of the library. Yahoo! will not as yet be accepting community-contributed patches or managing mailing lists via SourceForge, but will continue to use the ydn-javascript Yahoo! Group for these purposes.

The update to the Yahoo! Design Pattern Library has vastly expanded it, roughly doubling the number of design patterns it contains. Most of the new patterns are grouped under Invitations (ways of signalling the presence of an interactive feature) and Transitions (ways of signalling a change in the application state).

Community initiatives like WebPatterns are moving at a glacial pace to ensure that everyone gets their say in defining the language of web design. Meanwhile, Yahoo! has thrown caution to the wind with the Yahoo! Design Pattern Library, and looks set to define the de facto standard in Web patterns before WebPatterns and its ilk even get off the ground.

Kevin YankKevin Yank
View Author

Kevin Yank is an accomplished web developer, speaker, trainer and author of Build Your Own Database Driven Website Using PHP & MySQL and Co-Author of Simply JavaScript and Everything You Know About CSS is Wrong! Kevin loves to share his wealth of knowledge and it didn't stop at books, he's also the course instructor to 3 online courses in web development. Currently Kevin is the Director of Front End Engineering at Culture Amp.

Share this article
Read Next
Get the freshest news and resources for developers, designers and digital creators in your inbox each week
Loading form