Er liggen een aantal erg interessante design principes ten grondslag aan HTML, de taal waarmee websites gebouwd worden. Een van de mooiste vind ik de zogenaamde Priority of Constituencies, de volgorde van kiesdistricten. De vertaling is wellicht een beetje onduidelijk, maar in dit principe wordt er bepaald wiens mening zwaarder weegt als er een conflict optreedt tussen verschillende belanghebbenden. In case of conflict, consider users over authors over implementors over specifiers over theoretical purity.
De gebruiker heeft altijd gelijk. Als de gebruiker er niet toe doet, dan heeft de author gelijk. Dat zijn wij. De designers, de developers, de content editors, en iedereen die verder meewerkt aan onze websites. Als de mening van ons er niet toe doet dan hebben de implementors gelijk, de browser-bouwers. Je kan hier uit afleiden dat het de taak is van browser-bouwers om het zo eenvoudig en prettig mogelijk te maken voor mensen om onze creaties te gebruiken. Na de implementors zijn pas de specifiers aan de beurt. Dit zijn de mensen die de HTML specificatie schrijven. En pas als allerlaatste doet de theorie er toe. Soms worden er dus beslissingen genomen die voor sommige groepen nergens op slaan. Maar tóch zijn het de juiste beslissingen omdat ze nuttig zijn voor een groep die belangrijker is.
Dat is wat anders dan consensus, toch?
A while ago I created a tool to help you define the ideal length of line for text on the web. You can adjust a few variables, like font-family
and language. When you slide the slider it shows you how many words there are on a line, or how many characters. You can now choose an ideal measure depending on the theory you like most (10 words or something between 45 and 75 characters). It turns out there’s a much easier way to define an ideal measure, according to Bringhurst.
Exciting, what is it?
There are a few ways to determine the breakpoints for layout in a responsive design. The first one is based on the size of common screen sizes. The second one adds breakpoints when the content breaks. The third one is based on things like font-size. And there’s another one which uses a system of predefined columns.
A, nice, columns
You can’t use the em as a unit in most pixel-editors. If we use these types of editors in our design process, this means that we have to calculate em-sizes from pixel-sizes. And if we do that, an em
seems like a terribly complex unit. Pixels use the simple metric system, which is easy to use. We all know how to count from 1 to 10. If we calculate em-sizes from pixel-sizes we’re suddenly working with multiples of 16, instead of 10. Which is much harder.
But pixels are hard as well
There’s always been a problem with using the em
on the web. The core of this problem is that there is no option in Photoshop to use the em
as a unit. That’s really the only reason we use pixels. We have to use them in Photoshop. This pixel-thinking has influenced our em-thinking. Many developers use calculators to turn pixel-values into em-values. And thus we turn a pixel-perfect photoshop template into a pixel-perfect, but fluid website. But turning pixels into ems is hard. They don’t really match. They result in crazy numbers. There is a very clever hack that tries to solve this problem. But, as with all hacks, it creates new, worse, problems.
What’s the trick?
The em
unit is a very useful unit. You should use it to set the font-size of the typography in your web project. It’s a wonderfully flexible unit. If you set up a typographic scale — with a tool like Type Scale or Gridlover for instance — and later on in the project you find out that the ratio is beautiful but the font-sizes are too small, it’s very easy to fix. Simply increase the font-size on your HTML element and you’re done.
Sure, sounds easy
Bijna iedereen ziet inmiddels wel in dat de watervalmethode niet geschikt is voor het maken van websites. Dat werkt goed in een productie-omgeving, zoals een fabriek, maar de meeste websites zijn uniek. Het maken van een website is geen productie, het is een design-proces.
inderdaad
I created some very slow animations. I created these so people can use their old tablets as an art frame. There is a problem with the old Blackberry Playbook that I have though: it will go to sleep after 5 minutes. On the fantastic #fronteers IRC channel I asked if somebody knew a way to prevent this from happening from within the browser. There appears to be one!
What is it?
I order my computers to generate works of art for me. Either on a daily basis, or on demand, whenever a human needs some. I never work for robots, robots work for me.
I started this project because I don’t understand why some things are beautiful and others aren’t. That’s why I order the computer to always generate something else.
Nice starting point, go on
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.
Good
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?
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
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
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?