Yahoo! Pattern and UI Libraries

· Coding

Yahoo! has really taken it to the next level in terms of reaching out to the developer community. As I mentioned earlier, there’s the new User Interface Blog and I coincidentally stumbled on the Graded Browser Support article around the same time.
Digging deeper I found the Design Pattern Library which Yahoo! defines as “an optimal solution to a common problem within a specific context”. The pattern library describes a problem and the best approach to undestanding and solving it.
Current examples include: auto-complete, breadcrumbs, drag and drop modules, module tabs, navigation tabs, object pagination, search pagination, object ratings, and writing a review.
The examples are sectioned into: when to use, the solution, the rationale, and accessibility. A sidebar includes links to related patterns, where Yahoo! has applied it to their own sites, a related blog article, and code examples.
Coupling the Pattern Libraries are the UI Libraries with in-depth examples and BSD-licensed code available for download.
These libraries are shaping up to be an essential resource for developers and designers alike!
Yahoo! Design Pattern Library
Yahoo! UI Library

Coding Comments are off for this post.

Graded Browser Support

· Coding

Nate Koechley, Senior Web Developer for Yahoo! has written an interesting (if a bit high-level) article on what he’s calling “graded browser support”. Instead of using the more commong “graceful degradation” approach, Nate looks at browser support using a graded system.
The system puts browsers into 3 seperate categories based on their distribution.
See the article for more information. The graded chart will make a lot more sense after reading it.
Yahoo! Developer Network: Graded Browser Support
Yahoo! Developer Network: Browser Grade Chart

Coding Comments are off for this post.

Greasemonkey gives the user more control over the UI

· Coding

Some interface designers may feel threatened by the idea of Greasemonkey scripts altering the intended look-and-feel of their web pages (at least in Firefox and Mozilla), but I like the idea of users getting more control over their experience (even if the scripts are brittle and sometimes hack-y), and in the best scenario I would imagine you could improve a site’s design by selectively adoping popular interface improvements.
Mark Pilgrim, the guru of Atom and Accessibility who wrote the Greasemonkey script Butler (which removes ads from Google results pages among other things) and the online tutorial Dive into Greasemonkey, has now written a book for O’Reilly called Greasemonkey Hacks:

More than just an essential collection of made-to-order Greasemonkey solutions, “Greasemonkey Hacks” (O’Reilly) provides complete, fully developed user scripts you can use to modify web pages, the tools to customize these scripts, and the guidance to develop your own scripts from scratch. You’ll learn how to:

  • Install, configure, and debug your first Greasemonkey script
  • Insert links into web pages, fix broken pop-up links, and follow links without clicking them
  • Beautify the Web by enhancing fonts, images, tooltips, lists, and tables
  • Intercept and modify web forms, generate developer reports, and debug Ajax web applications
  • Make search engines auto-complete your search terms, prefetch your
    results, and remember where you’ve been–without invading your privacy!
  • Add accessibility features that make sites easier to read and navigate
  • Download embedded movies, automate site registrations, and route around brain-dead browser sniffers
Coding Comments are off for this post.