オールドスタイルな数字っていうのはGeorgiaとかで見るオシャレなあの数字のこと。Corbelというx-heightが高めでオープン・カウンターという読みやすさ重視のなかなか優秀なサンセリフ体もオールドスタイル。ただ和文とは相性が良くないので、どうにかして数字だけ普通のものに差し替えてみようという試み。
unicode-rangeプロパティー
@font-faceディレクティブのunicode-rangeプロパティーでカスタム・フォントを作成するテクニックを使ってCorbelの数字をCalibriに置き換えてみる。
Demo: Use non oldstyle numbers for Corbel
Chrome 20とInternet Explorer 9で反映される。それ以外ではunicode-rangeプロパティーが無視されるので、アルファベットや記号も含めて完全にCalibriになる。
@font-face {
font-family: "Corbel-Mod";
src: local("Corbel");
}
@font-face {
font-family: "Corbel-Mod";
src: local("Calibri");
unicode-range: U+0030-0039;
}
.test {
font-family: "Corbel-Mod", sans-serif;
}という形でlocal()で読むのでパフォーマンスに影響は殆どない。CorbelもCalibriもないOS Xなどではどうなんの……みたいな感じだけど、そもそもどこの誰でもCorbelを使わせようみたいな話ではないので関係ない。
font-feature-settingsプロパティー
リガチャで脚光を浴びつつあるfont-feature-settingsプロパティーでもlnumを有効にしてやることでChrome 20やFirefox 14(多分4以降)、Internet Explorer 10では可能。
Demo: Use non oldstyle numbers for Corbel #2
ちゃんと設計されたグリフが採用されるのと概ね直観的なプロパティーの記述で済むのが良いところ。
.test {
font-family: "Corbel", sans-serif;
font-feature-settings: "lnum" 0;
}最初font-feature-settingsプロパティーでonumを明示的に無効にしたら普通の数字になるんじゃないかと思って試したんだけどダメだった。それでunicode-rangeプロパティーのを窮余の策として考えだしたんだけど、やり方が全然間違っていただけだった……。OpenTypeの仕様も読まないとなぁ……。
後者のfont-feature-settingsプロパティーを使う方が将来的に安全で字形的に安定だと思う。unicode-rangeプロパティーだとInternet Explorer 9で反映されるというメリットはあるので、条件付きコメントとかで切り分けたりするとかも良いかも。今度どこかでCorbel使おう。