| title | authors | intro | types | categories | published | updated | status | ||||
|---|---|---|---|---|---|---|---|---|---|---|---|
Fonts and Small Caps |
|
The [IE test drive website](http://ie.microsoft.co... |
|
|
2012/03/05 12:00:00 |
2012/03/05 13:00:00 |
archived |
The IE test drive website has some new demos that show the use of OpenType font features . Over the next few weeks I thought I'd take a look at each of the different features in turn.
OpenType is a technology that is supported by IE10 and Firefox 4+ allows you to use some of the features that are stored in font files to make fonts on webpages look better, you can read more about it here. So on to todays topic:
Capital letters are a good way make certain things standout, however they can look out of place when they are used in conjunction with lowercase letters. Small caps are uppercase characters but are drawn to have the same height and weight as lowercase letters, this ensures they balance well with uppercase letters. Well-designed small capitals are not simply scaled-down versions of normal capitals; they are expertly created to use the same stroke weight as other letters, and a wider aspect ratio which improves readability.
If the font you are using has small caps built into the font file then you can use the following experimental code to use the feature.
-ms-font-feature-settings: 'smcp' 1 -moz-font-feature-settings: 'smcp=1'
Be aware that this is experimental and at this stage and it would be unwise to use this in production websites. We use vendor prefixes to convey that this feature is experimental. If you want to know more about vendor prefixes then check this post out.