New to Typophile? Accounts are free, and easy to set up.
feedback on the type on my website.
Posted by laniblaze in
25 Nov 2010 — 2:22pm
25 Nov 2010 — 2:22pm
can you guys please give me some feedback on the type on my blog? I have no idea what I am doing. http://bit.ly/ifhd6T
ignore the lowercase and the bad writing. thanks. :)
User login
Support our Sponsors
25 Nov 2010 — 5:24pm
BIG LETTER SIZE. Go for 11-13 px.
25 Nov 2010 — 10:53pm
Why? Do we need yet another unreadable website?
26 Nov 2010 — 12:22am
The big size actually lowers the readability here (96 ppi). The leading should be increased. You declare font-sizes 48 times in your css. This is too much. You make excessive use of classes and IDs. Are they really all necessary?
26 Nov 2010 — 2:08am
@Arne: Just lean back. It's good for your eyes.
But, yes, the body text needs a kick in the line-height parameter. It's 4px under the font-size right now, causing ascenders and descenders to tangle.
Wonder if folk will ever figure out that setting font sizes in px will bite them in the fluffbunny on multi-hundred-dpi displays...
26 Nov 2010 — 2:30am
Well, they may or they may not, depending on how intelligent the browser is. 12px on a 96 dpi (standard) display should be scaled to 38px on a 300 dpi display. There's no reason px has to map to actual device pixels.
For example, with Apple's double-resolution "Retina" display, px doesn't map to pixels anymore. And of course it never really did since Mobile Safari scales the page in various ways as the user manipulates it.
26 Nov 2010 — 3:57am
I don't know if I'm too tired or not, but the W3C's px unit looks like an effin mess to me. The pathological case would be that 1px should jump to five actual pixels in length if I moved to a coupla fathoms away from the display.
I need a beer.
26 Nov 2010 — 5:27am
I like the larger font size myself, but I think it does look better small, sad to say. For example the replies here. That is a nice looking font and size, but I want my website font bigger.
I found this and was trying to implement some of what the person is saying.
http://www.threestyles.com/tutorials/css-tips-for-better-typography/
Arno, it a template, I'm just editing it. I'll go in and clean up the CSS though, I figured it needed to be that way.
I'll change all the fonts from px to em. I never use the em because it seems to make everything HUGE and I don't understand it. I'll read up on it. What should the line-height be in relation to the em? If the font size is 1em what should the leading be?
Thanks!
26 Nov 2010 — 6:17am
If you were going for the 'blocks of glyphs' look to discourage people from reading the content, you nailed it :)
Wouldn't hurt to check out http://www.nytimes.com/
26 Nov 2010 — 9:48am
jabez is funny! ;)
ok, I changed my site a bit.
The nytimes uses px btw. :)
27 Nov 2010 — 10:45pm
On my private pages I use mm (millimetres), an absolute size. Mind, they are mostly a fanfic library, so the expectation that 4.23mm (12pt) remain 4.23mm nomatter if your display unit resolves 3.8dpmm (~96dpi) or 47dpmm (~1200dpi) sounds reasonable to me.
The em is a relative size. 1em is 100% of the parent's font-size parameter.
Btw: I copied your page onto my machine, then went... playful... on it.
1. I copied the 'font-family' from 'body' to '.entry', then changed the one in 'body' to be an Arial/Helvetica/sans-serif catch-all. In 'body' I also dropped 'line-height'.
2. To 'font'family' in '.entry' I added Droid Serif and Nimrod, both of which are tall-x types that put up with a font-size of 13px.
3. I added 'font-style: normal' to '.entry p:first-child:first-letter' since I preferred to see the cap upright.
Just for the hack, I then tried it with the freely-available (and GPLed) ADF types:
1. Added 'Gillius ADF' to '.smallheadline1', '.smallheadline2' and '#menu a'.
2. Added 'Tribun ADF Std' to ',entry' and upped 'font-size' to 14px.
3. Added 'Tribun ADF Std' to '#content div .largeheadline'.
4. Added 'Tribun ADF Std Cond' to '#blogtitle h2' and '#tag'.
5. Added 'Universalis ADF Std' to 'body'.
6. Added an '.entry blockquote' subsection:
.entry p:first-child::first-letter {
font-style: normal;
font-size: 3.571em;
line-height: 0.76em;
padding: 0.04em 0.08em 0 0;
color: #C00;
float: left;
}
.entry blockquote {
font-family: "Ikarius ADF No2 Std";
}
.entry blockquote p:first-child::first-letter {
font-size: 2.571em;
}
FYI, Gillius is a Gill Sans look-a-like, Tribun resembles Times and Universalis has a Futura flavour. Not sure about Ikarius.