Layout on screen is like a sculpture

Last week, while I was looking at some layouts for websites my students presented, it occurred to me that a layout for a webpage should be compared to a sculpture, and not to a painting. There is a very big difference between how you see a poster, or the cover of a book, and how you see a webpage. A poster is seen as a whole, and should have a single, striking composition. Whereas a webpage is viewed in stages, while scrolling. Which means that it doesn’t have one single composition. This also means that it’s much harder to make the layout of a webpage look balanced, wherever you are on a page.

Tell me more

The Active Idler

I sent the first edition of my newsletter to 34 more people than I ever thought would be interested in such a thing. If you, like me, don’t really like e-mail, here’s a good old clicky thing that links to it.

Follow me via email

I call it blogging via e-mail. And it reminds me of spam. And I want the things I write to have a URL. I’m not a huge fan of e-mail newsletters. But it turns out not everybody dislikes them. So if you’re one of those, and you want to stay up to date about some of the things I do — all related to design, the web, education and random stuff, I won’t bore you too much with my private life — and if you don’t mind an occasional e-mail, you can join the 28 early adopters here.

But I don’t like email!

Only unfinished designs need a logo

I wrote about the futility of logo’s before. A good design doesn’t need a logo. I won’t go as far as saying that every logo makes every design worse, but especially on the web, logo’s are of very limited use.

Get rid of those logos

What time is it?

Last week, while she was enjoying yet another holiday, Charis posted this picture of her watch. The two hands of her little clock say what and ever. This corresponds a bit with how I think about time. So I decided to recreate her clock in the browser.

As one does

Digital canvasses

My old Blackberry Playbook serves as a digital canvas to display digital works of art. And since I only use my iPad mini at night to read, it serves as a canvas during the day as well. I would really like a bigger canvas though. I think these circles that slowly turn into squares, or this slowly animating sliced blob would look excellent in a much bigger format.

Bigger is better

Drawing is what it’s about

Without drawing you can’t really see, says Milton Glaser, in these two fantastic short films about drawing and design. He says many more things that are very much worth a few minutes of your time. And maybe a few extra minutes — or hours — to think.

What do elements sound like?

We all know what HTML elements look like and what they do, but what do HTML elements sound like? Here’s a page with sound clips from JAWS, NVDA, and Window Eyes — for now. It hasn’t been updated in a while, but even in its current form it’s a very valuable resource.

Hamburgers, links en spaghetti

Van de week had ik een mooie discussie met een collega van mij over de navigatie van een website. We hadden het er over of we studenten die een hamburgermenu gebruiken moesten laten slagen voor een toets. Mijn collega vindt van niet. De navigatie, zo zegt hij, is essentieel voor de gebruikers en voor de eigenaar van de site. Dat is dus niet iets wat je mag verbergen. Sterker nog, je moet er voor zorgen dat de navigatie altijd goed zichtbaar is, op elk scherm direct toegankelijk. Óók op een klein scherm. Natuurlijk heeft mijn collega hier groot gelijk in. En tóch ben ik het ook met hem oneens.

Waarom dan?

No more retweets for me

I don’t primarily use Twitter to follow celebrities, to promote myself, to look for deals, discounts, and promotions that are of interest to me, or to learn more about Twitter. I use it to follow a list of people I find interesting. I like to read what they’re up to. And I like to click on the links they post.

Don’t we all

Preserve­Aspect­Ratio in SVG

I’m always amazed by the incredible amount of possibilities that SVG offers. So many things that I coulnd’t imagine I’d ever need are in there. But once I know they exist, I can make better stuff. Take for instance the preserveAspectRatio attribute. I only knew its none value, but it’s much more powerful than that. In this post Joni Trythall touches the surface of what’s possible with preserveAspectRatio. When you’re done reading his blog post you probably want to go ahead and read his Pocket Guide to Writing SVG as well.

If Mondriaan used light, instead of paint.

Last week I showed my class a diagram that shows the difference between mixing colours with light, and mixing colours with paint. If you mix light, you work with red, blue and green, and when you mix them all together you get white. And of course, the absence of colour is black. Paint works differently. Here the primary colours are red, blue and yellow. And if you mix them, theoretically, you get black. And the absence of pigment results in white paint. This made me wonder, if Piet Mondriaan worked with light instead of with paint, what would his works look like?

Different, probably

I added a browser cache script to this site

I copied this service worker script and added it to my site. This means that when you’re offline you can still visit the pages you visited before — if you use a browser that supports Service Workers. I was really excited when I first tested it. It works! And five clicks later it felt completely normal. It occurred to me that yes sure, this is fantastic, but it shouldn’t be: this should be how the browser cache works. So I’m happy it can be done, but I’m not happy at all that I need to add a script to my site to do it.

Collect all characters you use on a page, a bookmarklet

Yesterday Peter van Grieken asked on Twitter if anybody knew a tool that displays all the different characters that are used on a page. This would be a handy tool for font subsetting: if your page only uses a few characters you don’t need to add all those other characters in your fancy font-files. Quite a few people answered to Peter’s tweet, but as far as I can tell nobody linked to a tool that does this. So I decided to create this tool.

It’s a bookmarklet