Veröffentlicht am

A Closer Look at YUI 3.0 PR 1: Dav Glass’s Draggable Portal Example

A Closer Look at YUI 3.0 PR 1: Dav Glass’s Draggable Portal Example: „

YUI 3.0 Preview Release 1 was made available on Wednesday, and with it we provided a look at how the next major iteration of YUI is taking shape. Among the elements we shipped with the preview is a new example from Dav Glass, the Draggable Portal, which exercises a broad cross section of the preview’s contents.

The Portal Example in the YUI 3.0 preview release.

The Draggable Portal is a common design pattern in which content modules on the page can be repositioned, minimized, removed, and re-added to the page. The state of the modules persists in the background, so a reload of the page or a return to the page calls up the modules in their most recently positioned state. You see variations of this design pattern on many personlizable portals like My Yahoo, NetVibes, and iGoogle.

In this article, we’ll take a look under the hood of this example to get a richer sense of YUI’s 3.x codeline and the idioms and patterns it establishes. We’re just pulling out some specific code snippets to examine here, but you can review the full code source for this example — and for 66 others — on the YUI 3 website.

(more…)

(Via Yahoo! User Interface Blog.)

Veröffentlicht am

YUI 3.0 Preview Release 1

YUI 3.0 Preview Release 1: „

YUI 3.0 Preview 1 website.The YUI team is pleased to announce the public availability of YUI 3.0 Preview Release 1, an early look at what we’re working on for the next generation of the YUI Library. Documentation for YUI 3.0 is on the YUI website; the download is available on the YUI project area on SourceForge; you can find us with questions or comments on the YUI 3.x discussion forum. Keep in mind that this is an early preview, not a production-quality (or even a beta) release. This release is not suitable for production use, but it will give you an idea of what we’re working on, and it should provide a good framework for conversation about the future of the library.

Five Goals for YUI 3:

We’ve talked to thousands of YUI users over the past 30 months, and based on that feedback we’ve set five design goals for the next generation of the library. What you’ve told us is that YUI 3.0 should be:

  • lighter (less K-weight on the wire and on the page for most uses)
  • faster (fewer http requests, less code to write and compile, more efficient code)
  • more consistent (common naming, event signatures, and widget APIs throughout the library)
  • more powerful (do more with less implementation code)
  • more securable (safer and easier to expose to multiple developers working in the same environment; easier to run under systems like Caja or ADsafe)

With this early release, we’ve made progress toward most of these objectives — and we believe we have the right architecture in place to meet all five as we move to GA over the next few quarters.

What’s New in YUI 3.0?

When you start to write code using YUI 3.0, you’ll notice some changes in structure and style. Here’s a taste:

Snippet: What it does: 
YUI().use('node', function(Y) {
    Y.get('#demo').addClass('enabled');
});
Creates a YUI instance with the node module (and any dependencies) and adds the class ‚enabled‘ to the element with the id of ‚demo‘. 
YUI().use('dd-drag', function(Y) {
        var dd = new Y.DD.Drag({
        node: '#demo'
    });
});
 Creates an instance of YUI with basic drag functionality (a subset of the dd module), and makes the element with the id of ‚demo‘ draggable. 
Y.all('.demo').addClass('enabled');
 Adds the class ‚enabled‘ to the all elements with the className ‚demo‘. 
Y.all('.demo').set('title', 'Ready!').removeClass('disabled');
 Sets the title attribute of all elements with the className ‚demo‘ and removes the class ‚disabled‘ from each. 
Y.get('#demo').plug(Y.Plugin.Drag, {
    handles: 'h2'
});
 Adds the Drag plugin to the element with the id ‚demo‘, and enables all of its h2 children drag as handles. 
Y.on('click', function(e) {
    e.preventDefault();
    e.target.query('em').set('innerHTML', 'clicked');
}, '#demo a');
 Attaches a DOM event listener to all anchor elements that are children of the element with the id ‚demo‘. The event handler prevents the anchor from navigating and then sets a value for the innerHTML of the first em element of the clicked anchor.

What’s different here?

  • Sandboxing: Each YUI instance on the page can be self-contained, protected and limited (YUI().use()). This segregates it from other YUI instances, tailors the functionality to your specific needs, and lets different versions of YUI play nicely together.
  • Modularity: YUI 3 is architected to use smaller modular pieces, giving you fine-grained control over what functionality you put on the page. If you simply want to make something draggable, you can include the dd-drag submodule, which is a small subset of the Drag & Drop Utility.
  • Self-completing: As long as the basic YUI seed file is in place, you can make use of any functionality in the library. Tell YUI what modules you want to use, tie that to your implementation code, and YUI will bring in all necessary dependencies in a single HTTP request before executing your code.
  • Selectors: Elements are targeted using intuitive CSS selector idioms, making it easy to grab an element or a group of elements whenever you’re performing an operation.
  • Custom Events++: Custom Events are even more powerful in YUI 3.0, with support for bubbling, stopping propagation, assigning/preventing default behaviors, and more. In fact, the Custom Event engine provides a common interface for DOM and API events in YUI 3.0, creating a consistent idiom for all kinds of event-driven work.
  • Nodes and NodeLists: Element references in YUI 3.0 are mediated by Node and NodeList facades. Not only does this make implementation code more expressive (Y.Node.get('#main ul li').addClass('foo');), it makes it easier to normalize differences in browser behavior (Y.Node.get('#promo').setStyle('opacity', .5);).
  • Chaining: We’ve paid attention throughout the new architecture to the return values of methods and constructors, allowing for a more compressed chaining syntax in implementation code.

And that’s just the beginning. Dive into the examples to learn more and to see the preview release in action, including some hidden gems like full A-Grade cross-domain requests. Our resident metahacker Dav Glass created a nice multi-component example, the draggable portal, that will give you some sense of what’s included in today’s preview.

Is YUI 3.0 Backward Compatible with YUI 2.x?

No. YUI 3.0 builds off of the YUI 2.x codeline, but we’ve evolved most of the core APIs in working toward the five key goals described above. As a result, migrating from YUI 2.x to 3.x will require effort at the implementation level.

We know that ease-of-migration will be a critical factor for all YUI users. We’re taking two important steps to facilitate the transition as it arrives:

  • Limited compatibility layer: YUI 3.0 will ship with a limited compatibility layer for the current YUI Core (Yahoo Global Object, Dom Collection, and Event Utility). This will allow you to run many of your YUI 2.x-based implementations on top of YUI 3.0. We’re not shipping the compatibility layer with today’s preview, but you’ll see it appear in a future preview or beta release prior to GA.
  • Full parallel compatibility: YUI 3.0 can be run in parallel to YUI 2.x with no side effects for either version. If you choose to make the transition in stages, you can run the full 2.x stack and 3.x stack together as needed.

Even with these provisions in place, we know that an API change (along with new concepts and idioms) has a real cost for everyone involved. We’re convinced that this change is both necessary and worth the effort, and obviously we’re going to work hard to make the value proposition compelling.

What’s Next?

YUI 3.0 is a work in progress. The common widget framework for 3.0 is not included in this preview and we’re continuing to work on refinements to the core — including optimizations to the package structure to minimize base K-weight. We anticipate the next two releases coming up as follows:

  • October 2008 — PR2: Widget Framework, sample widgets, additional utilities.
  • December 2008 — Beta 1: Final mix of module structures, API completion, full complement of utilities.

We have some great stuff to share as we move further along in this process. We’ve never been more excited about YUI and its future — and we think YUI 3.0 will have a big role to play in that future.

(Via Yahoo! User Interface Blog.)

Veröffentlicht am

Screenshots mit diversen Browsern erstellen

Besonders für professionelle Web-Entwickler ist browsershots.org gedacht. Der Dienst macht auf Wunsch Screenshots einer Website mit einer Vielzahl unterschiedlicher Browser auf verschiedenen Systemen – und das zudem kostenlos.

Über 60 Browser stehen bei browsershots.org für den Test zur Auswahl. Optional kann man weitere Eckdaten bestimmen: die Bildschirmgröße, die Farbtiefe, ob JavaScript aktiviert ist und in welcher Version es vorliegt, ebenso ob Java und Flash vorhanden sind oder nicht. Standardmäßig sind die jeweils wichtigsten Browser der Plattformen markiert. Wer will kann per Klick alle Kandidaten von Linux, Windows oder Mac OS anwählen oder aber sich nach Rendering-Engine entscheiden und alle mit Gecko oder alle KHTML/WebKit-Browser nutzen.

Der Dienst ist kostenlos. Dafür hat man allerdings keinen Einfluss darauf, wie schnell die Screenshots zur Verfügung stehen. Wer 10 Euro bezahlt, wird hingegen einen Monat lang bevorzugt behandelt.

(Via hoemmerich.com)

Veröffentlicht am

Web Form Factory: Open Source Formular-Generator

Formulare ermöglichen einen direkten Kontakt zu den Besuchern einer Seite und erfragen zum Beispiel Daten für Newsletter, Kommentare und Adressen. Das Design ist schnell erledigt, doch ohne PHP-Kenntnisse wird daraus kein nützliches Formular. Wer gerade keinen PHP-Entwickler zur Hand hat, der kann auf die Web Form Factory zurückgreifen.
Web Form Factory: Open Source Generator für Formulare

Die Erstellung von Formularen für eine Webseite bleibt in aller Regel entsprechend geschulten Entwicklern vorbehalten. Die optische Gestaltung stellt für viele Publisher keine große Hürde dar, bei der Programmierung der Formulare sieht das schon anders aus. Hier sind spezielle Kenntnisse gefragt, um die Formulareingaben in einer Datenbank speichern oder per E-Mail versenden zu können.

Mit der Web Form Factory (WFF) gibt es jetzt eine Open-Source-Lösung zur Erstellung von Formularen für das Web. Die einfach zu bedienende Web-Applikation untersucht eine selbst erstellte HTML-Datei auf verwendete Eingabetypen wie Textfelder, Drop-Down-Listen, Checkboxen sowie Radio-Buttons und generiert daraus automatisch ein an PHP-gebundenes HTML-Formular. Das Ergebnis lässt sich dann in Form einer Zip-Datei herunterladen, auspacken und in die eigene Webseite integrieren.

WFF befindet sich derzeit im Beta-Stadium. Momentan wird nur die Anbindung von HTML-Dateien an PHP (wahlweise 4, 5 oder 5.1) unterstützt, was sich aber in naher Zukunft ändern soll. Außerdem ist die Erstellung eines E-Mail-Formulars möglich, bei dem die erhobenen Daten nicht in eine Datenbank fließen, sondern an eine E-Mail-Adresse geschickt werden.

Eine Hilfestellung für die Arbeit mit WFF inklusive der Erstellung der HTML-Datei bietet ein Einführungsvideo im Tutorial-Bereich.

via t3n

Veröffentlicht am

Implementation Focus: MiaCMS

Implementation Focus: MiaCMS:

Introduction: Chad Auld of the MiaCMS projectChad Auld is one of the principal developers of MiaCMS. MiaCMS is a relatively new open source project, but it’s starting out with a solid base from its roots in Mambo CMS. Chad spent about three years on the Mambo team in various roles including Lead Core Developer and Director on the Mambo Foundation Board; he was a member of the Mambo Steering Committee prior to retiring in February of 2008. Recently, Chad joined with other core Mambo developers to create MiaCMS which is now on its second release. Chad’s role on the MiaCMS team for the first two releases has been to help with the rebranding efforts, build the default WYSIWYG editors, implement the YUI Library, build a REST API for content access, and develop enhanced charting for general CMS statistics and poll results.

How does MiaCMS differentiate itself from other CMS projects out there? Why would someone choose MiaCMS over Drupal or Joomla or other well-known apps in this space?

Yes, there are quite a few content management systems to compete with. Luckily we aren’t really new to the game. Our team contributed toward making Mambo the CMS it is today. We will continue building on that same award-winning base with MiaCMS. (As a side note, it’s worth pointing out that Joomla was also initially based on Mambo about three years ago.)

Some of our current features are:

  • Simple Installation
  • WYSIWYG Content Editors
  • RSS Content Syndication
  • Powerful/Extensible 3rd Party Extension System
  • Flexible Site Theming Capabilities
  • Site Search
  • Sitemap Generation
  • REST Enabled Content & Statistics
  • User Management
  • Multilingual Core

MiaCMS will differentiate itself by making standard content management operations even easier and more flexible than they have been in the past. We will cleanup much of the old legacy code and enhance the extensions interface to simplify custom 3rd party extension development. With the 4.7 release the team will drop support for PHP4 to take advantage of the object-oriented capabilities of PHP5. The team plans to continue building close ties to the community and listening to their feedback. The next few releases will focus on building out many of the wishlist items we have already received from the community.

At some point, you and the development team made the decision to build YUI into MiaCMS. What were the factors that guided your decision?

YUI Menu and TabView on MiaCMS.

We based our decision on a number of important factors; maturity, browser support, documentation, support community, functionality, and flexibility. YUI has a large selection of time-tested components and continues to make valuable additions with each release. For us it is important that the selected framework continue maturing and growing right along side of us. We didn’t want to add yet another library to the system and so it was important to be able to replace existing parts of the CMS with canned components and/or have the flexibility to hook into the framework and use it as a building block for custom components. The YUI documentation is first-class. In fact, it represents some of the best documentation I’ve come across for an open source project. Between the user guides, cheatsheets, api browser, examples, and developer videos, you have just about everything you could ask for. Of course, sometimes documents just aren’t enough. Luckily, we’ve found the YUI support group to be a good place to find additional answers. Last but not least is the topic of browser support. While we’d love to support every browser in existence, it simply isn’t possible. But we do our best to test and code for as many as we can. We think Yahoo! has taken the right approach with its Graded Browser Support model.

What components of YUI are used in Mia?

We are currently utilizing the Reset–Fonts–Grids CSS, Dom Collection, Event Utility, Tabview Control, Button Control, Color Picker Control, Rich Text Editor, Animation Utility, Element Utility, Container Family, and Menu Control. Our production releases also make use of the YUI Compressor which we have integrated with our ANT packager to compress all the CSS and JavaScript in the system. The entire YUI library is included in the system so we are hoping our 3rd party developer community will make use of the library as well. Each custom component comes with its own set of unique requirements and we are confident that YUI can meet their needs, help improve their extensions, and reduce the number of 3rd party libraries the system must carry. In the last release we also build a dynamic loader into the system which allows MiaCMS users to decide between serving files from the local YUI library and serving them from the Yahoo hosting service for the advantages its CDN can bring.

YUI Rich Text Editor on MiaCMS.

Where do you see opportunities for deeper YUI integration with MiaCMS in the months ahead?

We’ve still got a lot more planned for YUI. Mia is carrying a fair amount of legacy JavaScript code in the system since its Mambo base was started about 7 years ago. We’ll be rewriting a good chunk of the JavaScript in Mia over the next few releases and utilizing YUI where possible. Users can expect a drastic reduction in inline JavaScript. We also plan to move away from older styles of event handling like coding individual onclick/onmouseover events and instead rely on the YUI Event Utility to subscribe to DOM events and help us create custom events with the application. Future releases will make heavy use of the YUI Dom Collection as well as the Event and Selector utilities.

In addition to the custom JavaScript found in the CMS there are also a number of external JavaScript libraries included to handle specific functions like tooltips, menus, calendaring, etc. A goal for the project will be to reduce the number of external dependencies and rely on YUI where possible. Two such replacements have already been almost fully implemented within the CMS core and we have started to encourage our 3rd party developers to make the switch as well with their custom extensions. In past releases the menu system relied on JSCookMenu and all tabs within the system relied on WebFX Tab Pane. JSCookMenu has now been fully replaced with the YUI Menu Control and the WebFX Tab Pane conversion to YUI TabView is about 98% complete. We are currently in the process of replacing overLib tooltips with the YUI Tooltip Control. We will also soon replace ‘The DHTML Calendar’ with the YUI Calendar Control. It would also be pretty safe to say you’ll eventually find ContextMenus, TreeView, DataSource, DataTable, Connection Manager, and JSON being used within MiaCMS. We recently selected Open Flash Charts, but as the YUI Charts Control matures and evolves out of an experimental state that may also find it’s way into Mia.

Having developed a complex application implementing YUI, what are your thoughts on the state of YUI as a toolkit? What’s working super well at this point? What weaknesses are you hoping the YUI team will address?

YUI is a feature-rich, well designed, state of the art toolkit. The available components cover a wide variety of the common tasks needed for web application development. We have had great success integrating YUI deeply into the MiaCMS core which we will continue to do with each passing release. The community feedback on the YUI-related changes has been very positive so far. Support for the major browsers is top-notch, the components degrade nicely, and performance is solid. Tools like the YUI Compressor and YSlow are also key in helping us take performance to the next level.

Nothing much to complain about. Overall we have been very happy with our selection of the YUI Library. One of the things I really like about jQuery is the powerful CSS style selectors. I am really looking forward to the YUI Selector Utility coming out of beta. We’ll probably start making heavy use of it even before then, but obviously the more stable it is the better. I also see a lot of potential for the experimental Charts component so I’d like to see it polished up with its functionality being continually expanded as well.

What are the next big frontiers for the MiaCMS project as a whole?

Below is the list of roadmap items in no particular order. Some are already being worked on, some are almost complete, and others are in the planning stages.

  • Improved ACL’s (User/Group Permissions)
  • Database Portability
  • LDAP Support
  • OpenID
  • Dublin Core Metadata
  • OAuth
  • N-Level Content Organization (remove the two tier section/category limitation)
  • Content Versioning
  • Multilingual Content Management
  • Writeable REST Interface
  • Multi-Site Management
  • Improved File & Image Management

(Via Yahoo! User Interface Blog.)

Veröffentlicht am

YUI 2.5.0 Released — Big upgrades to DataTable, new Layout Manager, Flickr-style multi-file Uploader, and more

YUI 2.5.0 Released — Big upgrades to DataTable, new Layout Manager, Flickr-style multi-file Uploader, and more: „

The YUI Team just released version 2.5.0 of the library. We’ve added six new components — Layout Manager, Uploader (multi-file upload engine combining Flash and JavaScript), Resize Utility, ImageCropper, Cookie Utility and a ProfilerViewer Control that works in tandem with the YUI Profiler. This release also contains major improvements to the DataTable Control and new Dual-Thumb Slider functionality in the Slider Control. Here are the highlights:

  • DataTable Control: Jenny Han Donnelly has been joined by Luke Smith for this development cycle, and we’re all thrilled with what they’ve produced. DataTable in 2.5.0 gets a more robust markup structure that allows greater control over all aspects of the table. This release also includes major performance enhancements, improvements to the fixed-header implementation for vertical scrolling, built-in support for horizontal scrollling, an all-new Paginator class, support for drag-and-drop column reordering, and a new set of column APIs with hooks for showing, hiding, adding and removing columns.
    The DataTable and its new show/hide column interface.
    DataTable has been one of YUI’s most popular and important components since its debut, and this is its strongest release yet. If you have existing DataTable implementations that you want to upgrade, take a look at the new User’s Guide, as it has some detailed notes about API changes. The DataTable examples roster is another nice place to check out the new code in action.
  • The YUI Layout ManagerLayout Manager: Dav Glass has a lot for you to enjoy in 2.5.0, but top billing goes to his new Layout Manager. Layout Manager eases development of multipane UIs that take up either the full viewport or the full canvas of any block-level element. Layout Units within a layout are resizeable, collapsible, removable and swappable; transitions between expanded and collapsed states have built-in animation support. Whether you’re creating a full-screen application like Yahoo! Mail or a rich multi-pane pop-up, Layout Manager is a great place to start.
  • Uploader: If you’ve ever built a UI for uploading files via a browser, you know what the big pain points are: One file at a time, no easy way to track upload progress, no programmatic access to file metadata, etc. The new YUI Uploader addresses these issues and others, allowing for the creation of more powerful, intuitive, and responsive file upload experiences. Allen Rabinovich of the ASTRA Library team did the legwork on this one, and it’s the same code that underlies the Flickr Uploader. Uploader is our second JavaScript/Flash hybrid control (following on the heels of the Charts Control in 2.4.0).
    The YUI Uploader is the same code that drives Flickr's multi-file photo uploading interface.
  • Resize Utility: Layout Manager is built upon a new YUI utility, Resize. Dav’s Resize Utility formalizes the support that YUI Drag & Drop has long provided in example form and makes it easier for you to make any block-level element resizeable. Resizing can be implemented directly (the resized element resizes in real time during the interaction) or by proxy (a proxy element visualizes the interaction until its conclusion, at which time the resized element snaps to its new size).
  • The YUI ImageCropper ControlImageCropper Control: The Resize Utility makes a lot of things easier — and one of those is the implementation of an ImageCropper interface, which Dav built out on top of Resize for 2.5.0. Take a look at the examples and be sure to check out the support Dav provided for modifier keys in this very desktop-like UI control.
  • Cookie Utility: When he’s not busy writing books or working on My Yahoo!, Nicholas C. Zakas is cranking out new code for YUI. In 2.5.0, he contributes the Cookie Utility, a simple but powerful component that helps you get maximum mileage out of your limited cookie space. Because browsers limit the number of cookies you can set per domain (and because that limitation can sneak up on you if you manage a large site with many subdomains), the Cookie Utility supports ’sub-cookies.‘ Sub-cookies pack multiple name-value pairs under the umbrella of a single cookie, expanding the number of data points that you can store in cookie space.
  • ProfilerViewer Control: 2.4.0 saw the release of Nicholas’s Profiler, a headless, cross-browser kit for profiling JavaScript functions. To make it easier to access and interpret the data that Profiler collects, we’ve added a ProfilerViewer Control in 2.5.0 that sits on top of Profiler and visulizes its accrued data. ProfilerViewer leverages the Charts Control and the DataTable Control. Taken together, Profiler and ProfilerViewer provide another arrow in the development quiver that includes tools like Firebug’s integrated profiling interface.

    The ProfilerViewer interface.

  • The YUI Slider Control now has dual-thumb support.Slider Control with Dual Thumb Support: Supporting dual-thumb interactions in our Slider Control has been on our list for awhile, and Luke took the opportunity to get this out to you in 2.5.0. Sliders are ‘finite range controls’; dual-thumb sliders allow you specify a sub-range within the control’s larger range. The classic use case for dual-thumb sliders is on shopping sites, where such controls can allow users to filter results based on price range. Check out the User’s Guide, example, and the new Slider Cheatsheet (which has a second page dedicated to dual-thumb implementations).
  • We’re using this release to promote the following components from beta to GA status: ColorPicker Control, Get Utility (for cross-domain, dynamic loading of script and CSS files), JSON Utility, ImageLoader Utility, and YUI Test Utility. These promotions reflect the maturity of those components and their very low bug traffic. As always, we’re releasing all new-for-2.5.0 components under the beta moniker, and we’re looking forward to your feedback on those once you get a chance to try them out.
  • Full details on the release, including a rollup of the changelog for all components and a bug/feature manifest, are available in Georgiann Puckett’s update to the YUI developer forum this morning.

One More Thing…

YUI now ships with more than 270 examples, many of which are accompanied by full tutorials to help you get started using YUI. And while individual examples are good, we’ve gotten a number of requests to create an über example, one that pulls in and makes use of a wide range of YUI components in a single sample application — while still being YUI-centric and not littered with noisy implementation logic.

The incomparably prolific Dav Glass rose to the challenge for 2.5.0 with a complex, multi-component example that uses Layout Manager as its basis and Yahoo Mail as its inspiration.

Dav Glass's multi-module YUI application example.

Let’s Celebrate!

We’re excited to get 2.5.0 out the door and, as luck would have it, we’ve got a fantastic excuse to celebrate. YUI’s (and the Yahoo Pattern Library’s) second anniversary party is coming up next week (February 26, 5 p.m., Sunnyvale), and we’d love to have you join us. Sign up on Upcoming to let us know you’ll be stopping by at Yahoo! HQ for some beer and general revelry. We look forward to showing off some of the stuff you all have been doing with YUI in the past two years and we’ll talk a bit about where Patterns and YUI are headed from here.

(Via Yahoo! User Interface Blog.)

Veröffentlicht am

Generating and Validating Web Forms With PEAR HTML_QuickForm

Generating and Validating Web Forms With PEAR HTML_QuickForm: „This article will introduce you to one of PEAR’s most powerful tools for generating Web forms and validating the input that arrives through them: the HTML_QuickForm package. This package provides a flexible, reusable library of methods that can literally save you hours of time when dealing with form-based user input – and best of all, it’s free and extremely easy to use.

(Via Zend Developer Zone.)

Veröffentlicht am

Helvectica on OS X (Leopard)

Preparing for Leopard: Helvetica is Dead.

„HelveticaGrave.pngOBITUARY: After a prolonged battle with Mac OS X, Helvetica — along with younger cousin Helvetica Neue — was finally pronounced dead on October 28, 2007 with the release of Leopard, by Apple, in California.“ von CreativeTechs

Grading the New Font „Features“ in OS X Leopard

„Leopard’s New Font Features: Apple announced a October 26 release date for Mac OS X Leopard (10.5) today, along with more detailed information on the new system, including over “300 New Features”. Let’s look a little closer at the features in the Fonts category and give them snarky grades based on their potential value.“

von Typographica

Veröffentlicht am

Online-Lexikon für Website-Elemente

Online-Lexikon für Website-Elemente: „Die Pattern-Library des holländischen Web-Designers Martijn van Welie eignet sich wunderbar zur Weiterbildung wie auch zur Mediation. Wenn also ein Auftraggeber behauptet, der Designer habe ihm statt eines Navigation Trees ein Accordion geliefert … die Patter-Library erklärt den Unterschied in Wort und Bild und verweist auf interaktive Quellen. Das Nachschlagwerk bietet die Kapitel: Navigation, Suche, Shopping, Personalisierung, Feedback, Seitenarten und vieles mehr. (Via Swissmiss)“

(Via Fontblog.)

Veröffentlicht am

YUI 2.3.0: Six New Components and a Prettier Face

YUI 2.3.0: Six New Components and a Prettier Face: „

YUI 2.3.0 is now available as a download from SourceForge.We’re pleased to announce today the release of YUI version 2.3.0. This release features six new additions to the library as well as a new skinning architecture and a new visual treatment for most of our UI controls. All of this, plus 250 enhancements and bug fixes, is available for download immediately.

Here’s what’s new to YUI in version 2.3.0:

  1. Rich Text Editor (beta): YUI developer Dav Glass brings you the new YUI RTE, featuring rich-text editing with robust A-Grade browser support. Cross-browser support has always been a major challenge for RTEs, and we think you’ll be impressed with how well this editor works across the various environments. You can instantiate it with just a few lines of code for simple implementations, and when you need to go beyond the ordinary it’s easy to extend the RTE’s Toolbar with your own custom buttons.
    Try out the YUI RTE with a custom Flickr photo extension.
  2. Base CSS: Nate Koechley continues to extend and refine the YUI CSS foundation, which now includes four members — Reset CSS neutralizes browser CSS treatments; the new Base CSS applies some consistent and common style treatments that many developers use as a foundation; Fonts CSS provides a foundation for typography; and Grids CSS delivers CSS-driven wireframes for thousands of potential page designs.
  3. YUILoader Utility (beta): YUI’s most prolific author Adam Moore has contributed the new YUILoader Utility, a mechanism for loading YUI components (and/or your own custom components) on the page via client-side script. YUILoader knows all about YUI’s dependency tree and introduces into the page only those files that are needed to support your desired components. It can load files from Yahoo! servers or from your own hosted location.
  4. ImageLoader Utility (experimental): Yahoo! Travel engineer Matt Mlinac authored the new YUI ImageLoader Utility, which allows you to defer the loading of some images to speed initial rendering time on your pages. If you suspect that you’re serving a lot of images that are never actually seen by your users, you’ll want to check out Matt’s work on this clever utility.
  5. Color Picker Control (beta): Adam Moore built the new YUI Color Picker Control on top of his own Slider Control. The Color Picker provides a powerful UI widget for color selection, featuring HSV, RGB, and Hex input/output and a web-safe color-selection swatch.
  6. YUI Test Utility (beta): Nicholas C. Zakas, who works on My Yahoo! when he’s not writing books or blogging on YUIBlog, authored our new YUI Test Utility. YUI Test introduces a flexible unit-testing framework for the YUI ecosystem and serves as the foundation for our own unit-test battery.

YUI Shows Some Skin

The new YUI Sam Skin.YUI components have always been receptive to implementation-specific styling, but with 2.3.0 we’ve moved to a more formal skinning approach that helps to separate core CSS definitions from purely presentational ones. YUI’s support for skinning makes it easier for you to implement your own design on top of, say, the TabView Control — and it makes it easier to share that skin with others in the community.

In concert with that effort, Yahoo! designer Sam Lind pitched in over the past several months to help us create an attractive, consistent visual treatment for the many UI controls in YUI that ship with a default look-and-feel. This baseline skin is much more stylish than what we’ve shipped in the past; many thanks to Sam for his hard work. In his honor, we’re calling this debut visual treatment the ‚Sam Skin‘. Hopefully this will be just the first of many YUI skins that evolve within the developer community as time goes on.

More To Come

The YUI Team will have more to say over the coming weeks about what’s new in 2.3.0, including in-depth looks at the Rich Text Editor, the skinning approach, other new components, and Jenny Han’s significantly upgraded DataTable Control. In the meantime, George Puckett from the YUI team has posted a detailed release manifest to our forums and there are release notes accompanying every component (available on the website and as part of the download).

We’ve been working hard on YUI since the last release and we’re excited to share this work with everyone today. Please check out the new version and let us know what you think.

“

(Via Yahoo! User Interface Blog.)