Coding with Jesse

Do It Now

Talk about synchronicities. The day after I linked to some motivation quotes, my favourite blogger, Steve Pavlina, puts up a new article entitled Do It Now. It's 8000 words, so if you have some time now give it a read, or you might want to bookmark it for later. Steve's writing is a pleasure to read, and he written many great points on personal motivation and productivity in the past that he has seemed to incorporate into this article.

It's also worth mentioning that Steve has recently managed to change his sleeping habits and become a polyphasic sleeper. This means he sleeps for 25 minutes every 4 hours (a total of less than 3 hours a day!) If you're at all interested in this, go check out his journal logs and the rest of his website.

[Update: The synchronicities didn't stop there. I just noticed that on Success Begins Today, John updated his earlier motivation post with a followup entitled Success: Just Do It. It must be Determination Week!]

Published on November 29th, 2005. © Jesse Skinner

Hide Firefox Referals From Firefox Users

I'm glad Julian Bez pointed out we don't have to bother Firefox users with Adsense Firefox referals. Just yesterday, Google opened up Firefox referals for International content providers. I immediately added the banner to the Tools page of this site, and to Free Horoscope Daily, but I totally didn't think about showing Firefox users something different. Julian also outlines how to accomplish this easily with PHP. Thanks, Julian.

Published on November 29th, 2005. © Jesse Skinner

Motivation is a Trap

Over on Success Begins Today, John Richardson put up some great Quotations by John Maxwell:

"The whole idea of motivation is a trap. Forget motivation. Just do it. Exercise, lose weight, test your blood sugar, or whatever. Do it without motivation. And then, guess what? After you start doing the thing, that’s when the motivation comes and makes it easy for you to keep on doing it."

"As you begin changing your thinking, start immediately to change your behavior. Begin to act the part of the person you would like to become. Take action on your behavior. Too many people want to feel, then take action. This never works."

This reminds me a lot of the time I was going to university. I'd spend hours searching and reading articles on the Internet about beating procrastination. I was spending so much time trying to figure out how to get the motivation to do the things I wanted to do.

Eventually, I realised the only way to Get Things Done was to just do them! I don't know what other solution I thought I would find.

Nowadays, I love reading all the tips and tricks for Getting Things Done. It seems like everyone is obsessed with productivity and anti-procrastination. But I also worry that people are spending all their time configuring their Hipster PDA or organising emails in Outlook instead of just working on the things that need to get done.

Now, before you cry "Blasphemy!", I think the principals of Getting Things Done are really great. More or less, I've been applying them for many years. Basically, I keep a file, todo.txt, with everything I need to get done. I have one at home and one at work. I separate it into sections like so:

Main Project
============

sub project
- thing to do
    - detail on that thing
        - sub detail
    - another detail
- another thing to do

And if I ever forget what my Next Action is, I just take a look in the file. But I don't feel I need to do a lot of the other things, like reviewing, or some kind of inbox. I guess I'm just not as busy as some people, I usually have a good idea of all the things I have to do without it causing me stress.

Anyway, these quotes make a great point: finding ways to motivate yourself is a waste of time. If you're going to do anything, go do the thing you need to do.

Published on November 28th, 2005. © Jesse Skinner

No-JavaScript CSS

On one of my web sites, I use JavaScript to show/hide div layers containing each section. I have links to "#section-five" for example, but the onclick event changes the section-five div to display: block; and the previous div to display: none;. This is designed so that browsers without CSS or JavaScript will still be able to use the links as regular anchor links. This assumes, though, that the visitor would either have both CSS and JavaScript, or neither.

Since I wrote this, I've been struggling with how to deal with visitors who have CSS but not JavaScript. Today I figured out a way to do this.

The typical solution would be to have display: block; set by default, then to use JavaScript to set display: none; onload. I tried this solution, but I didn't like how all the layers appeared at first, then suddenly disappear. I wanted a solution that wouldn't affect the experience for most users.

All I needed to do was display different CSS to users without JavaScript. To accomplish this, I first considered setting disabled on the style sheet, then using JavaScript to enable the CSS link. This didn't work right in Firefox because Firefox ignores the disabled attribute of link tags.

Next, I tried setting the href on the link tag to href="", then dynamically setting the href using JavaScript. This worked good, except then users without JavaScript would be forced to see the page without CSS. It was perfectly usable but looked pretty boring.

Finally, I came up with this compromise. The link tag on the page is:

<link rel="stylesheet" type="text/css" media="screen"
 href="nojavascript.css" id="stylesheet"/>

so by default, visitors will get a "nojavascript.css" CSS file. This file contains:

@import "screen.css";
div.section { display: block; }
#ads { display: none; }

So without JavaScript, the page has all the div layers displayed, except the ads. (Adsense and Chitika won't work without JavaScript anyway.) Also, by using an @import, I won't have to maintain two almost-identical CSS files.

Next, I added a line to the JavaScript file attached to the page:

document.getElementById('stylesheet').href = "screen.css";

Note that I didn't put it in an onload function. I don't want the page to change once it's been loaded; I want it to look right from the start. If you do this, you'll have to make sure that the <script> tag comes after the <link> tag.

The other nice thing about this method: it ensures that users with browsers that doesn't support getElementById will still get the nojavascript.css file. This is important because it is the only method I use for handling the onclicks.

That's it. Simple, yet powerful.

Published on November 28th, 2005. © Jesse Skinner

Web Content Accessibility Guidelines 2.0

As announced yesterday in the W3C News:

The Web Content Accessibility Guidelines (WCAG) Working Group has released Working Drafts of the Web Content Accessibility Guidelines 2.0 and HTML Techniques for WCAG 2.0 and a First Public Working Draft of Understanding WCAG 2.0.

Unlike many W3C documents, these are actually quite readable and useable right away. They make some great points, some of which surprised me a bit. Web accessibility is often reduced to screen-reader functionality. This document goes quite a bit outside that narrow view and ensures that the web is fully accessible to users with a wide range of disabilities. These includes learning difficulties, cognitive limitations, speech difficulties and others.

As a result, following the advice in these documents seems like it would enhance the usability of the web for all users, even those without disabilities. Here are some of the more interesting points I noticed in these documents.

  • Guideline 2.5 - Help users avoid mistakes and make it easy to correct them. This is really great, general advice. It suggests validating input, providing context-sensitive help, and offering users a chance to review or possibly undo actions.
  • Guideline 3.1 - Make text content readable and understandable. Again, very useful and general advice that improves usability for all users. It suggests avoiding the use of jargon or words used in an unusual way. Also, the use of simple language summaries or diagrams to explain complex concepts to users with reading ability less advanced than "lower secondary education".
  • H46: Using null alternative text and no title attribute on img elements for spacer or purely decorative images. This makes perfect sense once I read it, but I had never given much thought to this being a real problem. I always thought about empty alt and title tags as a kind of work around. However, putting things like "side" or "blue bar" in alt tags on pure display images would just be annoying and unneccessary to a user with a screen reader.

If you haven't yet, I suggest giving these documents (at least the guidelines and techniques) a quick read. It's good to be reminded now and then of the simple ways we can make the web accessible and usable to everyone.

Published on November 24th, 2005. © Jesse Skinner
<< older posts newer posts >> All posts