Peterbe.com

If you search Google for 'yogurt' www.dannon.com comes up second in the search results. Neither the title nor the URL contains any reference to the word yogurt. The word "Yogurt" is the 37st word of all (55) non-HTML English words that appear in the crappy table-inside-tables-nested piece of crap source code.

A SEO expert would immediately count Dannon.com as doomed on the search term Yogurt but clearly Google had other plans. According to my Google toolbar the Dannon website has a measly 5 out of 10 PageRank™ only, so that's not the explaination either.

So how did Google do that?

Today I was working on an popup input box (actually 3 input boxes) that asks the user to enter a project, a vendor or a category. The first box looks like this:

Project name: __________________________

The second looks like this:

...accounts code (optional): __________________________

I'm wondering, what's the most user friendly way of displaying that label. Is it:

...accounts code: (optional)

or is it:

...accounts code (optional):

Yesterday I discovered that the <button> tag doesn't work in Pocket Internet Explorer so for the mobile version of the particular page I'm working on I had to replace the <button> tag with a <input type="submit"> tag.

And I thought Microsoft invented the tag. Perhaps they did but forgot about their own "standards" when they did the Pocket IE.

For hard cord Javascript developers this comes as no surprise but if you, like me, do all your work in Firefox (of course with Firebug installed) then you need to keep a close eye on the correctness of your Javascript syntax because Internet Explorer will have some difference ways of thinking about it. Here's what I learnt the other day. This works perfectly in Firefox:

var person = { age:27, name:"Peter", };

But if you run that in IE you get "Expected identifier, string or number".

I know that SQL raises syntax errors on trailing commas but Python sure doesn't and I like that.

What a pointless rant this was. More like a note to self that might hopefully help someone else some day.

correct.html
incorrect.html

It started with this letter of apology on the corporate site of jetblue.com which was quite impressive. Discarding the content I liked the design and the simplicity of the navigation.

I then tried the flight booking interface and was even more impressed. It was intelligent and fast and since I was just goofing about to test rather than to book I accidently selected 30th of February as my return date and a Javascript alert box popped up and prompted me of a my misstake and corrected it. All very impressive since so many airline booking forms suck badly these days.

Then I clicked to go to the homepage and noticed how my Firefox almost froze and started stuttering. Even though the homepage fits on one screen and hasn't got much information it took 11 seconds to download it completely! (apple.com takes 4 seconds, peterbe.com takes 2 seconds on this WiFi connection I'm at)

cbeau.ca or "Retouche Photos Retouching" is a neat little online gallery showing what can be accomplished with photo retouching of models and other photos like that. What's interesting about the gallery is that the interface is great. It's done in Flash and I'm often disappointed and very rarely amazed by Flash interfaces. I still love Flash games as a user interaction medium and the Flash video players have worked a zillion times better than Quicktime, Windows media or Real player.

Most Flash interfaces are just annoying. Thinks flash, blink and move away from your attention. Nothing ever looks the same so you never learn how to use the interface. Also, a lot of Flash interfaces are slow to load and once loaded you rarely get content but just decorative fluff that you don't really need.

This is an exception though. They even clearly mark out which photos you've clicked on. (I guess they've read and taken in Jacob Nielsens books). The interface is fast and obvious and there is very little else of distractions from what you're there to see.

To all Flash developers out there: Keep up the good work! Don't use Flash when HTML is better even if it's less fun to develop. Look at sites like this for inspiration.

I've upgraded RememberYourFriends.com now to run jQuery now instead of tw-sack and my own home-brewed javascript code.

I've also joined the jQuery documentation team to be able to include my little baby site on Sites Using jQuery

Currently it's using jQuery 1.0.4 but I'll upgrade to 1.1 soon. I'm also working on a Swedish version of RememberYourFriends.com but I've only translated 60% of the strings so far.

For the print.css stylesheet I wanted to hide away several of the "interactive" things such as some forms and stuff. This is the code I used:

img.camera,
img.edit,
table.expenses input, 
#shownfields, 
input[type="submit"],
.exportlinks 
{ display: none }

Works like a charm in Firefox but in IE (version 6 at least) none of them were applied. If I removed the input[type="submit"] selector the other ones worked. Is this a bug in Internet Explorer? Or have I declared it incorrectly. The W3C CSS validator sure doesn't hold me guilty. Here's what the code looks like now:

img.camera,
img.edit,
table.expenses input, 
#shownfields, 
.exportlinks 
{ display: none }
/* If you run Firefox or like you won't have to see 
   the submit buttons when you print this page. */
input[type="submit"] { display: none }

Crazy Egg is a wicked service that allows you to measure where people click on your site. I have no idea how they do it. You basically install a piece of Javascript in your HTML code which must somehow hijack the mouseclicks or something and report this back to a Crazyegg database.

What really makes this tool shine is the Heatmap. The Overlay and List views are in comparison pretty boring and for that you might as well use standard web statistics tool for that. I'm not going to explain what the Heatmap is. Just look at the attached screenshot from a report I've made based on www.issuetrackerproduct.com

I've emailed three friends about RememberYourFriends asking them what they think. The response has been the same from everyone: "brilliant!", "clever idea", "could be a big success", etc. But none of them actually signed up. Why??!!

RememberYourFriends.com is a reminder app that periodically reminds you to keep in touch with your distant friends. The idea came from the fact that I needed something like this for myself and thought it could be a good excuse to try some new web app techniques. It's fully web 2.0 compliant except for the lack of a shiny web 2.0 logo.