Btw: This article seems to indicate the glyph order of Wingdings is patented by Microsoft.

Frank,

the obvious solution is to use a webfont that includes smallcap glyphs in both uppercase and lowercase positions.

Also, please note that the CSS3 Fonts proposal introduces the font-variant-caps: small-caps and font-variant-caps: all-small-caps properties to access OpenType Layout smallcaps, and also modifies the description of font-variant: small-caps to try OpenType Layout smallcaps first, and only apply uppercase downscaling as a fallback. Of course, it will take considerable time before this gets introduced.

Regards,
Adam

Since these are pure symbol fonts and deliberately do not have Unicode values assigned to them, there is no way you can use a 'substitute' font ... On my Mac, all Webdings and Wingdings glyphs are encoded into the Unicode PUA.

On the other hand, the entire Zapf Dingbats set has been mapped into UC, so these characters can be used "safely". Zapf Dingbats characters, or at least things that look exactly alike, appear in Arial Unicode MS from position U+2701 onwards, as well as correctly encoded in Zapf Dingbats (the fat parentheses are mapped to regular parentheses; from the scissors on, they are mapped similar to Arial UC).

.. the glyph order of Wingdings is patented by Microsoft.

Fortunately they didn't do that for Arial and TNR! :-D

Thanks! Great answers. What about unicode small caps? And how is the support for unicode on mobile browsers?

There are no Unicode small caps but Unicode support on mobile browsers is quite decent these days.

Another option I've been considering (for the ornaments) is replacing text strings with png's using a server side language like PHP, but I'm not sure how to tell if @font-face isn't supported.

http://webfonts.info/wiki/index.php?title=@font-face_browser_support

Adam: ..There are no Unicode small caps ..

Frode: FYI, there are a number of small caps characters defined in Unicode, but these describe the form, rather than the function. The function is for phonetic transliteration of certain speech forms, and these are not to be confused with "regular characters in a small caps form".

Unicode does not define any font appearance at all -- italics, bold, underline, outline, and so on.
It has the advantage that this, combined with a Small Caps feature, will copy a small caps text from a PDF in its original 'lowercase' form. If the font has a c2sc (Caps to Small Caps) feature, the original case of the text will be preserved.

>>> but I'm not sure how to tell if @font-face isn't supported.

http://www.webfonts.info/wiki/index.php?title=Checking_@font-face_suppor...

Thanks Ralf! That’s very helpful.

@frode

You've brought up an interesting problem that calls for an interrim solution because - as Adam observed - it's going to be a good long while before the specs and browser implementations make it clear how to handle small-caps.
As you said, right now, most browsers deal with it by synthesizing small-caps.
I haven't looked into solutions to this problem but I did read somewhere that wherever font-variant small-caps is used, text-decoration:uppercase should also be specified.
If I can remember the page where that advice was dispensed, I'll come back with the link.
I believe the point of doing that is to, at least, force uppercase in those browsers that don't synthesize. I haven't checked out the wisdom of that advice, I'm just passing it along - FWIW.
For now, it's certainly clear that using a separate small-caps font is a necessity.
That much is clear.

Regards,

Rich

Correction: wrote "text-decoration:uppercase" meant "text-transform:uppercase".

Hi Richard. Thanks for pointing that out. I’m not sure how CSS deals with such conflicting styles though.

Did you just change your profile picture? I seem to remember another Richard commenting a lot on the web fonts topic.

Last time I checked, the only way to fake small caps consistently cross-browsers (that is, including IE6) with CSS was to set text-transform:uppercase and font-size:80% (or whatever percentage seems fit).

@frode

re: my profile picture
I'm going through an identity crisis. I'll probably change it again, soon.
(The cougar is the "official" icon of EOTFAST)
Just playing around.

@riccard0

Thanks for the idea on sizing. I'm making a note to work up a test page on this. Compare the fallbacks to a "real" small-caps. Probably be a while before I get to it, though.