A place to cache linked articles (think custom and personal wayback machine)
Du kannst nicht mehr als 25 Themen auswählen Themen müssen mit entweder einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

vor 4 Jahren
1234567891011121314151617181920
  1. title: Use real small caps; avoid fakes
  2. url: http://practicaltypography.com/small-caps.html
  3. hash_url: 13cdde344f3505f6c7372746fae8a2cb
  4. <p><first-use>Small caps</first-use> are short cap­i­tal let­ters de­signed to blend with low­er­case text. They’re usu­ally slightly taller than low­er­case <span class="no-hyphens">letters.</span></p><p>I’m a big fan of small caps. They’re a great al­ter­na­tive to <a href="http://practicaltypography.com/bold-or-italic.html" class="xref">bold or italic</a> or <a href="http://practicaltypography.com/all-caps.html" class="xref">all caps</a>.</p><p>But most peo­ple have never seen real small caps. They’ve only seen the er­satz small caps that word proces­sors and web browsers gen­er­ate when small-cap for­mat­ting is <span class="no-hyphens">used.</span></p><style type="text/css">
  5. .fake-small-caps{
  6. font-family: Equity;
  7. }
  8. .shrink {
  9. font-size: 72%;
  10. text-transform: uppercase;
  11. }
  12. .real-small-caps{
  13. font-family: EquityCaps;
  14. }
  15. </style><table class="example"><tr><td style="font-size:190%"><example-text><span class="fake-small-caps"><span>W</span><span class="shrink"><span>itness</span></span><span> P</span><span class="shrink"><span>rotection</span></span></span></example-text></td><td><example-caption>fake</example-caption></td></tr><tr><td style="font-size:190%"><example-text><span class="real-small-caps"><span>Witness Protection</span></span></example-text></td><td><example-caption>real</example-caption></td></tr><tr><td style="font-size:190%"><example-text><div style="font-size:60%;font-family:equity-text"><span>Trixie Argon, </span><em><span>Ways to Be Wicked</span></em><span>, in</span><br /><span class="fake-small-caps"><span>C</span><span class="shrink"><span>onjuring</span></span><span> </span><span class="shrink"><span>for</span></span><span> B</span><span class="shrink"><span>eginners</span></span></span><span>, at 137–39</span><br /><span>(London, Quid Pro Books, 2004).</span></div></example-text></td><td><example-caption>fake</example-caption></td></tr><tr><td style="font-size:190%"><example-text><div style="font-size:60%;font-family:equity-text"><span>Trixie Argon, </span><em><span>Ways to Be Wicked</span></em><span>, in</span><br /><span class="real-small-caps"><span>Conjuring for Beginners</span></span><span>, at 137–39</span><br /><span>(London, Quid Pro Books, 2004).</span></div></example-text></td><td><example-caption>real</example-caption></td></tr></table><aside>Ty­pog­ra­phers use the word <em>color</em> to re­fer to how light or dark a text block ap­pears on a page (even if all the char­ac­ters are <span class="no-hyphens">black).</span></aside><p>Small-cap for­mat­ting works by scal­ing down reg­u­lar caps. But com­pared to the other char­ac­ters in the font, the fake small caps that re­sult are the wrong height, and their ver­ti­cal strokes are too light. Whereas with real small caps, the <a href="http://practicaltypography.com/color.html" class="xref">color</a> and height have been cal­i­brated to blend well with the nor­mal up­per­case and low­er­case <span class="no-hyphens">letters.</span></p><p>There­fore, two rules for small <span class="no-hyphens">caps:</span></p><ol><li><p>Don’t click on the small-cap for­mat­ting box in your word proces­sor. Ever. And don’t use the CSS prop­erty <code>font-vari­ant: small-caps</code>. Ever. These op­tions do not pro­duce small caps. They pro­duce in­fe­rior <span class="no-hyphens">counterfeits.</span></p></li><li><p>The rules for <a href="http://practicaltypography.com/all-caps.html" class="xref">all caps</a> also ap­ply to small caps: use small caps spar­ingly, add <a href="http://practicaltypography.com/letterspacing.html" class="xref">let­terspac­ing</a>, and turn on <a href="http://practicaltypography.com/kerning.html" class="xref">kern­ing</a>.</p></li></ol><p>Now for the bad news. If you want real small caps, you’ll have to buy them—they’re not in­cluded with any <a href="http://practicaltypography.com/system-fonts.html" class="xref">sys­tem font</a>.</p><p>Some­times, small caps come in their own font file that shows up sep­a­rately in the font menu. So when you want small caps, you for­mat the text with the small-cap font. Other times, small caps are in­cluded in the main font file as an <a href="http://practicaltypography.com/opentype-features.html" class="xref">Open­Type fea­ture</a> (named ‘smcp’). But ei­ther way, you can also use <a href="http://practicaltypography.com/paragraph-and-character-styles.html" class="xref">para­graph and char­ac­ter styles</a> to ap­ply small caps, and elim­i­nate the te­dium of find­ing <span class="no-hyphens">them.</span></p><div class="btw"><div class="btw-title">by the way</div><ul><li><p>With small caps, it’s your call whether to use reg­u­lar cap­i­tal let­ters at the be­gin­ning of cap­i­tal­ized words. I pre­fer not <span class="no-hyphens">to.</span></p></li><li><p>Both <a href="http://practicaltypography.com/equity.html" class="xref">Eq­uity</a> and <a href="http://practicaltypography.com/concourse.html" class="xref">Con­course</a> have sep­a­rate sets of small-caps fonts with the let­terspac­ing al­ready baked in. This saves la­bor. It also al­lows you to get prop­erly spaced small caps in any pro­gram, even those that don’t sup­port Open­Type fea­tures or let­terspac­ing. (In­clud­ing web browsers—see <a href="http://practicaltypography.com/letterspacing.html" class="xref">let­terspac­ing</a> for <span class="no-hyphens">more.)</span></p></li></ul></div>