Front-end masterclasses are canceled

Together with some excellent and well known front-end and design nerds here in the Netherlands and Belgium I organised a series of masterclasses for medior level front-end developers who want to grow to senior level. Unfortunately I had to cancel these masterclasses. There were not enough registrations. I’m trying to find out why there were so few people who were interested. I’ve thought of some reasons, and I’ve heard a few others from people I asked, but maybe you know a reason I don’t know yet. Please let me know. I’d love to keep organising such masterclasses in the future. Successful ones.


Keep items in a single column

Every afternoon at 13:37 my server generates a PDF. It’s been doing this for a few months now and I wanted to share these PDFs with the world. Multi-column layout is an excellent way to display such a big — and growing — list. There was a problem though: sometimes the date of the last item in a column was shown in a different column than the Download-or-buy-this-book-links. There is a way to prevent this from happening.

What is it?

Clock (model 103)

Yesterday Maarten P Kappert posted a link to a beautiful clock. It’s a brilliant design. The lines that indicate the hours are drawn in a strange way, yet the end of the lines perfectly show you the time. The other detail I love is the long hand of the clock: it is longer on the other side of the center, which is weird, but seems to work well. I wanted to see this clock displaying the real time, I wanted to be able to use it. I’m not rich (or lucky) enough to buy a real one, so I created one for myself.

Haha, that’s crazy

The random attribute

Last week I went to CSS Day, a wonderful conference about, yes, CSS in Amsterdam. I noticed that the list of speakers on the homepage is displayed in a different order every time you refresh the page. I like that. Of course it’s pretty easy to create a script on the server or on the client to randomise the items in a list, but I thought a random attribute would be nice.

It sure would

Test if the vh-unit is implemented crazily

I love the vh unit. You can use it to make something as high as the viewport, or you can use it to make sure that something is never as high as the viewport. There’s lots of other stuff you can do with it as well. I love it, and I want to use it for every project I work on. Unfortunately there’s an insane bug in Safari on iOS that makes it impossible to use it. I tried to fix it with a little script, but I think I can use a little help to improve it.

What’s that bug?


The people of Creative Mornings in Utrecht asked me to do a small talk about Freedom1 (video here). It’s always nice to get a topic for a talk, especially such a light hearted one. At least, if you look at freedom as a beautiful thing. But there are many definitions of freedom, and I think that I should mention one in particular before I start talking about the wonderful kinds of freedom the web has brought us.

What freedom is that?

About Voto, my self hosted IndieWeb photo gallery

A few months ago — inspired by the Indie Web Camp movement — I decided to create my own photo-site. I’ve tried many self-hosted gallery scripts before, but they never did what I wanted them to do. Many of these script have a bad case of feature creep, while others lack some essential features. And all of them are slow. During a two week period between jobs I wrote my own script. I’ve been using it since and I’ve posted more than 320 pictures on it. It’s not open source — I’m not a good programmer so I don’t think it’s safe to share this code. But I guess sharing my ideas might help others in creating something similar.

Interesting, go on

Linking to fragments on a page

When an element has an ID, you can link to it. All browsers I know will scroll to the position of that ID on the page. This is a very useful feature. It enables you to provide skip links to sections of a long article, for instance. The problem with this technique though, is that most of the time that thing you want to link to doesn’t have an ID. Today I found a script that tries to solve that problem. From now on you can link to any text you like on my blog.

Show us how

Using the :target pseudo-selector for alternative layouts

I really like the :target pseudo-selector. It enables you to style the target of a so called skip-link. For instance when you link to a section in an article: you could highlight the header of that section. Or you can use it for toggling simple drop-down menus — the ones you see a lot on small screens. But you can also use it to create a completely different layout.

How do you do that?

How high is the scroll height of scrolling with the space bar?

I sometimes use the space bar to scroll down a page while reading. Recently I’ve been using it a lot with the random stuff I create, like the Daily Rectangle. Hitting the space bar shows you the next image, minus a bit: it doesn’t scroll 100%, it scrolls a bit less. This makes sense when you’re reading an article. The last lines you were reading at the bottom of the page will still be visible at the top after scrolling. I was wondering how high this height was, and if it’s the same on every browser.

That’s very useful!