novolocus.com

One approach by Nicholas C. Zakas

Here’s an interesting technique of drawing a user’s eye to an area on a page, by using a colour that fades after a couple of seconds. I know that it’s supposed to be for areas updated by the user (and I can think of at least one project for doing this), but it might work else where. I must give this a go, see what it’s actually like. It’s going to either be really good, or really bad…

(Update - having migrated my blog to Wordpress, I find that it uses this technique. And it’s quite nice. It works well)

So, this whole ‘Ajax’ thing set me thinking - why not try to make all ‘normal’ user interface components - date, numeric, combo boxes, autosuggestion boxes, image rollovers, menus, tooltips, etc. - why not make them all into libraries that you can include in a page, and then configure through the attributes of a node. E.g.
<input name='someDate' type='text' value='' subtype='date'
format='yyyy-mm-ddd'>
Then the .js file you include reads inputs, finds dates, and add the functionality you need.

I’ve already done this for combo boxes - I’ll put it on my site soon - and so I started looking into menus, and found some neat things:

• Almost entirely CSS menus
• Windows ‘Start menu’ like lists, similar to above but with more javascript (would need to work out the image reloading issue this seems to have though!)
• More CSS dropdowns
• Suckerfish Drop-downs

I didn’t know you could do so much with CSS. Clearly, it has come along since I last really got stuck into it!

Quirksmode is a neat little site describing various features and their support across browsers. This is important, in a world of non-standards compliant browsers. For example, I recently discovered in some code of mine that in an event, Opera 8 supports both ’srcElement’ and ‘target’ properties. In fact, it seems to support both event models. I can see why, but this caused my code (where I set event.target = event.srcElement if event.srcElement existed) to blow up.

Oh, and it neatly describes a problem I found (and had to solve) yesterday with the ‘this’ keyword in event handlers in Internet Explorer. Wish I’d known this before.

Anyway, I like this site, and it is useful.

Mandarin Design shows something interesting - using CSS to provide Magazine formatting. You don’t see that much in websites - mostly they have ‘website’ style. The page itself isn’t that well formatted - but the things it describes is interesting.

Vertical Text

CSS seems to lack an real control over text direction - it should, but of course the reality is different.

What I found was a way of making vertical in IE using some of those pointless filters, and the support IE has for top to bottom, right to left languages. It’s a bit sneaky in doing this - but it works in IE, at least. I haven’t found a way of doing it in Mozilla.
<div style="{ writing-mode:tb-rl;
filter: flipv fliph;
white-space: nowrap;}">

Been meaning to add this for a while - the mapping programmes on the web are getting much better:

- Aircraft Graveyard - Bet the North Koreans Like that!

- Hello Dave

- Hi Luecke

Interesting Maps… …lots more interesting pictures. Cool, but also kinda scary.

Gifs suck. PNGs (Portable Network Graphics) are much better - more colours, freedom from intellectual property rights, and (best of all) an alpha channel for transparency. Some good articles:

- PNG opacity (with some nice examples)

- Fuzzy Drop shadows (like on Google Maps)

- Transparency with HTC files

- And again

- Choosing what image to serve in PHP on the server

Related: Opacity in CSS, being able to see through DIVS - CSS Transparency for IE, CSS Opacity

News of a VMWare Service for developers to subscribe to developers licences, and to download preconfigured machines. Neat.

Ajax Patterns Wiki. Worth a look for those of us playing with ‘Ajax’. Silly name, Ajax, really. What’s next? ‘Achilles’ for the next ‘killer app’?

More on patterns although much of this is just good design - e.g. local cacheing where possible, and indicating the ‘newness’ of information (people like that. A web site can feel ‘dusty’)