@font-face est obsolète sur la version iPhone de Safari. Quelles sont mes alternatives ?

Question

Selon le Documentation d'Apple @font-face est obsolète pour la version iPhone de Safari. L'iPhone ne comprend que 11 polices AFAIK, et, dans tous les cas, j'ai besoin d'une belle police en lettres noires pour une application que je suis en train de construire. Je vais générer du texte aléatoire, donc les images ne sont pas une option. Quelles sont les alternatives qui s'offrent à moi ? Suis-je coincé avec une solution JavaScript comme Cufón ?

Answer 1

Je viens de l'apprendre @font-face est MAINTENANT compatible avec l'iPhone et l'iPad actuels. La documentation mentionnée ci-dessus, qui est Référence CSS Safari Affiche l'exemple d'intégration de la police.

@font-face {
    font-family: "MyFamilyname", cursive [, ...];
    font-style: normal [, ...];
    font-variant: normal[, ...];
    font-weight: bold[, ...];
    font-stretch: condensed[, ...]; /* Not supported */
    font-size: 12pt;[, ...] /* Not supported */
    src: local("Font Family Name"),
        url(http://..../fontfile.ttf) format("truetype"),
        url(http://..../fontfile.ttf) [, ...];
}

Je voulais juste m'assurer que quelqu'un d'autre qui, comme moi, a lu ce document, connaissait l'état actuel de la situation.

Answer 2

Vous pouvez en fait utiliser @font-face. Il suffit d'utiliser des polices SVG. Il existe des utilitaires pour convertir les TTF en SVG

Voir ceci pour plus d'informations (ce n'est pas mon message)

http://blog.themeforest.net/tutorials/how-to-achieve-cross-browser-font-face-support/

Answer 3

Cufón est vraiment la seule solution que vous pourrez utiliser. Elle présente l'avantage supplémentaire d'être assez rapide sur l'iPhone puisqu'elle utilise le canvas plutôt que le SVG en ligne, et les polices générées sont généralement 60 à 80 % plus petites que les polices originales (lorsqu'elles sont compressées).

Answer 4

Je vais générer des t les images ne sont pas une option.

Vous pourriez utiliser une bibliothèque graphique sur le serveur et dessiner les images à la volée. J'ai fait quelque chose de similaire et cela fonctionne, mais cela dépend bien sûr de la quantité de texte que vous voulez dessiner. De plus, si le texte se répète au moins parfois, vous pourriez mettre les images en cache.