justaddwater.dk

I just revisited “Why Web Standards Matter (Case Study)”, that I wrote on the background of a customer problem back in 2006. The points are actually relevant event with the more recent and faster browser versions that we have today.
I did a small change to express my opinion better. Changed “JavaScript should generally be avoided” [...]

For my own convenience I created this script to identify css files where colors like #aaaaaa can be rewritten in the short form #aaa
(saves bandwith, but can also make it easier to identify similar colors)

grep -nE ‘#([0-9a-f])\1([0-9a-f])\2([0-9a-f])\3′ **/*.css

output from a random project:

css/actions.css:19: color: #000000;
css/actions.css:38: color: #000000 !important;
css/actions.css:53: color: #ffffff !important;
css/admin.css:90: color: #cccccc;
css/admin.css:94: color: #aaaaaa [...]

I learned this nice little hack to bypass the standard browser setting that normally prevents background images from being printed.
The hack makes use of converting the background-image to a list item with an image.

/* Hack, to trick the browser to print another logo
Unfortunetaly, Firefox on Windows doesn’t show logo on [...]

I ran into the challenge the other day to style a<button> element to make it look like a link (with underline and everything).
Unfortunately, the <button> element does not react to text-decoration: underline;
But according to a discussion at the CSS Creator forum, there is a way out:
I was just messing around with it and for some [...]

I was reading up on the good old HTML specification and discovered a feature I had always wanted — and it’s already there:
Creating widths of columns that will work like percentages, but will also pay attention to any small, fixed-width columns.

Take a look at HTML’s proportional widths and amount alignment features.

One year ago I published “Design Guide or HTML Markup Guide” with link to the HTML guide we did for the biggest Danish business internet portal.
The HTML guide is a really useful tool for every public authority that must deliver applications for the portal.
As a help for my own work back then, I created virk_dk_htmlsnippets:

Snippets [...]

For a current project, I created a tiny number formatter that inserts thousand delimiters in a string:
10000 to 10,000 etc.
Just add css class=”numberformat currency” to a text field, and it will be formatted automatically.
It is based on the Prototype JavaScript library. You can get it from it’s GitHub repository page. Feel free to add or [...]

I used this quick trick today to help me clean up and refactor some javascript functions today:

if (“console” in window)
console.warn(‘DEPRECATED function call to ‘+ arguments.callee
+’\nCalled by:\n’+ arguments.callee.caller );

Which results in a fine deprecation warning in the console:

There is plenty of space for improvement here. Feel free to use or tamper … [...]

I found out that Internet explorer only interprets 32 @include statements in CSS for a webpage. The rest is silently ignored.
Tested with IE7. Has anybody tried this with IE8?
For more info see:
Internet Explorer issue – maximum of 32 CSS @import
PS. Silent ignorance is just about the worst form for ignorance when coding. The least [...]

Just home again from two weeks vacation, I found this in my delicious popular feed (i usually scan the delicious popular feed for links others find interesting).
Using CSS to Fix Anything: 20+ Common Bugs and Fixes
Good explanations to some of the usual I run into. For instance, the double margin float bug in IE 6 [...]

At a recent project, there was a requirement to describe the CSS used on a site, as a documentation, other developers could use. We decided to go a bit further — not only documenting the CSS classes — but making a guide that developers could find easy to use. Also we wanted developers with little [...]

Emil Stenström’s recent “Sharepoint 2007 from an interface developer’s view” is definitely worth reading if you care about webstandards, accessibility and decent frontend code in general.
Here are some of the quotes that really stand out in an excellent article that i really recommend you read before picking your web development platform.
One major problem is that [...]

These days I’m working on the HTML and CSS for this map, but I want to hear your opinions as what to recommend from a usability point of view:

The top map where the cities are placed on the map directly (it’s a HTML list)
The bottom map where the list is to the right of the [...]

In case you missed it, Dustin Diaz has written this excellent parody on what the hottest web techniques were like before webstandards and css were invented.
Seven hottest web 1.0 techniques to trick out your webpage.
2) Animation without JavaScript
Believe it! It’s true. Drop those old scripts that made your website scroll and blink because why bother [...]

What’s Watir? Read “Watir: Another sweetspot for Enterprise Ruby”
Is it possible to run JavaScript functions or execute code from within your Watir test scripts? As a matter of fact it is, but I had a hard time finding the proper documentation for it. Here is what to do and how:
Call JavaScript Functions from [...]

I just got an event invitation on Facebook asking me to join “Blue Beanie Day“. Two questions quickly popped into my head:

What is a Blue Beanie?
Where do I get one?

If you are into web standards and accessibility you have already seen a blue beanie on the cover of Jeffery Zeldman’s great book “Designing With Web [...]

I have for long been struggling with an internal legacy application that wraps the content page in a frameset. Very annoying because I have spent some time to reverse engineer a poor-mans API to the application.
Problem: An inline “reverse” framebuster script that makes sure that everything is nicely(?) wrapped in the frameset. As you [...]

I figured the original bookmarklet toolbox needed an update. Added Quirksmode detection, layout grid and updated PageInfo to accept framed pages.

Cameron Moll posted detailed tips on how to modify a standard Microsof Sharepoint 2007 installation into something with an acceptable output that’s valid XHTML and CSS, and less bloated with a much smaller footprint. In other words, a workaround for making Sharepoint work a little better out of the box.
First of all, it’s a [...]

Firebug keeps surprising me. I’ve recently been working on code for several web designs and this little trick helped me to understand existing HTML and CSS much faster. Just to give an example I use our Justaddwater RSS feed page (but could be any page).
Before you start, get Firebug for Firefox (if you haven’t got [...]

UX Magazine reports that MTV drops their Flash based website in favor of a common-sense web standards based solution.
It seems the Flash version was not complementing their content and the users were bitching about it… as they mention on their blog. I for one am glad to see this happen. As good as Flash can [...]

I have been looking a fast, intuitive editor for my Windows laptop.
Now I stopped looking. E-texteditor for windows is very intuitive and easy to use. I highly recommend watching the screencast (a short tour of some of the best features). Although it’s still in beta, it seems so much better than the alternatives.
I’m using [...]

It’s been a while where web standards don’t get the attention it deserves on this blog. In that spirit, here’s a behind-the-scenes view on how Technorati makes rounded corners on a faded background.

I remember Eric Meyer mentioned this solution back at a workshop in 2005 (before he could actually tell that it was for [...]

The Onion has a humorous feature list from Microsoft Vista in the recent issue:
Microsoft Vista Released
Microsoft released its new operating system, Vista, on Jan. 30. Here are some of its features:

Microsoft Word’s helpful paper-clip icon now blinks at rate of normal humans
Enhanced graphics on “System Is Not Responding” pop-up window
Five new card-back designs for Solitaire
Something [...]

All of a sudden, Joe Kleinberg posted a comment on “Who invented the Spacer.gif“, with the claim that he actually invented the technique [before David Siegel]:

2 years ago I wrote a small javascript to view, edit and delete cookies.
The really cool thing about this user interface is the inline editing of cookie names and values. I really like the principle that you hover the value that you inspect, can see that it’s editable. Then click directly and the text [...]

Molly interviewed Bill Gates on Microsoft’s commitment to web standards. Today, Roger added his comments in his article: Bill Gates on Web standards: Huh?.
In a brief discussion about web standards, Bill seems to interpret web standards as ws*, xml, etc. He does not really mention html, xhtml, css or similar approaches, which is why [...]

More visual HTML tags inspired by Neatorama’s “Visual HTML joke” that got digged recently.

It is no secret that all versions of Internet Explorer on Windows prior to version 7.0 has a flaw in its PNG renderer. The flaw basically involves the rendering of the alpha transparency and means that the images cannot fade nicely into the background.
The IE PNG bug explained
In the screenshots below you can see the [...]

Revisiting CAPTCHA: Since W3C wrote about “inaccessibility of CAPTCHA” almost a year ago, a new technique has emerged:
Using technology, to make it easier for humans, and challenging for robots to fill out a form, and using a more traditional fall-back method in the rare cases where the system cannot detect if a human is filling [...]

Technique for using the toolbox: Locating problems in HTML.
I decided to make a little toolbox that’s easy to apply on web pages, when investigating problems with web pages. Basically, it’s the tools I used when investigating the case I described in “Why web standards matter (case study)”
I split this into two posts. This is [...]

I decided to make a little toolbox that’s easy to apply on web pages, when investigating problems with web pages. Basically, it’s the tools I used when investigating the case I described in “Why web standards matter (case study)”
I decided to split this into two posts. This first one is about the toolbox. The [...]

The Internet Explorer team is preparing to ship the next major version of the world’s most popular browser. The IE team has written an update on which CSS bugfixes that will make it into the final release.
Update of existing CSS on websites
Before we get to that rather long list, I feel it’s important to know [...]

Project managers often have a hard time understanding web standards and why they matter. In this case, my arguments made a perfect business case for the managers of a particular project.

Yesterday the W3C released a Candidate Recommendation document called “Mobile Web Best Practices 1.0“. With this document W3C is offering a set of guidelines to help web developers deliver a better user experience to mobile users.
The deadline for providing feedback to W3C is the 27th of August 2006 and all developers are encouraged to try [...]

Hi, this is Luis Villa, Thomas and Jesper’s former colleague at Capgemini Spain. They couldn’t make it to @media in London last week, so they asked me to give a summary of the event.
London @media 2006 was a Conference about frontend and web user interface in all its dimensions: strategy, design and building and after [...]

After reading “Pick a Format (Any Format)” by Nick Bradbury (tip by: Jeremy Voorhis on Octoblog) we must say that we totally agree. The point in the post is simple:
I keep running across sites that offer the same exact content as an RSS feed and an Atom feed.
What’s the point of this? Making readers choose [...]

I just found this page on ILoveJackDaniels.com: Cheat Sheets. It contains a bunch of cheat sheets (you know the good old reference posters that is nice to have around the office). Realy good stuff. Now I just need to go to the office after dark to print a couple of posters on the A0 plotter [...]

As a followup to my post 25% of all web users are disabled, I saw that Microsoft commissioned Forrester to make research about accessibility and assistive technologies.

They found that 57% are likely to benefit from assistive technologies.