.mindgarden is the digital playground of marc tobias kunisch

.opinions on this website are in not necessarily those of my employer

.send an email to info 'at' mindgarden 'dot' de

.follow the mindgarden on twitter @mindgarden_de or @tobestobs
.occasional guest bloggers are @lwsrc, @dheeva and @idrathernot

Jan 24 2011 by tobs

Web fonts: always specify a line-height

One aspect of web typography that slightly borders on magic to everyone who is not a font designer are font metrics.

Typekit’s Tim Brown has published an excellent piece on vertical font metrics on the typekit blog. In it he explains:

Font files provide structure for glyphs by establishing the invisible bounds that will govern them. A font’s em square and baseline determine its relative size and placement when typeset. Vertical metrics influence the height of ascenders and depth of descenders.

and also why this can be a challenge for web designers:

Even when fonts’ em squares are sized to the specification of our CSS, the positioning of fonts’ baselines, the size of letterforms relative to their em squares, and fonts’ vertical metrics will vary from typeface to typeface. So the size and spacing of text we see in web browsers will also vary

To paraphrase in short: the appearance of text can vary depending on the font you use.

Addressing these issues with vertical metrics Raph Levien from the Google web fonts team has posted some recommendations on the topic. As this discourse is taking place very much in the context of font design which can be a bit obscure to the us regular web designers, I want to extract the advice to web designers found in it and re-emphasize it here:

Always specify an explicit line-height CSS property (for example, 1.2), rather than relying on “line-height: normal”. The latter cannot be made to be completely consistent across all browsers, and is also likely to change as the vertical space budget is increased to extend fonts into more international scripts.

By not setting your line-height your simply setting it to normal you leave it to the browser to calculate the leading of the text on your page. Which can vary across browsers and operating systems. By setting your line-height you reduce the risk of any clipping of text taking place.

If you are a bit rusty in these finer details in typography there is an excellent set of slides by Russ Weakley on slideshare that lets you refresh your memory:

Sep 29 2010 by tobs

“I,” she told him, “can believe anything. You have no idea what I can believe.”

“I can believe things that are true and I can believe things that aren’t true and I can believe things where nobody knows if they’re true or not.

I can believe in Santa Claus and the Easter Bunny and Marilyn Monroe and the Beatles and Elvis and Mister Ed. Listen—I believe that people are perfectible, that knowledge is infinite, that the world is run by secret banking cartels and is visited by aliens on a regular basis, nice ones that look like wrinkledy lemurs and bad ones who mutilate cattle and want our water and our women. I believe that the future sucks and I believe that the future rocks and I believe that one day White Buffalo Woman is going to come back and kick everyone’s ass. I believe that all men are just overgrown boys with deep problems communicating and that the decline in good sex in America is coincident with the decline in drive-in movie theaters from state to state.

I believe that all politicians are unprincipled crooks and I still believe that they are better than the alternative. I believe that California is going to sink into the sea when the big one comes, while Florida is going to dissolve into madness and alligators and toxic waste. I believe that antibacterial soap is destroying our resistance to dirt and disease so that one day we’ll all be wiped out by the common cold like the Martians in War of the Worlds. I believe that the greatest poets of the last century were Edith Sitwell and Don Marquis, that jade is dried dragon sperm, and that thousands of years ago in a former life I was a one-armed Siberian shaman. I believe that mankind’s destiny lies in the stars.

I believe that candy really did taste better when I was a kid, that it’s aerodynamically impossible for a bumblebee to fly, that light is a wave and a particle, that there’s a cat in a box somewhere who’s alive and dead at the same time (although if they don’t ever open the box to feed it it’ll eventually just be two different kinds of dead), and that there are stars in the universe billions of years older than the universe itself. I believe in a personal god who cares about me and worries and oversees everything I do. I believe in an impersonal god who set the universe in motion and went off to hang with her girlfriends and doesn’t even know that I’m alive. I believe in an empty and godless universe of causal chaos, background noise, and sheer blind luck. I believe that anyone who says that sex is overrated just hasn’t done it properly.

I believe that anyone who claims to know what’s going on will lie about the little things too. I believe in absolute honesty and sensible social lies. I believe in a woman’s right to choose, a baby’s right to live, that while all human life is sacred there’s nothing wrong with the death penalty if you can trust the legal system implicitly, and that no one but a moron would ever trust the legal system. I believe that life is a game, that life is a cruel joke, and that life is what happens when you’re alive and that you might as well lie back and enjoy it.”

Neil Gaiman: American Gods

Aug 24 2010 by tobs

Webfontday in München

The first german Webfontday will take place on November 13th in Munich. The Typographische Gesellschaft München is organizing the event:

Die tgm hat zahlreiche namhafte Experten eingeladen, um die erste Konferenz zum Thema »Webfonts« auszurichten. Einen Tag lang werden Sie Gelegenheit haben, wertvolle Einblicke rund um das Thema zu sammeln. Die Bandbreite der Vorträge wird dabei sowohl technische als auch gestalterische Fragestellungen berücksichtigen, eine Podiumsdiskussion bietet das nötige Diskussionsforum.

( english translation )

I’m having the honor to represent the Google Web Font team and to do a presentation about the Google Font Directory. This is the first conference that I’m aware of that is dedicated exclusively to web fonts and other speakers include Bryan Mason of typekit.com and Jörg Schweinsberg of Linotype.

Sign up here: http://www.webfontday.de/content/anmeldung

Oh, and If you want to keep track of the latest news about the Font Directory we’ve just launched the web font blog here: http://googlewebfonts.blogspot.com/

Jul 07 2010 by tobs

On Problems

I was part of a discussion with an esteemed friend of mine recently. My argument being that responsive design is great and that we should consider using it on our own pages.

His view of things was that as long as there is no problem with how we currently do things then we shouldn’t come up with a solution.

This premise that every change in how we do things needs to be triggered by a problem that needs solving to me is a very depressing thought. Of course it’s very easy to come up with all kinds of problems that suit pretty much any solution (to stay in the terminology). But I don’t think that is what he has in mind as he probably wouldn’t let “pages as we build them now are not as good as they could be” count.

Where my philosophy differs is that things do not have to be broken in order to try to make them better. I don’t think Mercedes would claim there is a problem with their cars. Still they aim to make them better with every iteration. The same should be the case for the web sites we build.

When I sit down to build a website I try to build the best website possible. That’s called quality. Good enough is boring. I don’t think I’d be doing what I’m doing if my professional life would consist of waiting for problems to arise and then fix them.

What’s great about what I’m doing is that there’s inspiration all the time. Sometimes it’s almost too much. Things are moving and getting better. And technologies are still evolving in a medium that’s still in it’s early days. People are coming up with new techniques all the time. Some are useless. Some are just not a good idea (why would I want to build an iPhone icon with CSS for example?). But it is good this is happening because inbetween there are great ones. This makes the web better in general.

To look at the example of media queries and Jon Hicks in particular, it is easy to say “oh, I’ve used media queries a long time ago” (I’ve done that here on this blog ) or “this could have been done using floats”. The point is doing so doesn’t make this less inspiring to people. It doesn’t make it less of a good idea.

I think media queries are a great step forward. Not a solution but an innovation. And one that makes sense as well. It would be narrow minded to ignore the bigger picture of how the web is changing to be at home on a much wider scale of devices. And if you absolutely have to think in negatives in order to to something positive, here’s a problem:

Websites as we build them now don’t work well on devices that are not a desktop or laptop computer.

[update:] I got Mr. HIcks’ first name wrong in my post. I just corrected the mistake. Apologies to Jon Hicks, mistakes like these shouldn’t happen.

← Previous  1 2 3 4 … 154 Next →