Open grayghostvisuals opened 11 years ago
A screen shot I took using a range of 300px to 460ish-px (via a top secret method called "squeezing my browser window"). The font-size
is set at 100% -or- 16px and the line-height
is 1.3125 -or- 21px. Seems like a nice range for these various contexts as a baseline/standard in RWD (whatever that means. I like to call it just "web design").
[2013-03-04 10:59:06 AM] Zak Kain: it's really content-dependent anyway [2013-03-04 10:59:14 AM] GrayGhostVisuals: yes it is [2013-03-04 10:59:16 AM] Zak Kain: when your content looks like it needs to get smaller, then you break [2013-03-04 10:59:26 AM] Zak Kain: so maybe we just set up one and comment in a guideline or two
To explore further
Great article on viewport sized typography from Chris Coyier. Example depicts using vw units to size the font. http://css-tricks.com/viewport-sized-typography
A few more resources on responsive typography. I'd also like to add molten leading to this list, but alas it's a JS solution. I want it in my CSS man!
Craig Mod wrote an article for A List Apart where he discusses his project Bibliotype
Nick Sherman also wrote on a much different idea with regards to Hinting and the Future of Responsive Typography
http://informationarchitects.net/blog/responsive-typography-the-basics
Fluid Type Looking at the blog of @TrentWalton it appears his use of responsive typography is the following...
<= 599px body { font: normal 100%/1.6 serif } // 16px
>= 600px body { font-size: 112.5% } // 18px
>=800px body { font-size: 125% } // 20px
>=1030px body { font-size: 137.5% } // 22px
>=1200px body { font-size: 150% } // 24px
>=1650px body { font-size: 162.5% } // 26px
Can't seem to put together the relation for his screen sizes yet.
Responsive Type http://codepen.io/jakob-e/pen/Ccahj
bwabwabwaaaahhhh?!
that's crazy, I don't understand what's happening. Gotta take a close look.
ResponsiveFonts mixin (beta) https://gist.github.com/jakob-e/6658437
@jakob-e awesome! Can u explain how this would be used by Authors? Do we use the @includes within a declaration block or on their own?
via Hacker News:
This comment is something that has been on my mind since we started this. The point was to get it out to the community so we can mold it even more so here we are...Responsive Type! dun dun dun dun.
Do we provide
@media
queries to authors via a wizardry@mixin
? Here's an example to get the ball rollin':