Web Info & Tutorials

I got to spend a little time with Steve Souders, Chief Performance Yahoo!, and not only is he a really good guy, he has a lot of great experience at getting web sites performing.

I have a full writeup of his talk on Web Performance where he discusses his 14 rules of performing sites, how the frontend web code really matters more than you think, and how the browser cache isn’t helping us out as much as we would like to think.

Steve also just released YSlow 0.8 which has a few new features including one big one:

I discovered that resources (scripts, stylesheets, images) read from the browsers cache (with no HTTP traffic) still show up in Net Panel. This has caused confusion when people thought their cacheable components were not actually being cached by the browser. I talked to Joe Hewitt and settled on a fix that comes with this version of YSlow. The full details are found in the article Bug (fix) in Firebug’s Net Panel.

Steve wrote a detailed report on the bug and you can read and download YSlow here.

I took the opportunity to sit down with Steve and find out more:

JSValidate is a simple library based on Prototype and Script.aculo.us to allow you to do form validation.

You simply use special CSS classes to annotate your form and let the library do the rest. You can see this at work in the demo page.

The set of CSS classes that you can use to annotate the form is:

• jsrequired - Field must have some sort of value.
• jsvalidate_number - Any integer; accepts decimal and negative
• jsvalidate_digits - Only Numbers
• jsvalidate_alpha - Only letters
• jsvalidate_alphanum - Only letters, numbers, and underscores.
• jsvalidate_email - Any valid email address.
• jsvalidate_uscanzip - US or Canada Zip code; Accepts optional US zip + 4
• jsvalidate_usstate - Any 2 letter uppercase state of the United States.
• jsvalidate_usphone - US Phone Number, accepts most common formats.
• jsvalidate_creditcard - Validates VISA, MasterCard, American Express; formats: no spaces, spaces, or dashes.
• jsvalidate_ssn - Social Security Number in the format: XXXXXXXXX, XXX XX XXXX, or XXX-XX-XXXXX
• select-notfirst - This class can be applied to select boxes (drop-downs). It prohibits the user from selecting the first option from the list.

A past advise release by the National Federation of the Blind discusses digit rulings that could hit a hammy gist on availableness requirements:

A federal regularise suite determine issued digit occasion decisions today in a broad collection state against Target Corporation. First, the suite certificated the housing as a collection state on behalf of blindfold cyberspace users throughout the land low the Americans With Disabilities Act (ADA). Second, the suite held that Web sites much as target.com are required by Calif. accumulation to be accessible.

Accessibility has been a blistering matter but with no actual laws in locate to oblige it, some developers hit thoughtful it an afterthought. These rulings could be a actual consequence up call for those that hit unnoticed the requirement for reachable websites and if condemned further, could hit a hammy gist on existing businesses who would requirement to extensively mend their cyberspace initiatives.

The President of the National Federation of the Blind, Dr. Marc Maurer, commented on the court’s ruling: “This is a large travel nervy for blindfold grouping throughout the land who for likewise daylong hit been denied coequal admittance to the cyberspace economy. All e-commerce businesses should verify state of this selection and directly verify steps to unstoppered their doors to the blind.”

If you’re fascinated in acquisition more most accessibility, Max Keisler has a bill organisation over 40 tutorials and articles on accessibility. In addition, the Illinois Center for Information Technology Accessibility has created a Firefox plugin that crapper support you in investigating your scheme applications for markup and structural support to functional scheme accessibility.

Finally, The Ajax Experience module hit digit presentations presentations regarding accessibility:

• Reaching the Entire World: Accessibility and Internationalization with Dojo
• Implementing Accessible Ajax

I communicate that Ajaxian readers place course to beatific scheme availableness meaning touchable to support those unknown with this matter embellish more alive of the considerations in making reachable scheme applications.

Phil Rees has cursive up a nice launching to Firebug, display us how you crapper ingest Firebug to:

• Inspect bespoken stylesheets included by Google Mashup Editor
• Modify in-memory stylesheets to wager the changes echolike immediately
• Place watches and breakpoints into streaming JavaScript
• Execute capricious JavaScript in the environment of your streaming application
• Monitor Ajax calls, display salutation times, posted content, and results
• Profile JavaScript functions to support you refer bottlenecks and behave your application.

The article walks finished every of these points using Phil’s DanceMaps mashup using the Google Mashup Editor.

Luke Birdeau has remixed Craigslist to produce a desktop-esque Ajax application view on the data that adds features such as being able to save your favorites, add notes to them, and even use the app offline (e.g. take your laptop on the road to go see the stuff for sale of meet that blind date). The app combines aspects of 3 libraries – TIBCO GI 3.5 for the interface, plus Dojo (for offline) and Google Maps.

To get started you first pick a locale, then a category, then do a search. You can also add multiple regions and categories too.

Here is a quick demonstration of the app in action: