Anti-aliasing de la police dans la page HTML

Est-il une bonne façon de créer claires et nettes, les GROS caractères dans les pages web? J'ai besoin de créer un nuage de tags effet sur ma page d'accueil avec les différentes tailles de polices et de couleurs.

Je l'ai créé en HTML/CSS mais sur les anciens navigateurs ou systèmes d'exploitation qui ne supportent pas l'anti-aliasing en tant que par défaut, il semble un peu... de merde.

J'ai joué avec sIFR, qui a fonctionné à merveille, mais m'a donné une horrible des effets de charge, mais je vais maintenant me demandais si il existe un moyen de:

) n'navigateur/OS détection de diviser les utilisateurs par navigateur/OS combinaisons qui, je le SAIS soutien anti-aliasing (ils se font du HTML brut) et par les "autres" qui obtenir une balise d'image.

b) une sorte de code JavaScript pour ajouter l'antialiasing?

c) solution Permanente pour charger un BG de l'image dans la div et masquer le texte HTML. (Je sais, je sais, Google histoires d'horreur au sujet de l'indexation... mais est-il possible?)

Est-il vraiment important? La nature du web est que vous n'avez pas des pixels-contrôle parfait de l'affichage du contenu d'un but explicite. En général, il est préférable d'accepter cela et de concentrer vos énergies sur d'autres choses.
Je suis entièrement d'accord avec Hank!
Dans ce cas, il est vraiment important - c'est l'un des fleurons page d'accueil de sorte pixel perfect compte. Juste besoin de trouver la façon la plus discrète de la réalisation de cet.

OriginalL'auteur MrFidge | 2009-03-19

  1. 4

    a) bien sûr, vous pouvez utiliser la détection du navigateur. La façon la plus simple de le faire est probablement à l'aide de jQuery's navigateur méthode. (jQuery est une impressionnante bibliothèque JavaScript qui fait beaucoup de JS-développement plus facile dans le cas où vous n'avez pas entendu parler)

    Selon le navigateur (ou OS) résultats que vous obtenez, vous pourriez présenter à l'utilisateur les différentes solutions, de texte normal à quelque chose comme une solution Flash.

    Cependant, je vous le conseille. Les choses semblent aller mieux sur les nouvelles machines que les anciens. C'est juste la façon dont il est, c'est pourquoi je recommande à l'encontre de passer un temps précieux à de petits problèmes dans les navigateurs plus anciens. - À moins que les utilisateurs avec des navigateurs plus anciens sont vos principales démographique de cours. Dans ce cas, que diriez-vous venez de le faire en Flash? Pas utiliser le codage de deux solutions si on travaille toujours, non?

    b) Vous pouvez en fait créer du texte anti-aliasé via JavaScript. Jetez un oeil à mon projet Die Stimme Gottes ("Voix de Dieu", non pas pour l'religieusement dégoûté) pour un exemple. Dans ce projet, j'ai utilisé l'excellent typeface.js pour cela.

    c) utiliser les CSS, peut-être? 

    h1.welcome {
    background: url('the-welcome-image.png') no-repeat;
    color: transparent;

    }

    hmm.. a été impressionné d'abord par des typeface.js jusqu'à ce que j'ai essayé de zoomer sur une page. L'air terrible! typeface.neocracy.org/examples.html

    OriginalL'auteur winsmith

  2. 5

    +1 Hank commentaire. Vous avez très peu à gagner à faire cela. Certains navigateurs de bureau (y compris IE7+ et Safari) activer l'anti-aliasing par défaut, même quand il est sur un niveau de l'OS, et moderne (post-XP) OSs ont tendance à activer par défaut de toute façon. En forçant AA sur le reste, vous aurez:

    (+) amélioration de l'affichage un peu pour IE6 et XP+les utilisateurs de Firefox qui, involontairement, n'ont pas de AA

    (-) de rendre le chargement plus lent pour tout le monde (mais surtout les utilisateurs de limité les appareils mobiles)

    (-) défaite préféré tailles de police

    (-) inutilement ennuyer les luddites qui, délibérément, désactiver l'anti-aliasing parce que c'est “ensemble flou”(*)

    (*: il existe peu de cas où cela n'même sens, en particulier pour les vieux, floue moniteurs à tube CATHODIQUE.)

    OriginalL'auteur bobince

  3. 0

    Par les regards de la meilleure des méthodes (dans aucun ordre) sont:

    1) Utiliser une image. Si vous comptez sur le SEO pour le site, puis par tous les moyens d'ajouter du code html et de le cacher à l'aide de css en utilisant une de ces méthodes

    2) typeface.js - JS qui fonctionnent sur la plupart des navigateurs modernes. A quelques bugs et glitches, mais fonctionne très bien. Si vous allez à la force de l'anti-aliasing sur vos utilisateurs alors cela fonctionne. À utiliser avec parcimonie. Auteur de travail sur l'Opéra et de compatibilité IE8...

    2) sIFR - Excellent script qui remplace dynamiquement votre sélection de zones de texte avec des animations en flash. Encore quelques bugs et défauts, mais si vous êtes tout simplement intéressé par l'impressionnant à la recherche de la police, alors c'est parfait. Augmente votre chargement de la page même si, de sorte que de plus en plus est moins, à utiliser avec parcimonie.

    J'ai tendance à ne pas aller avec JS des solutions lourdes, comme j'aime bien avoir de la vitesse de l'éclair chargement de la page, mais si vous AVEZ quelques bon à la recherche de polices, puis ceux-ci semblent être les plus gracieuses et des méthodes simples.

    OriginalL'auteur MrFidge

  4. 0

    De la Force de la couleur de fond, de la redéfinir pour la classe ou de l'élément avec la même couleur de fond. Elle fonctionne.

    span.your_class {
    writing-mode: tb-rl;
    filter: flipv fliph;
    background-color: #006cb8 !important;
}

    OriginalL'auteur DMC

  5. -5

    Flash ou Silverlight sont vos meilleurs paris pour une grande recherche de rendu des polices

    Et sont même moins accessible que les images avec des balises " alt " ou <h1>s avec des images de fond. Non merci.
    Ouais ne voulais pas utiliser de flash, précisément pour cette raison. sIFR est un bon compromis parce qu'il se dégrade à la plaine html, mais nous ne pouvions pas l'utiliser malheureusement.

    OriginalL'auteur Andrew Harry