Awesome news for all those who also hate Internet Explorer: As of 15th August, 37signals is phasing out support for IE6. It’s not much, but it’s a start.

The only way that people who are currently using IE6 (apart from the poor sods in corporate networks) are ever going to upgrade is if their websites are broken. These are the people who think “the internets” is the blue E on their desktop.

If you’re just starting a new project, please consider not supporting IE6. If you don’t, you’re just making it harder for the rest of us, who are trying to make the Internet a better place.

This is just a quick post about a bug I found in my code and how I fixed it. This problem first surfaced in Firefox 3 and was a little confusing. A javascript program (a crossword game) was throwing a very strange error:

Long story short, it turns out that DOM elements now have a property called "prefix" on them which affects the namespace they're in. My code was storing data in that supposedly-unreserved property, and this was what was creating the error. The fix: change my code from "td.prefix = myPrefix" to "td.thePrefix = myPrefix".

This is yet another great time to sing the praises of Firebug - possibly the most essential Firefox plugin for developers, ever. The website is at http://getfirebug.com/, however they only have a link to version 1.0, which doesn't work on Firefox 3 (there is a link to 1.1, but it appears to be broken). Firebug 1.2 beta 4 (for FF3) is available at the Mozilla Add-ons site.

After posting about my YouTube GreaseMonkey script earlier, I'm continuing the spirit of sharing 'power user' PC tips for everyday use.

So last night I was playing with my new laptop, installing my suite of applications on it and copying settings from Photoshop on my desktop PC over to it, when I suddenly had a brainwave - you can totally automate this kind of thing

When you think about it, all your data can be mapped between various folders on the two. And anything that you don't want overwritten or is specific to either machine can be filtered out. I found an incredibly nifty little program that allows you to do just this - synchronise your data to external drives, over a LAN or even over the internet via FTP!

What's the point?

There are two Massive benefits to this:

Consistent computing environment

With a bit of time spent setting things up correctly, you can happily edit files on either machine and have them automatically update as if you hadn't moved between computers at all. Even program settings, emails etc can be shared in this way.

Constant automated backups

Since all your important data is in two places at all times, the likelihood of your important data being wiped out by a hardware failure is dramatically decreased.

Great! How do I set it up?

Most Windows applications store their settings in C:\Documents and Settings\[YOUR WINDOWS USERNAME]\Application Data\Local Settings and C:\Documents and Settings\[YOUR WINDOWS USERNAME]\Local Settings\. Some may store them in C:\Program Files\.

Local Settings and Program Files are pretty much the only two places you need to think about as far as programs are concerned. Open Folder Sharing for these paths and make a new network share for them so that your two computers can access the data over the network. You may have to enable “Advanced File Sharing” if you receive “Access Denied” errors that prevent you from accessing the folders, so that you can. If in doubt the process here is identical to sharing any random folder on a Windows network. I additionally name my shares with “$” signs at the end of their names - this makes them invisible to Windows Explorer and will prevent others on the network from seeing them. If you want real security, you should create a user specifically for file synchronisation through the “Computer Management” panel, and setup sharing permissions so that only that user may access those shares. The “howto”-ness of this is left to your own Google searching

So what if you have different users on each PC (or even different Program Files directories, if you're l33t), you might ask? The paths will be different - this may cause problems with your settings in some of your programs that use absolute URI's to locate resources. But you can work around this, too! Just name all your paths using Windows Environment Variables - so whenever you pick a config file or something in your application that points to C:\Documents and Settings\[YOUR WINDOWS USERNAME]\Application Data\Local Settings, just replace this part of the path with %AppData%. The similar variable for Program Files is just %ProgramFiles%. All there is to it! Windows automatically knows how to substitute these special wildcards in paths, and your files will magically be found, even if they're in different locations. You can even define your own environment variables, by right clicking My Computer and going Properties » Advanced » Environment Variables.

...and you're done! Whenever your computers sync (mine do it automatically the second my laptop connects to our router), all the settings you define are carried over as well. So if you're doing something like adding bookmarks in Firefox or Changing your UI layout in Photoshop, the changes will magically and seamlessly be the same on both computers!

You can also setup a similar routine to backup your My Documents folder, music and any other data you could possibly think of.

So, next time you have some spare time or have to format - consider installing common programs and mapping automatic synchronisation scripts for their files between your desktop and laptop PC.

The program I found that does this is called 'Alwaysync', and you can download it (for free) from
http://allwaysync.com

Since you can sync over the internet, you could also setup a behaviour to synchronise your work PC with your workstation at home!

If you're a cool web user you might be interested in this: I came across a GreaseMonkey script the other day by Josh Kinberg which makes it easy to download YouTube videos.

Pretty awesome but it seems broken now, either with Firefox 3 incompatibilities of some sort or a change to YouTube's page layout (could be both - different rendering sent to the new browser..)

Anyway, I made some minor edits to it to make it compatible with whatever's causing this problem and added a link to the swf url, which you should be able to use if your forum supports (or allows) [flash] tags.

Install

Today, upon receiving yet another security update for IE6 (which I still run for testing purposes), I was just thinking how nice and how simple it would be for them to just roll out an updated PNG library to give us 24-bit PNGs. That is all.

I was recently writing a PHP application where I needed to allow users to input regexes. Validating this kind of input could be rather a nightmare if one had to code it for themselves (regexes to test regexes? eww). For the most part, one can usually assume that any user capable of entering a regex knows what they're doing, but I still say protecting against everyday syntax errors causing pages of PHP warnings and non-matches is worth doing.

Here's a method you can use to do this simply, unobtrusively and using PHP's internal regex parser for perfect error handling...


/**
* Here we simply declare a global for $regex_error, set PHP's internal error
* handler to use a function that silently sets $regex_error to the error
* string if anything fails, and then test against said variable.
*/

function errorHandler($errno, $errstr = '', $errfile = '', $errline = '') {
global $regex_error;
$regex_error = "Regular Expression Error: $errstr";
return true; // dont exec internal error handler
}

// test regex validity
set_error_handler('errorHandler');
$regex_error = false;
preg_match($highlight_regex, ''); //sets $regex_error internally
restore_error_handler();

// output an error message (or do whatever) if it failed
if ($regex_error !== false) {
print 'You fail! - ' . $regex_error;
}

A while back, Jeff Atwood spoke about the The Power of Defaults, arguing a good point that when creating a piece of software, the default options you choose as the designer have the power to make or break your product. This is true, however he took the argument further, revisiting an older post titled The Problem With Configurability, effectively arguing that you should design your software right the first time with a strong set of defaults, and do not allow over-configuration.

In other words, don't make users think. Or at least don't make them think about anything outside the narrow focus of their immediate goal. Furthermore, making everything configurable really means the designer isn't doing his job.

This is where our opinions diverge.

At a previous job of mine, I was tasked with (re)designing and building the entire assessment module of an LMS. Everything from the interface for teachers to create assessment pieces, to the interface for students to complete it, to the reports, to selective release locks (eg: only release assessment B after assessment A has a score of 20 or more) and even versioning for entire exam papers. Prior to this, the system already had an assessment module, however it was not powerful enough for what our users wanted.

In the old system, because the user couldn't customise things at all, any divergence from the default that they wanted meant a lot of hacky code was needed just to achieve relatively simple requests, of which there were many. The new system gave that power to the user, but no one wanted to find out how to achieve what they wanted and instead threw up their hands and kept requesting changes to the system which they themselves could make. They wanted the default to satisfy them, however (and here is my point finally), a default, no matter how well chosen, can't be all things to everyone. It will be juuust slightly wrong for some people, an annoyance to others, and the antithesis of what others want. Unless you are building for just one person, the default is just a starting point.

After each support call, I'd be cursing the "stupid user" who didn't know to look in whatever menu to solve their problem, and I'd suspect the user would be there cursing the stubborn developer who made it too difficult for them to achieve their task. The answer, as with most things in life, ends up somewhere in the middle of the two. Depending on what sort of users you've got, you'll need to find a balance between "massively powerful, but incredibly difficult to use" and "very simple, but underpowered". An example of the former is a CMS called TYPO3, who, upon their beginners' page, go to great pains to stress that their software is hard to use and is incredibly complex. On the other end of the scale is pretty much any piece of software that Apple has made.

If you are trying to get a very wide userbase including people with very low levels of skill, motivation or patience, invest more time into your defaults. If your audience is someone who has (or should have) the time and motivation to get that much more from your software, spend your time making it flexible to their needs. I say "should have", because in certain circumstances, users have unfair expectations of software. If the software has been built to do every single little task which they've asked, and some things they will probably ask for, they have to expect that the learning curve is going to get a little steeper, and it's up to them to put in a bit more effort. It is a shared responsibility.

Personally, I get some weird sadistic satisfaction from being able to control every single part of how a program works. UEStudio, my text-editor of choice, has no less than 54 tab pages in its settings, and after gradually tweaking it over time, it is perfect for me. Occasionally, I've taken a look other editors: ones with features that would probably assist me greatly, however they haven't allowed the level of tweaking that I require, and for me at least, that is a show-stopper.

The website I want to share with you today is a favourite of mine: A List Apart.

ALA offers consistently high-quality articles regarding all facets of running a website: everything from coding (HTML, JS, CSS, and the very occasional snippet of PHP), to usability, to typography, to copy writing, to marketing. Their articles on HTML and CSS are very much geared to providing its readers with a full grasp of the code, and the Standards-Compliantedness of their examples is always a high priority. They are also accompanied by great illustrations by Kevin Cornell.

Just a couple of articles which I have bookmarked include: PNG Opacity in IE (written in 2002!), Sliding Doors CSS, and Accessible Forms. Looking at these examples just now (which I haven't done for a while, since I know them verbatim now), I just realised how much I use the knowledge ALA has given me, every day.

ALA's subtitle reads "For people who make websites", and it really couldn't be truer. With their articles categorised into Code, Content, Culture, Design, Process and User Science, it's not just for the code monkeys. Anyone with anything to do with a website can get something out of A List Apart.

CSS is a really great thing. Effective use of it is an essential skill for any web designer or developer. The level of control it gives you over the styling of your elements is great, but the selectors provided still lack the power needed for some advanced styling. CSS3 aims to add more flexibility in this regard, but since it's going to be years before a significant portion of your users are going to be using a browser which supports it properly, it's not worth worrying about it yet.

I suppose I should give you an example of the advanced selection which I need. Suppose you have a hierarchical tree-style menu on your site, for example:

Instead of showing your users the full tree, which might become quite confusing, you want to show just the top level topics, and the child branches of the current page, eg:

This is quite simple in vanilla CSS:

However, if Topic 1.1 is now set to the active one, CSS can't help you. CSS is great when working with descendants of a known element (eg: #menu ol), but for this problem, you need a way to tell it that ancestors of a particular element need a particular style, in this case, they need to be visible. Enter Javascript Stylesheets.

Using Ben Nolan's Behaviour library which I spoke about just the other day, you can exercise much greater control over your selections, and apply CSS through Javascript.

There are other powerful things you can do with this, beyond advanced selectors. The number of times that I've cursed CSS for not allowing me to set the width of something to (100% - 10 pixels) or similar, or having to set up horrible hacks to emulate min-width/height in IE. Using this approach, you can programmatically overcome CSS's shortcomings.

As always, some caveats. The Behaviour rules are applied after page the page has finished loading so there's a delay before your styles show up. Also, it's not going to be as fast as your browser's native CSS selectors - before you go too crazy with it, think about what can and can't be done with normal CSS which will be quicker, easier to read, and easier for other developers to work on should they take over your work.

Earlier I wrote about how it's time to kill Internet Explorer. Of course, it isn't as easy just telling your friends about it and installing Firefox on your parents' computer (changing the shortcut icon to "the blue E", of course). These people, though they aren't helping by continuing to use IE, aren't the main culprits. It's not their fault. They don't know that there's a better solution out there. To them, if it ain't broke, don't fix it.

Take a step up the food chain, and you'll find businesses who run websites who demand their site runs on IE6, and I feel that here is where the problem lies. Businesses don't want to change their site to not work on IE6, and because of that, users don't want to upgrade their browser because everything apparently works fine. But really, how can you blame the businesses for that? Why would they want to alienate a significant portion of their users for something they really don't care about: a religious browser war. They don't care that it isn't standard compliant, and that to get the pages looking consistent takes hours of ugly hacks - they just want a site.

As a web designer, one sure way to influence the businesses to not bother with IE6 compatibility is to charge them for it. Next time you're quoting for a website which uses any sort of Javascript/CSS bells and/or whistles, give a figure for the site, and another for the site with IE6 compatibility. 15%-20% extra sounds pretty good to me - very fair really, if you consider the extra amount of time you have to spend hacking and debugging the most broken of all browsers. $3000 for a site which works on modern standards compliant browsers - $3600 for a site which works on IE6+. If you think charging your client extra for something which is normally assumed might not go down too well, switch it around: $3600 for a site, and a $600 discount if you want it just for Firefox, Opera, Safari, etc.

Sure, they might not go for it, but at least when you're there adding to your "Fucking IE" tally, just remember that you're actually getting paid for the extra work you're putting in.