Typographic practices

[dubiousdisc]

Curious: what are your practices in the matter of web typography?

(Right now I'm working on the paperback marathon shrine and I'm making a layout whose text and vertical rhythm is all based on multiples of 4, so I'm curious to know about YOUR sorcery!)

[anon]

Oh, man, hearing you say that makes me blush in embarrassment because I've always used the same fonts for my designs. I usually go for Garamond and Arial, italicized or bolded to separate words when putting them on a single line.

[Destinie]

I try to balance serif and sans-serif fonts. For the screen, studies show it is easier to read sans-serif so I usually go with an Arial or Verdana. For Headers I may balance out with a Serif like Georgia but I also and very partial to Century Gothic. (IDK I just love that font).

I also have to have good line spacing in my body content. I have to create good negative space for the lines to breathe. I know it creates and extra horizontal space, visually, but I like having that break in between to kind of rest your eyes. I like when the text can breathe.

I could keep going about all the little things and how I can spend hours tweaking text but.... |D;;

[Mikari]

For content I keep it simple, Verdana and sometimes Arial. I also like adding a bit to the line height and sometimes to the spacing so that the text doesn't look cluttered like a big wall of scribbles. For the site tittle on the layout I use all kinds of decorative fonts.

[dubiousdisc]

I try to balance serif and sans-serif fonts. For the screen, studies show it is easier to read sans-serif so I usually go with an Arial or Verdana. For Headers I may balance out with a Serif like Georgia but I also and very partial to Century Gothic. (IDK I just love that font).

I also have to have good line spacing in my body content. I have to create good negative space for the lines to breathe. I know it creates and extra horizontal space, visually, but I like having that break in between to kind of rest your eyes. I like when the text can breathe.

I could keep going about all the little things and how I can spend hours tweaking text but.... |D;;

I've heard countless debates about sans-serifs being more suitable for screen too but I think that has more to do with how they're rendered by browsers and screens at small sizes than with the actual shape of the text, considering that it works with books at sizes that are comparatively not that much bigger...though, as of lately I've seen pop up a few serif typefaces that render well on screen even at around 14-15 pts, so the time might be ripe for us to start comfortably using serifs for body text.

I like my typography to be on the large side, with a lot of air and contrast. I admit on not even bothering to click after the front page if I visit a site that's all small fonts and low contrast. My eyesight is awful bordering on legally blind and my school is, if you can't bother to make your site readable, why should I bother to read it?

I try to pay attention to have all heading hierarchies and line heights to follow some sort of mathematical rule. It doesn't always work out as intended so I tweak and often destroy the rule I had started with, but I try. XD Even though Arial is bashed as a bad copy of Helvetica, I think it has its own personality on screen, so I use it a lot. On screen, Helvetica usually works better for me on headings, not in body copy.

Also, a lot of times I do site headings with nothing more than huge text. Usually the starting intention is to have everything be pure text (no images), but I tend to want it to be more finely adjusted than what I think that's reasonable to have in pure code, so I usually go screw it and go with transparent PNGs. :B

One tweak I end up using a lot is setting paragraphs to only have a margin on the bottom so a heading and its first paragraph can be closer.

Ramble, ramble...Destinie, please, go on xD

[Mikari]

I like using transparent pngs too, but only for the main tittle and sometimes the navigation, with image mouse over effects.

[Destinie]

I don't think Arial is awful at all and I know lots of people who really love Helvetica. It's a nice, clean font, but I agree that Arial does have its own personality. I rather like using Arial on my websites. Also, it's browser safe for the most part.

I think when designing for a shrine, Typography is really important. Like you said, Dubious, why bother to try to read it if it's not readable? Especially if you have a lot of text, making the site readable is really important. For my shrines, I also try to make the width of the text container to be a set size, usually a small space, even though you need to scroll to read (no harm in scrolling!!) it's easier on your eyes to read in a small space. I try to keep that in mind, too.

[dubiousdisc]

Oh yeah that too. What do you consider to be the optimal width? I try to never make it wider than 50% of the screen width.

[Mikari]

Oh yeah that too. What do you consider to be the optimal width? I try to never make it wider than 50% of the screen width.

it depends on the layout and the layout depends on the theme and content. I like to keep the text at least 10px away from the div margin and at least 50px (usually more) away from the edge of the screen in the rare case of having a layout that doesn't have a (visible) div containing the text.

[Destinie]

Optimal width for me is usually between 600-800px (sometimes smaller if columns are involved). I still *try* to optimize for 800x600 resolutions because, believe it or not, there are people out there who still use it. (But I don't know if they're browsing any of my sites or not, ha!) Plus, it's a little nicer to read on a huge screen. :x