Xavier Bertels

The HTML5 <canvas> element is one of the most powerful new HTML5 features:

The canvas element provides scripts with a resolution-dependent bitmap canvas, which can be used for rendering graphs, game graphics, or other visual images on the fly.

The problem with Canvas, is that there are no authoring tools for it, so most of the drawing must be done by hand-coding coordinates and specifications. This is not very convenient. Luckily, thanks to the work of a Microsoft employee, we now have Ai2Canvas. You guessed it right: an Adobe Illutrator to Canvas conversion plugin. Check out the introduction video below!

I will be evaluating the Ai2Canvas plugin over the next few weeks. Let us see where this can take us!

Grids have existed for a very long time in graphic design. Long before the internet was born, graphic designers were using grid systems in their designs. Thanks to people like Khoi Vin and Mark Boulton (and many others I am ignoring for the sake of brevity) grid systems have significantly gained popularity in web design. An example of one of the most commonly used grid systems today is probably the 960 Grid System, which is also a nice CSS framework.

But making a proper grid with semantically correct html and CSS has long been a serious pain in the ass. Today, we still need superfluous <div> elements and the least you can say about the CSS code required to make it work, is that it is needlessly complex.

Thanks to the wonderful work on the CSS3 spec, easily crafting flexible, multi-column layouts with a minimal use of CSS is slowly becoming reality. Making flexible horizontal grids with CSS will soon be as straightforward as defining column-count, column-width, column-gap and column-space-distribution properties on your containing html element.

This made me think. Apparently, the CSS3 contributors have somewhat ignored vertical rhythm grids/typographic grids/baseline grids/whatever you like to call it. The same kind of problem that exist with horizontal grids, also exists with baseline grids.

And CSS3 is not fixing it.

So, let us talk baseline grids. Those of you that are familiar with InDesign, probably know what I am talking about. If you have never set a baseline grid, now might be a good time to start exploring the possibilities. Take a look at the following image:

Found on the ever-wonderful Typophile

As you can probably see, design can easily benefit from a properly set baseline grid. Yes, you can set baseline grids by hand. But setting baseline grids on the web is, well, less than straight-forward.

I am not arguing that everything should be aligned to a baseline grid. For the love of creativity, please do not! A CSS3.x implementation of baseline-grid, on the other hand, would be most welcome at times. Is my head too high in the sky for dreaming of this?

Yves Peters has written a very good introduction into font licensing and why free is not always just gratis. The article is definitely worth reading if you are just getting into the complex minefield of (font) licensing.

I am not all too fond of those “here’s what you should do” type of articles. I rarely find them interesting, and in the light of Seth Godin’s But What Have You Shipped? post, I have commited to stop reading those Smashing-magazine-style articles altogether. They are a waste of my time.

But then there is the wonderful A List Apart, home to genious authors such as Jack Cheng, who actually knows how to write an engaging, interesting, scientifically-backed article about your habit fields and what you can do to change them. For those of you that are looking for the magical ten-tips-programme, I have to disappoint you: the article is not a free all-access pass to a ride on the GTD-rollercoaster, but rather an explanation of what habit fields are and how to fundamentally and actively change them, in order to change your habits.

Go, read Habit Fields by Jack Cheng.

And, according to designer Francisco Inchauste, here is why. A very good, enjoyable read.