dan-menard.com

Back in January I wrote a post about how I’m going to try to update every Monday for the entire year, and keep track of how many weeks work and how many weeks don’t. For the first time all year, I missed a week.

I’d like to say it’s because I’ve been busy (I have) or because the computer I normally use for blogging won’t boot (it won’t) but the truth is I had a really good post I wanted to write that I didn’t get done, and that’s lame. I’ll have it up in a couple of days, but until then I’ve prepared a list of pretty things for you to look at while you wait.

Last week, a friend of mine asked me what design blogs I currently follow, and here’s what I sent back:

Smashing Magazine — Easily the most popular name on the list. I find they do post a fair bit of noise, but they have some really good stuff every now and then that’s certainly worth following for.

For a Beautiful Web — Probably the best design blog I follow. Lots of interesting stuff, highly recommend.

I Love Typography — This is the only strictly-typography blog that I follow. Gives a very good summary of new and interesting type-related things once/week and a few other misc posts here and there (which are usually pretty interesting).

100 Redesigns — This guy is doing something really cool: every week he picks some ugly looking major website and posts a redesign for it. They’re good designs, and I find them inspiring because redesigning web sites is a valuable skill.

Dustin Curtis — This guy makes a completely new design for every post on his blog, and he’s a totally ace designer. Oh, and his posts are great too.

Jason Santa Maria — This guy has some remarkable credentials and his blog is a great source for interesting design-related ideas (though posts are often few and far between).

Stop Design — Another guy with an awesome design blog that doesn’t update often. He’s a graphic designer that used to work for Google but now works for Twitter, and his website is literally the best-designed website I’ve ever seen. Every time I visit I find something new about it that I totally love.

Colour Lovers — This isn’t really a design blog, but it’s good inspiration for colour palettes, and every once in a while they post a gem of an article about colour theory or how colours are interpreted on a biological level.

The Oatmeal — Ok, so this is clearly a web comic of sorts, but the design of the comics is always top-notch and I learn more from one of these comics than I do from ten self-proclaimed ‘awesome CSS galleries’.

Who do you Follow?

If you follow any great design blogs, I’d love to hear about them; leave your own list in the comments.

Font Stack (n) : A list of several fonts provided from a website to a browser via CSS from which the browser will chose a font with which to render the associated text. eg. font-family: Helvetica, Arial, sans-serif;

This is a pretty simple concept to understand. To show text on screen, the browser needs to use a font, and the way web developers tell the browser which font to use is by making a font stack like the one shown above. The browser will go through the list from left to right, and when it finds a font that it can use, it renders the text using that font. So you put the ideal font first, then the next-best-thing that looks pretty similar, then maybe another back-up or two, then a default like serif or sans serif, which essentially tells the browser to use whatever default font it has of that type.

I was sifting through WordPress themes the other day when I stumbled upon:

font-family: Georgia, sans-serif, Verdana;

Let’s take a moment to go over the various atrocities committed by this abomination:

1. Georgia is a serif font, while Verdana (and obviously sans-serif) are sans-serif fonts. It’s purely nonsensical to include serif and sans-serif fonts in the same stack — you either want serifs or you don’t.
2. Browsers choose fonts from left to right, remember? And sans-serif is one of those default fonts we talked about, so it’s guaranteed to always be supported by all browsers. This means that the Verdana in that stack will never be used, ever. There is absolutely no reason to include another font after a default.
3. One of the notable characteristics of Verdana is that it’s very wide. The wider the font, the less characters will appear on a single line. It’s a terrible idea to include a wide font, such as Verdana, in the same stack as a comparatively thin font, such as Georgia (or Arial, which is a more common mistake) because now the width of your lines, the length of your page, and the general look and feel of your text vary greatly depending on which font is used.

Horrible! But all is not lost; here are a few simple guidelines to make sure you don’t create anything similar:

1. Never mix serif and sans-serif fonts in the same stack.
2. Always include a default font, but always put it at the very end.
3. Always test each font first to make sure your lines break in about the same places and that your text still has the same general shape.
4. Never guess — the internet is a wonderful place with plenty of resources for the aspiring typophile, use them!