The second episode of “You’re Killing Me Here!” (usability and design screencast series) discusses various uses of the page title (HTML TITLE element): in particular how you can use it to communicate with users of your web application.

View the Screencast (2.5 minutes)

I made the following bookmarklet to sort all the select lists on the page. It’s probably not much use to anyone else, but at least I got to learn how to make a bookmarklet. Unfortunately it has to work in IE, which has a strict limit on the size of bookmarklets, so I had to keep it very simple.

SortSelect bookmarklet

Bookmark this link then click it on a page that has one or more select elements. The select lists will be sorted alphabetically. Tested in Firefox and IE6.

Test:
z z y x A C b

I just released a new version of my JavaScript tab interface software.

New Features

• You can set a custom onLoad function to be called after the tab interface has finished initializing.
• You can set a custom onClick function to be called when the user clicks a tab. In addition to performing any other actions, this function can stop the tab from changing.

In the CSS, if you change a seemingly innocuous bit of code you could break some functionality, so please notify me if you need to change anything.

In retrospect I probably should have said “if you make a seemingly innocuous change”.

Here’s an interactive tutorial I’m working on:

Learn CSS Positioning in ten steps

I’m using it to give some CSS and HTML training today. It uses a customized version of my JavaScript tabs interface and triggers a styleswitcher each time you switch tabs, so you can see the CSS change right on the page.

It’s a work in progress, so let me know if you have any suggestions.

I just released a new version of my JavaScript tab interface software. It has some new features that make it crazy-easy to use, plus I eliminated a memory leak in the IE browser (damn you Microsoft!).

New Features

• You can set the tabberOptions global variable before you include tabber.js to change any of the tabber settings.
• You no longer have to specify a title for each tab – it automatically finds heading elements in the body of the tab. Of course you can still specify a title if you don’t have headings or to override the title of the tab. And if you don’t do either it automatically numbers the tabs. See also tabberOptions.titleElements and tabberOptions.titleElementsStripHTML.
• Removes the title attribute from the tab so it does not appear as a tooltip when you mouseover the body of the tab. See also tabberOptions.removeTitle.
• You can prevent tabber from running automatically in the onload event. See tabberOptions.manualStartup.
• Fixed a small memory leak that appeared in the IE web browser.

Introducing “You’re Killing Me Here!” a series of screencasts discussing web site and web application design, accessibility, and usability from the perspective of a power-user.

The first episode discusses “type ahead find” in the Firefox browser and the design implications that come along with it.

View the Screencast

Ahh… clever.

Stupid, but clever.

It was using a little trick in CSS to make the page design more flexible, but the end result was that the page wouldn’t look right if CSS was not available.

I’m running some tests tonight on my JavaScript tabber code… yeah, I would say it handles nested tabs.

I wonder if there are any issues with “memory leaks” due to IE’s faulty garbage collection… let me know if you notice anything.

Update: Hold the presses, I found a few more links. Some of these pointers are not used except when creating new elements to add into the DOM, so I can probably just switch those to use local variables. It shouldn’t matter, but with IE’s faulty garbage collection, who knows if it might cause problems.

Update h good god, the squiggly lines have taken over!