Category Archives: Web pages

Snopes Love/Hate

I love Snopes.com. It’s an invaluable resource for urban legends. Every time some idiot forwards me the latest fad email, I can debunk it (or, far more rarely, prove it isn’t true.)

I hate Snopes.com. Because they go out of their way to make their site fiddly to use. There’s popups that beat Firefox’s default blocker. If you click through to another site from their pages, it not only opens in a new window, but they try to hide its URL when you mouse over the link.

And they’ve got code that prevents you clicking or selecting on their page — so for instance if the browser gets focus in the address bar, you can’t click back onto the page to get the up/down keys working again. I guess it’s to stop you copy/pasting text off the site:

if (typeof document.onselectstart!=”undefined”)
   document.onselectstart=new Function (“return false”)
else{
  document.onmousedown=disableselect
  document.onmouseup=reEnable
}

… though right-click / Select All works (at least in Firefox). Right-click also works for getting focus back on the page, thankfully.

CSS for table displays

After much time swearing over how to get a table-like display out of CSS, I was stumped. All I wanted was an definition with the label on the left hand side and the text on the right, wrapped into a column.

And let me tell you: given my limited knowledge of it, wrestling with CSS is not my idea of fun.

Finally after scouring Google for various terms, I did a search for “hanging indents” which led me to a good way to do it using dd dt and dl tags, and appropriate CSS for each. Eureka! (Yes, if I’d thought about it, these tags are for “definitions”, precisely what I was trying to do.)

Thank you, the good people at Max Design.

The importance of accessibility

Raymond Chen on why accessibility is not just for disabled people. It’s also of huge benefit to automation, for testing and integration purposes (including such diverse uses as screen scraping and speech recognition).

You bet. It’s the lack of consideration for this kind of thing that gives me my pathological hatred for web sites developed entirely in Flash, or some other mutant horror of leading-edge technologies. Too often you’ll find some whiz-bang heavy commercial ad-merchant has somehow got in control of the site design for some company that should know better, and rendered the whole site unusable…

  • with the keyboard
  • by the blind
  • let alone the blind using keyboards
  • by anybody without IE6
  • or who has a popup blocker
  • or likes to use the web in silence
  • or is trying to get around the fact that the site has no RSS or web services or any other hooks, and is trying to screen-scrape/parse the HTML

Of course I can’t stop these idiots putting pages up. And they take no notice of anything anybody says about them. But in most cases I don’t have to do business with them.

One of the side-effects of sticking to accessibility and restraint in the technologies you use is that the designs tend to be more future-proof. While some web sites are breaking under Firefox, I reckon a lot more will break under IE7 when it gets pushed out to millions of XP users.

Toys “R” Stupid

Want to see some HTML Form stupidity? Go to http://www.toysrus.com.au/site/signUp.htm and you get:

The stupidist HTML form I've seen in a while

Radio buttons – users know what to expect from them. You can pick only one option. Not these puppies. These happen to be round checkboxes – that you can only turn on. You can’t turn them off! Oh, sure, there’s a “reset” button down the bottom of the form, but can you recall the last time you pressed the “reset” button on a form? I don’t think, in my many many years using the ‘net, I ever have. Not once. I have “reset button blindness”, and I imagine a bunch of others do too.

To top this off, because the site is mainly Flash, figuring out what the address of the page took a while. In the end I had to bookmark it to find it.

I guess that’s what happens when you get schoolchildren to build your website.

Nifty: Force Directed Graphs in Javascript

Starts off as a mess, then...
Kyle Scholz has developed code to represent Force Directed Graphs in Javascript, and you can interact with the nodes. We’re talking mathematical directed graphs here – you might know them as networks.

Basically, there’s a bunch of nodes and they settle themselves into a stable state minimizing tension between them – the graphs balance themselves out, and you can see it happening – it’s animated. And interactive – you can grab a node and move it around. It is ubercool.

Downside is that it sucks huge CPU.
... eventually becomes balanced

Snippets of geekitude

Gmail geekitude — In GMail with US English set, when you delete mail it goes to the “Trash” folder. Set it to UK English, and it’s “Deleted Items”.

TV geekitude — See how the ABC News titles look with no stories and no voiceover.

Google Video geekitude — Lots of snippets of info here, including the fact that Google’s video format is pretty much just a renamed DivX AVI.

Webmail geekitude — My web mail (Horde) puts a little flag against the country of the domain name of the sender. Of course it’s a little misleading when a message from someone using fastmail arrives, as it reckons it’s the Federated States of Micronesia…

Web design geekitude — The best freebie DHTML menus I’ve found so far are here. (Which I’ve implemented here and here. I reckon without too much trouble, WordPress’s categories could drive it automatically. Maybe something to put on the list for Geekrant 2.0.