Font-Face работает локально, но не на промежуточном сервере

Question

Font face отлично работает на моем локальном компьютере, и когда я просматриваю промежуточный сайт на моем локальном компьютере, но при просмотре на моем телефоне или других компьютерах шрифт загружается неправильно.

@font-face {
    font-family: '../fonts/LubalinGraphStd-Demi';
    src:    url('../fonts/LubalinGraphStd-Demi.eot');
    src:    url('../fonts/LubalinGraphStd-Demi.eot?#iefix') format('embedded-opentype'),
            url('../fonts/LubalinGraphStd-Demi.svg#LubalinGraphStd-Demi') format('svg'),
            url('../fonts/LubalinGraphStd-Demi.ttf') format('truetype'),
            url('../fonts/LubalinGraphStd-Demi.woff') format('woff'),
            url('../fonts/LubalinGraphStd-Demi.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

Вот промежуточная ссылка: http://tpo.tmwlsh.co.uk имя пользователя: tpo, пароль: tpo.

Answer 1

Ваше font-family имя выглядит подозрительно в вашем @font-face:

    font-family: '../fonts/LubalinGraphStd-Demi';

Похоже, вы случайно использовали здесь имя файла вместо обычного имени. Вы применяете font-family: LubalinGraphStd-Demi в своих элементах, поэтому если вы измените его на:

    font-family: 'LubalinGraphStd-Demi';

Это должно быть исправлено.

С другой стороны, вы используете там несколько древних форматов шрифтов. Вы уверены, что вам нужна поддержка iPad или iPhone первого поколения с iOS3 или IE8 и старше?