Category Archives: Web

Are flashy HTML5/CSS3 “demos” helping?

Posted on by

The lack of forward movement in front-end web development by government agencies may be our own fault, says Chris Heilmann. And I agree. Completely.

I’ve been increasingly biting in my reactions to many admittedly fun but practically useless “demos”, “experiments” and other assorted HTML5 and CSS3 nonsense like CSS3 icons. I always get flack for this, and I probably will now.

While these experiments are easily defended—“just wanted to see what was possible”—they are generally non-complex (though they can be tedious; take one look at a CSS3 icon or font). They are, put bluntly, simply a way to show off. And as long as that works, it will continue. But what are these experiments helping, aside from the reputations of those who make them(!)?

Please note that many of these experiments utilize a technique that I and many other art directors and designers have used for ages, which greatly enhances product appeal. It involves simply combining two things you wouldn’t ordinarily expect to be together: CSS and fonts. CSS and icons. HTML and games. Peanut butter and chocolate—Hershey/Reese’s Peanut Butter Cups have used this to their advantage for years. And so forth. The first person to build real beer from Javascript will be speaking at conferences for years to come.

I could say more, but Chris Heilmann said it so well, there is no need:

Right now, we are happily thinking we innovate and push the envelope where in reality we are making each other go “Oooohhhh” while a large chunk of the audience that could benefit from our knowledge is stuck with really poor experiences on the web.

If you haven’t, please take a moment to read his article.

Cool tool: Opera Notes

Posted on by

Something I didn’t pay much attention to until a few months ago is the Notes functionality built into Opera (desktop). I used to use Notational Velocity or SlipBox, which are both excellent.

Since I spend about 80% of my computer time in Vim and Opera, and since Opera is my primary browser (and e-mail client), using this functionality instead of a separate app works well for me. I don’t notice any difference in speed compared to Notational Velocity; the way they work is similar, but I like Opera’s integration with the browser, Opera Link and e-mail.

For those not familiar with Notes, I tried my hand at making a screencast.

A quick intro to Opera Notes from Stephen Hay on Vimeo.

What we can learn from the Defiant Dog

Posted on by

Ian Broyles‘ amusing one-page site Defiantdog.com features a photo of a dog, and a button containing the word “sit”. This is fabulously funny, considering that nothing (visible) happens when one clicks the button.

A photo of a dog standing, with a button labeled Sit.

I didn’t think much about it until Vasilis van Gemert posted about it and Ian published some stats; at that point in time visitors clicked an average of 23 times per visit. 23 times is a lot of clicking, which means some conditioning and expectation are at work.

As pattern-seeking beings, we tend to follow our conditioning. A button must be there for a reason—let’s click it. It says “sit”, therefore the dog will probably sit, won’t it? 23 clicks on average indicates to me that the average user is not considering whether this is just an image or instead some type of interactive movie. 23 clicks indicates bell/salivate. Button/action-expectation.

Let’s say you have javascript disabled, for whatever reason. You fill out a form. You click the submit button, not knowing that in this case the developer has made a javascript-dependent button (this is common). You might say you have encountered a Defiant Dog: something which doesn’t do as it’s told, or doesn’t react according to expectations.

Ian’s fun experiment confirms two things which many of us know but are always worth repeating:

  1. When users expect things to happen on our websites, it’s most likely that we have done something to trigger those expectations
  2. Users will almost always think it’s their own fault (and may even click 23 times before deciding it’s not)

It’s been said that without expectation, there is no disappointment. While not a new idea, this take-away from the Defiant Dog is still timely, as you’ll notice anytime you see something you think should be clickable but isn’t. Or when a relationship is falsely implied between multiple UI elements.

Managing expectations is a design problem. It’s up to us as web designers to find the defiant dogs in our websites and applications, and get them to sit.