Rogério Lino

Web development and tips

UTF-8 Icons

Com a adoção dos navegadores mais modernos, muitos projetos estão adotando os ícones UTF-8 em botões. Assim diminui a dependência de imagens tornando o carregamento mais rápido. Exemplo: http://dev.rogeriolino.com/exemplos/css/utf8_icons/index.html

Prós

  • Não há necessidade de imagens como dependência;

  • Pode usar a cor que desejar;

  • São escaláveis, muito fáceis de alterar o tamanho;

  • Pode usar transformações CSS (transparência, sombra, rotação, etc);

  • Reuso de ícones através de seletores CSS;

Contras

  • Os ícones das fonts padrões não são tão legais;

  • Embora não haja dependência de imagem, pode ter de font (web font);

  • Dependendo da font escolhida, um iconset pode ser mais leve;

Veja mais sobre ícones UTF-8

Comments