Comment et quand utiliser sIFR_CSS/HTML

作者：阿宏 2005-5-28 16:05:36

• 原文：http://usabletype.com/articles/2004/how-and-when-to-use-sifr/
• 原作者：Andrew Hume
• 翻译：阿宏

在分析sIFR之前，先来快速的了解一下sIFR是什么，以及它是如何工作的。sIFR表示scalable Inman Flash Replacement，是一种在web上准确发布自定义排版的技术。这种技术的实现方法是，当页面下载时，在一个指定的元素中用Flash渲染的文字来代替一些文本。理解下面这点是很重要的，这个元素并不是被Flash完全替换，文本仍在元素内，这个元素仍可以像通常那样被样式化或者被定位。

关于sIFR的一些事实：并不是为了辩论

• sIFR不需要更改(X)HTML代码，所有的工作由Javascript、Flash和CSS来完成；
• 如果用户没有安装Flash或者不支持Javascript，那么(X)HTML的文本就会被CSS样式化后显示出来。
• sIFR是可缩放的，可以在渲染时更改为用户设置的缺省字体尺寸。
• sIFR兼容所有的屏幕阅读机，至今还没有问题被报道出来。
• sIFR的文本可以被鼠标选择，尽管当全选文本时，选中的状态看上去不那么确切。
• sIFR不影响搜索引擎的定位和评定，不会隐藏真实的文本内容。

结论应该是，sIFR是一种可使用的，慎重的技术，设计者和开发者使用时应该给予认真的考虑。

什么时候使用sIFR

就像所有的web技术一样，重要的是要懂得使用sIFR的最好的方式，以及能够知道最适合使用的场合。这指的是要为工作选择恰当的工具，特别是当sIFR作为一个工具从工具箱中跳出让我们使用时。

案例：一个大型的体育新闻站点决定把所有的标题都设计成公司独有的字体。新闻报道（包括它们的标题）通过某些内容管理软件被世界各地不同的人在不同的地方发布。他们不可能雇佣一些人坐在Photoshop面前，当编辑们每次要增加新闻报道时就创建一张标题图片。

在这种情况下，sIFR就是一个绝对简单的，可使用的和可扩充的工具。一些新闻站点解决这个问题的办法是通过PHP来忙碌的创建图片，或者使用另一些服务器端的手段。这个办法可以很好的节省时间，但是当它与sIFR比较时，就会看到有许多缺点：

• 图片不能缩放为用户缺省的字体尺寸。
• 尽管图片被缓存在服务器上，但是在产生图片时仍然存在一个性能问题。
• 每一张图片都必须分别被下载，导致服务器和带宽的消耗。

而采用sIFR，那么就只有一个Flash(.swf)文件和一个Javascript (.js)文件被下载，并可以使站点上所有的标题都被渲染为公司的字体。

这个例子不是空穴来风。这是一个真实的案例，在2001年，为了重新设计ESPN.com，Mike Davidson开发出了最初的Flash替换技术。从那以后，随着Shaun Inman和其他人的加入，这已经发展成为今天我们所拥有的完整而流畅的技术了，而且很有可能在2005年对web排版技术产生重大的冲击。

在链接上使用sIFR

最新版本的sIFR允许链接文本被替换。尽管这是一个令人兴奋的发展，但毕竟不适合运用在这样的场合。这是由于以下的可访问性问题：

• 不支持浏览器的右键点击功能（上下文菜单）
• 不支持apple的option键
• 没有状态条信息

虽然这些问题显得很琐碎，但是很多人发现这些功能的缺失很令人丧气。缺少状态条的信息，你就不能获得你下一个要访问的地址的线索；随着诸如Firefox和Opera浏览器的普及，右键的上下文菜单正在变成一个越来越有用的工具。尽管sIFR在链接上提供一个基本的右键点击，但是浏览器的上下文菜单却是不可访问的。

当然，这是Flash的限制而不是sIFR自身的限制。这些问题看上去可以在将来被克服。举个例子，状态条可以通过Javascript来控制，所以增加显示出链接目标的功能应该不是很困难。但是，在Flash允许在链接上提供完整的浏览器上下文菜单之前，我相信sIFR还不能完全处理这类文本。

anticrénelage

La plupart des avantages de sIFR se concentrent sur la possibilité de personnaliser les polices. Une considération importante est que le texte Flash peut être anti-aliasé. Les développeurs Web l'oublient souvent, en partie parce qu'une grande partie du travail est effectuée avec Mac OS X, dont les polices Quartz peuvent produire des bords lisses. Cependant, les utilisateurs Windows (bien qu'ils aient la possibilité de lisser les bords des polices quelque part dans le menu Affichage) ne semblent pas pouvoir activer l'anticrénelage. Ces utilisateurs, comme ceux qui sont préinstallés avec Windows XP ou Mac OS X, avoir un anti-aliasing d'affichage. La capacité du titre est une considération importante.

Réglage fin

Un problème que j'entends mentionné à plusieurs reprises est que sIFR ne vous permet pas de contrôler le texte de la même manière que vous pouvez contrôler une image. En effet. Avec les images créées dans Photoshop ou Fireworks, vous pouvez contrôler avec précision le crénage, l'étirement, l'anticrénelage ou d'autres fonctionnalités telles que les ombres portées très précises. L'éditeur d'images est un véritable support WYSIWYG (What You See Is What You Get). Le rendu sIFR vers Flash ne l'est pas.

Si ce niveau de contrôle est requis, alors une image reste toujours le meilleur moyen de publier ce type de texte, sIFR n'est pas le bon outil dans ces cas-là. Cependant, si vous publiez uniquement une police personnalisée, sIFR est plus adapté que la création d'une image.

Vitesse de téléchargement

Lors de l'utilisation de sIFR, la vitesse d'ombrage du texte de remplacement est une considération importante, bien que la vitesse ait été une grande amélioration depuis les versions précédentes, s'il y a plusieurs instances de sIFR sur l'écran en même temps, alors il y en a toujours. un retard notable. (Par exemple, chaque page a un titre, ou chaque transfert a un titre.) Cet exemple illustre peut-être mieux pourquoi une utilisation modérée du sIFR est le moyen idéal d'utiliser cette technologie aujourd'hui.

C'est l'inconvénient le plus frustrant de l'utilisation de la technologie de remplacement Flash. Depuis la mise en place du premier sIFR, la tentation a été de remplacer trop d’éléments sur une page. Pour y parvenir, les vitesses de téléchargement doivent être considérablement améliorées ; même si un bon serveur peut vous aider, le temps réel consiste à exécuter ces Javascript volumineux.

Résumé

sIFR ne rivalise pas avec la technologie de remplacement d'images ; c'est un outil unique pour différentes tâches. Il est préférable de l'utiliser pour le texte affiché dans la taille de police par défaut du navigateur et qui ne peut pas être remplacé par une image personnalisée.

Le cas d'utilisation idéal de sIFR est lorsque vous souhaitez afficher des polices personnalisées ou des titres anti-aliasés avec une seule image. Ceci est utilisé très fréquemment sur le Web et le sIFR est un meilleur choix dans ces cas-là. Il s'adapte à la taille de police par défaut de l'utilisateur, peut être sélectionné et peut être utilisé sur des milliers de pages sans télécharger un ou deux fichiers.

Résumé

• Utilisez sIFR sur les titres des pages.
• Utilisez sIFR dans une mesure limitée pour obtenir le meilleur temps de téléchargement.
• N'utilisez pas sIFR sur les liens.

Liens connexes

• Mike Davidson : Présentation de sIFR : l'alternative saine au texte du navigateur
• Mike Davidson : sIFR 2.0 RC 3 est là... Venez en chercher
• Dave Shea sur sIFR