Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Interactive Guide to Blog Typography

kaikkonendesign.fi

Post reply on HN
Print view View original

41–46 of 46 posts

Re: Interactive Guide to Blog Typography

#41

Post by lloeki »

pknight wrote: post #33
Silhouette wrote: post #11

Earlier quoted context omitted.

As someone with a background in both mathematics and typography, I'm still trying to figure out how people come up with that sort of nonsense. There are times when constants like the Golden Ratio are relevant and the exact value matters or some useful property doesn't apply. This is not one of those times. There is absolutely nothing "perfect" or "optimal" about the typography you'll create from this "solid mathemati…

What a poor comment and wholly unnecessary. Even though I agree that the golden ratio article here is fanciful to a fault, the whole premise here is to put some thought into typography and calibrate text to look its best. The math here is entirely relevant: knowing what the measure / font size should be, or at least figuring out minimum and maximum dimensions, that makes a difference. Got a responsive text container?…

> Even though I agree that the golden ratio article here is fanciful to a fault

This is, dare I say, the mistake. What's emphasised in those articles about the golden ratio is that it is golden where what actually matters is that it's a ratio, and therefore creates patterns and introduces consistency.

Re: Interactive Guide to Blog Typography

#42

Post by lloeki »

whit537 wrote: post #24

I like the "p + p" trick to not text-indent initial paragraphs: http://kaikkonendesign.fi/typography/section/7 Looks like that's an "adjacent sibling selector": http://www.w3.org/TR/CSS21/selector.html#adjacent-selectors And it looks like it's well-supported since IE9: http://www.quirksmode.org/css/contents.html

I'm often using it to select stuff like h2+div { ... }, label + textarea { ... } or (LESS-style) label { & + input, & + select { ... } }.

Re: Interactive Guide to Blog Typography

#43

Post by leephillips »

vanni wrote: post #25
leephillips wrote: post #22

Earlier quoted context omitted.

I've been wondering why people seem to prefer to code with a dark background, but read prose with a light background. Or am I wrong?

When coding, you usually fine-tune your editor color scheme: light text colors on a not too dark background are relaxing for my eyes. When reading, instead, you cannot easily change the color scheme of web pages with black background and painfully high contrast. Example of a website with color scheme alternatives: http://www.textfiles.com/directory.html «AAAAH! MY EYES! Click here if you prefer a black and white colo…

So it would seem that the ideal color scheme for a website would be moderate contrast with light text (perhaps in various colors) on a dark background, rather than what appears to be the web designer consensus of dark text on a white or nearly white background.

Re: Interactive Guide to Blog Typography

#44

Post by vanni »

leephillips wrote: post #43
vanni wrote: post #25

Earlier quoted context omitted.

When coding, you usually fine-tune your editor color scheme: light text colors on a not too dark background are relaxing for my eyes. When reading, instead, you cannot easily change the color scheme of web pages with black background and painfully high contrast. Example of a website with color scheme alternatives: http://www.textfiles.com/directory.html «AAAAH! MY EYES! Click here if you prefer a black and white colo…

So it would seem that the ideal color scheme for a website would be moderate contrast with light text (perhaps in various colors) on a dark background, rather than what appears to be the web designer consensus of dark text on a white or nearly white background.

I don't know. The two scenarios differ because when coding you often stare at one line, whereas when web surfing you often skim the text. It sounds as a subjective feeling.

Re: Interactive Guide to Blog Typography

#46

Post by fadeyev »

tommikaikkonen wrote: post #14
hisyam wrote: post #13

The subheadings should be closer to the paragraph underneath it. Otherwise it looks freely floating between two paragraphs.

Agreed. I'm going to fix this in an update.

The margin under the subheading should be the same (or at the very least not smaller) than the bottom margin of each paragraph, otherwise you end up with the subheadings looking like they're attached to the paragraphs that directly follow them, creating a false hierarchy with a single paragraph rather than a selection of paragraphs. If you want to give each section extra separation increase the margin above the heading instead of decreasing the one below it.
Post reply on HN