1031 posts
  • Sold between 100 000 and 250 000 dollars
  • Elite Author
  • France
  • Author had a File in an Envato Bundle
  • Author had a Free File of the Month
  • Contributed a Tutorial to a Tuts+ Site
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
+4 more
Pixelworkshop says

Hello there, I wanted to share some ideas about grids and typography, and maybe learn something :)

Since I began design, I tried several grids like the 960gs or Blueprint. Now I’m trying a vertical grid and I find it very useful but I’d like to ask how you use them. I mean, if you have a 12px font, do you set guidelines every 18px ? And try to keep the same proportion for all headings, titles, subtitles (12, 18, 24px) ?

Second thing : typo. I read some really interesting articles like Compose a vertical rythm or Five simple steps to better typography, do you know other ressources to learn more ?

1173 posts
  • Australia
  • Beta Tester
  • Bought between 1 and 9 items
  • Exclusive Author
  • Has been a member for 5-6 years
  • Sold between 10 000 and 50 000 dollars
Motionreactor says

http://www.alistapart.com/articles/howtosizetextincss/

http://www.alistapart.com/articles/settingtypeontheweb/

Are both relevant, and I’ve found them useful recently. I believe the baseline grid article at ALA references your vertical rhythm article.

1865 posts YOU TOUCH IT YOU BUY IT
  • Bought between 100 and 499 items
  • Referred between 200 and 499 users
  • Has been a member for 5-6 years
  • Won a Competition
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Elite Author
  • Sold between 250 000 and 1 000 000 dollars
+1 more
FRESHFACE says

as motionreactor suggested:

http://www.alistapart.com/articles/settingtypeontheweb

Best article ever, go for it and mix it with 960.gs for instance. This way you will get both vertical and horizontal grid.

Here is also a thread that could interest you:

http://themeforest.net/forums/thread/do-you-use-the-golden-ratio-when-designing-a-website/23623

Here are some cool highly recommended books:

http://www.amazon.com/Systems-Graphic-Systeme-Visuele-Gestaltung/dp/3721201450/

http://www.amazon.com/Elements-Typographic-Style-Robert-Bringhurst/dp/0881792063/

1031 posts
  • Sold between 100 000 and 250 000 dollars
  • Elite Author
  • France
  • Author had a File in an Envato Bundle
  • Author had a Free File of the Month
  • Contributed a Tutorial to a Tuts+ Site
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
+4 more
Pixelworkshop says

Wow thanks a lot !

1031 posts
  • Sold between 100 000 and 250 000 dollars
  • Elite Author
  • France
  • Author had a File in an Envato Bundle
  • Author had a Free File of the Month
  • Contributed a Tutorial to a Tuts+ Site
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
+4 more
Pixelworkshop says
1173 posts
  • Australia
  • Beta Tester
  • Bought between 1 and 9 items
  • Exclusive Author
  • Has been a member for 5-6 years
  • Sold between 10 000 and 50 000 dollars
Motionreactor says

Keep in mind that, in relation to the golden ratio:

It is only a principle, not a rule. Empirical testing as well as thousands of years of art, architecture etc… does indeed suggest that humans have an aesthetic preference for the ratio. The risk of approaching design with the golden ratio as some kind of magic solution should be avoided though. It is useful, and relevant, but contrary to the meaning of ‘golden’ it isn’t the highest principle and shouldn’t mean ignoring broader design considerations.

You probably already know this, but some beginners can be led astray by what appears to be ‘trade secret’. So yeh, just felt like pointing that out. :)

1031 posts
  • Sold between 100 000 and 250 000 dollars
  • Elite Author
  • France
  • Author had a File in an Envato Bundle
  • Author had a Free File of the Month
  • Contributed a Tutorial to a Tuts+ Site
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
+4 more
Pixelworkshop says

Yes I understand, if there was a magical rule for perfect design, everybody would use it… But it’s good to have some strong principles to start with.

Some time ago, I founs an interesting article about mixing fonts (some match, some other don’t) but I cannot find it :( I just remember that there shouldn’t be more than 2-3 different fonts but this is also a principle, not a rule.

1865 posts YOU TOUCH IT YOU BUY IT
  • Bought between 100 and 499 items
  • Referred between 200 and 499 users
  • Has been a member for 5-6 years
  • Won a Competition
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Elite Author
  • Sold between 250 000 and 1 000 000 dollars
+1 more
FRESHFACE says

@keliah

See section C of this: http://webfontspecimen.com/ That C section is a nice tool for comparing fonts in web browser. quote: “Useful for deciding whether type is suitable for use online and helpful for finding a comparable understudy.” download it and play.

1865 posts YOU TOUCH IT YOU BUY IT
  • Bought between 100 and 499 items
  • Referred between 200 and 499 users
  • Has been a member for 5-6 years
  • Won a Competition
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Elite Author
  • Sold between 250 000 and 1 000 000 dollars
+1 more
FRESHFACE says

This is a perfect example of well executed horizontal grid (18px line-height in this case)

http://sushiandrobots.com/

(but I still think fonts in footer are a bit unreadable and small if I take under consideration the amount of free space there… :) )

1734 posts
  • Exclusive Author
  • Won a Competition
  • Sold between 5 000 and 10 000 dollars
  • Has been a member for 4-5 years
  • Referred between 1 and 9 users
  • Bought between 1 and 9 items
VisualSharing says

Hi there, Keliah, here are some of my precious bookmarks related to typography:

This also might be good for you to test different fonts: Typetester .
And this is one of my favourites: Typechart .

by
by
by
by
by
by