Ответ 1
Вы должны заглянуть в веб-загрузчик шрифтов, который Google разработал совместно с несколькими другими службами веб-шрифтов.
http://code.google.com/apis/webfonts/docs/webfont_loader.html
Я использую веб-шрифты Google, например:
@font-face {
font-family: "Vollkorn";
font-style: normal;
font-weight: normal;
src: local('Vollkorn Regular'), local('Vollkorn-Regular'), url('http://themes.googleusercontent.com/static/fonts/vollkorn/v2/BCFBp4rt5gxxFrX6F12DKnYhjbSpvc47ee6xR_80Hnw.woff') format('woff');
}
body {
font-family: "Vollkorn", Georgia, Times, serif;
}
Работает в Chrome, нет "вспышки нестирированного текста" (как описано в этом сообщении блога типа *). Вместо этого текст вообще не загружается, пока веб-шрифт не завершит загрузку.
За быстрым подключением это здорово, потому что шрифты загружаются асинхронно и очень быстро. Однако при медленном соединении страница выглядит как пустая в течение нескольких секунд, пока веб-шрифт не загрузится - что плохой юзабилити.
Есть ли разумный способ показать текст в Грузии на начальном этапе, а затем добавить шрифт Vollkorn после загрузки ресурса?
Я предполагаю, что я говорю, что на самом деле мне очень нравится "вспышка нестирированного текста", а не пустая страница, и она хотела бы применить это поведение.
Вы должны заглянуть в веб-загрузчик шрифтов, который Google разработал совместно с несколькими другими службами веб-шрифтов.
http://code.google.com/apis/webfonts/docs/webfont_loader.html
Это можно сделать через JavaScript после загрузки страницы:
<script>
window.onload = changeFont;
function changeFont() {
document.getElementsByTagName('body')[0].fontFamily = '"Vollkorn", Georgia, Times, serif';
}
</script>
Затем обновите свой CSS, чтобы удалить "Vollkorn" из списка, установив его в Грузии. В зависимости от того, сколько времени потребуется для загрузки шрифта, вам может потребоваться обернуть изменение шрифта в вызове setTimeout.