Familias tipográficas web-safe

23/Jul/2014 278

No hay cosa peor de que transfieras un diseño para web y que se vea mal en el computador de tu cliente que justo tiene una tipografía mala o una versión de sistema operativo que no te imaginabas aún existía. Para eso hay 2 muy buenas soluciones:

  • Utilizar una fuente web-safe, es decir, que funciona correctamente a través de la gran mayoría de sistemas operativos y plataformas.
  • Utilizar @font-face que hace un poco más lenta la carga pero como queda en memoria caché funciona de maravilla durante la navegación.

Con la primera opción trabajaremos este artículo. A continuación entrego una buena lista de font-family que puedes estar tranquilo funcionará para tus clientes:

font-family: Arial, Helvetica, sans-serif;

font-family: Arial, Helvetica, sans-serif;

font-family: 'Arial Black', Gadget, sans-serif;

font-family: ‘Arial Black’, Gadget, sans-serif;

font-family: 'Bookman Old Style', serif;

font-family: ‘Bookman Old Style’, serif;

font-family: 'Comic Sans MS', cursive;

font-family: ‘Comic Sans MS’, cursive;

font-family: Courier, monospace;

font-family: Courier, monospace;

font-family: 'Courier New', Courier, monospace;

font-family: ‘Courier New’, Courier, monospace;

font-family: Garamond, serif;

font-family: Garamond, serif;

font-family: Georgia, serif;

font-family: Georgia, serif;

font-family: Impact, Charcoal, sans-serif;

font-family: Impact, Charcoal, sans-serif;

font-family: 'Lucida Console', Monaco, monospace;

font-family: ‘Lucida Console’, Monaco, monospace;

font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;

font-family: ‘Lucida Sans Unicode’, ‘Lucida Grande’, sans-serif;

font-family: 'MS Sans Serif', Geneva, sans-serif;

font-family: ‘MS Sans Serif’, Geneva, sans-serif;

font-family: 'MS Serif', 'New York', sans-serif;

font-family: ‘MS Serif’, ‘New York’, sans-serif;

font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;

font-family: ‘Palatino Linotype’, ‘Book Antiqua’, Palatino, serif;

font-family: Symbol, sans-serif;

font-family: Symbol, sans-serif;

font-family: Tahoma, Geneva, sans-serif;

font-family: Tahoma, Geneva, sans-serif;

font-family: 'Times New Roman', Times, serif;

font-family: ‘Times New Roman’, Times, serif;

font-family: 'Trebuchet MS', Helvetica, sans-serif;

font-family: ‘Trebuchet MS’, Helvetica, sans-serif;

font-family: Verdana, Geneva, sans-serif;

font-family: Verdana, Geneva, sans-serif;

font-family: Webdings, sans-serif;

font-family: Webdings, sans-serif;

font-family: Wingdings, 'Zapf Dingbats', sans-serif;

font-family: Wingdings, ‘Zapf Dingbats’, sans-serif;

Comentarios

  1. bit.ly [#]

    Can I simply just say what a relief to discover someone who actually knows what they’re discussing online.

    You certainly understand how to bring an issue to light
    and make it important. More and more people should
    read this and understand this side of the story.
    I can’t believe you aren’t more popular since you certainly possess the gift.
    cheap flights http://1704milesapart.tumblr.com/ cheap flights

  2. http://tinyurl.com/9ydvf74m [#]

    It’s actually a cool and helpful piece of information. I am
    glad that you just shared this useful info with us.
    Please keep us informed like this. Thank you for sharing.
    scoliosis surgery https://0401mm.tumblr.com/ scoliosis surgery

  3. HenryUnfiP [#]

    gay dating for virgins
    gay and bisexual dating sites
    gay men dating site

  4. coub.com [#]

    Appreciate the recommendation. Will try it out. scoliosis surgery https://coub.com/stories/962966-scoliosis-surgery scoliosis surgery

  5. hydroxychloroquineMt [#]

    hydro chloroquine aralen retail price hydroxcloroquine

  6. http://tinyurl.com [#]

    Wow, awesome blog format! How long have you been running a blog for?

    you make blogging glance easy. The overall
    glance of your website is great, as well as the content
    material!
    ps4 games https://j.mp/3z5HwTp ps4 games

  7. www.iherb.com [#]

    Hey there just wanted to give you a brief heads up and let you
    know a few of the images aren’t loading correctly. I’m not sure why but I
    think its a linking issue. I’ve tried it in two different browsers and both show the same outcome.
    quest bars https://www.iherb.com/search?kw=quest%20bars quest bars

  8. zithromaxeska [#]

    nikkomycin z zithromax perscription zithromax drug class

  9. HenryUnfiP [#]

    gay women dating
    feminine gay dating
    bdsm dating gay

  10. HenryUnfiP [#]

    gay dating for twinks
    gay dating sites sydney
    chicago gay dating

  11. dosage for viagra 100mg [#]

    Awesome post. http://herreramedical.org/viagra

  12. does zyrtec raise blood pressure [#]

    free zyrtec coupons from walmart – http://allergyd.com

  13. cszrgdk [#]

    zs5X2h embcqdoeelnv, [url=http://fhtdpvurdqkg.com/]fhtdpvurdqkg[/url], [link=http://ssmxaufajlbk.com/]ssmxaufajlbk[/link], http://vesasdvibnog.com/

  14. zyrtec at costco price [#]

    benadryl – https://allergyd.com

  15. childrens zyrtec warnings [#]

    cetirizine hcl 10mg tab – http://allergyd.com

  16. www.pharmaceptica.com [#]

    malaria drug chloroquine https://pharmaceptica.com/

  17. side effects of accutane [#]

    what is accutane accutane for acne

  18. adderallvsmodafinil [#]

    provigil for sale provigil vs modafinil

  19. pharmaceptica.com [#]

    erectile psychological https://pharmaceptica.com/

  20. bactrim generic name [#]

    co trimoxazole ds sulfamethoxazole trimethoprim

  21. www.pharmaceptica.com [#]

    sildenafil rx https://pharmaceptica.com/

  22. roaccutane side effects [#]

    isotretinoine roaccutane

  23. stromectol [#]

    buy stromectol https://stromectolforte.com/ ivermectin for humans prescription ivermectin 12 mg tablets for sale

  24. bactrim antibiotic [#]

    what does sulfameth trimethoprim treat https://bactrimxazole.com/

  25. ivermectin [#]

    how to buy ivermectin http://stromectolforte.com/ preИ›ul stromectolului iwermektyna

  26. provigilonline [#]

    goodrx modafinil https://modafilmdmodafinil.com/

  27. ivermectin over the counter [#]

    ivermectin 3 mg http://stromectolforte.com/ ivermectin for humans ivermectin lotion for lice

  28. GustavoVet [#]

    executive resume writing service
    homework help online

CSSLab