Pular para o conteúdo principal

Top 10 Webfontes - Bibliotecas ícones de Fontes de Texto Grátis para seu site (.eot .woff .ttf .svg )


São muitas as vantagens de se utilizar bibliotecas de ícones no formato de arquivos FONT DE TEXTO para a interface do seu site, por exemplo, se você é um webdesign já deve ter ouvido falar ou utilizado as chamadas WEBFONTS, preparei uma lista com as mais comuns utilizadas em meus projetos:

Vantagens:
  • Produtividade: As bibliotecas já possui os ícones mais utilizados e geralmente poucos serão desenvolvidos.
  • Desempenho: Nos testes um arquivo de font carrega mais rapidamente o request é mais rápido do que uma sprit de imagens ou a mesma quantidade de ícones como imagens.
  • Qualidade: Como esses arquivos de ícones estão em formato Vetor de Font, podem ser ampliados   sem perder a qualidade.
  • Adaptação:  Você consegue encaixar de forma simples no texto, botões e links no html bastando mapear um css e uma classe.
  • Customização: É possível criar a própria biblioteca de fontes de ícones que você possui habilidade de webdesign para isso, ou apenas selecionar os ícones disponíveis.


Melhores Bibliotecas Webfont grátis

FontFile .eot .woff .ttf .svg


  1. Icomoon - free http://icomoon.io/app/#/select
    (Muito bom, grande variedade de ícones, permite customizar ou criar os próprios ícones e selecionar e gerar uma biblioteca com apenas os ícones que você deseja utilizar, agiliza o CSS)
  2. Font-Awesome - http://fortawesome.github.io/Font-Awesome/  Pode ser instalada no Bootstrap, não utiliza javascript, perfeito em display de retina, visível na impressão, controlado por css class.
  3. Adamwhitcroft http://adamwhitcroft.com/batch/ The download includes: PSD file (shape layers). SVGs (128x128). PNGs (16x16, 32x32, 64x64). Webfont (.eot, .ttf, .woff).
  4. Fontello http://fontello.com/ Como todas as fontes de ícones, possui vetor e sua propaganda tem foco na qualidade ao redimensionar os ícones sem perder qualidade.

  5. Shoestrap http://shoestrap.org/downloads/elusive-icons-webfont/
  6. Entypo Icons - http://www.entypo.com/ Projeto com ícones gratuitos para sites e blogs.
  7. Ligature Symbols http://kudakurage.com/ligature_symbols/ Grande variedade de ícones de fonte com qualidade permitindo criar sites responsivos, possui suporte para multi plataforma.
  8. Typicons http://typicons.com/ - A biblioteca atual possui 220 web icons para download
  9. MapBox - https://www.mapbox.com/maki/ -  Permite utilização em projetos de geoprocessamento, mapeamento, google maps icons...
  10. Glyphicons - http://glyphicons.com/ ou http://getbootstrap.com/components/ - Um dos melhores tanto na quantidade quanto na facilidade de utilização, o Bootstrap Twitter incorporou essa biblioteca de fontes no seu projeto.



Novas fontes, tendências e tecnologias estão surgindo a todo instante, se você acha que eu esqueci de citar uma boa alternativa de webfontes, informe aqui nos comentários ;)
Postar um comentário

Postagens mais visitadas deste blog

I love ♥ You no Twitter Tabelas | Emoticons | Caracteres € Simbolos Visuåis ☻

♥☺☼ Usando caracteres especiais famoso no twittter, sabemos que uma imagem fala mais que 1000 palavras, e estes símbolos são de grande valia no twitter, já que com um twitter normal só podemos escrever 140 caracteres.



Digo normal porque tem um complemento para firefox chamado shortText.com informado pelo InfoDicas.com em que você pode colocar muito mais do q isso, é possível até mandar uma carta se você precisar.


Voltando ao assunto, temos abaixo a tabela dos quase "emotions" mais usados no twitter: para usar é só copiar e colar
Coração = ♥Espada = ♠Smile 1 = ☺ sorrindoSmiller 2 = ☻em negativoMusica = ♫Som = ♪Bom dia = ☼ solMina = ♀Macho = ♂Ouro = ◊três pontinhos econômico = …crucifixo = †vai e volta = « »Grana = $Certo = √Seta 1= ➤Seta 2 = ➜E não poderia faltar o simbolo do @dicadedica, o triângulo =∆ Agora você pode conhecer a lista completa e usar sua criatividade para enfeitar, enfatizar ou encurtar as suas twittadas.
Link direto para tabela completa e para instala…

Lista de ALIMENTOS INTEGRAIS Ricos em nutrientes e fibras

O processo de refinamento leva a considerável perda de nutrientes, restando praticamente só o amido (carboidrato). Para que tal amido possa ser absorvido, torna-se necessário á presença de vitaminas e minerais. Estas vitaminas, quando não fornecidas pelo alimento (que é o caso dos alimentos refinados) faz com que o próprio organismo se encarregue de fabricá-las. Levando o paciente a um quadro de empobrecimento vitamínico e mineral que proporciona o desequilíbrio do funcionamento do nosso corpo causando (cansaço físico, cansaço mental, eventualmente ocasionando gripes e resfriados constantes, gastrite, dores nos ombros, artrite...).

A alimentação moderna é composta de alimentos refinados, com conservantes, corantes, estabilizantes, aromatizantes e, além disso, são deficientes em fibras, vitaminas e minerais. Por isso, precisamos consumir alimentos integrais saudáveis como:

Alimentos integrais são aqueles que não passaram pelo processo de refinamento, são ricos em nutrientes como as fi…

Todas as Mutretas de GTA San Andreas

Seguinte pessoal, eu como um fanático por games, me sinto na obrigação de ajudar aqueles que não são tão habilidosos (hehehe... zoeira), portanto trago uma lista completa de mutretas para o clássico GTA San Andreas:

Mutretas: Restauração de veiculos/dinheiro/armas: R1, R2, L1, X, esquerda, baixo, direita, cima, esquerda, baixo, direita, cima.
Armamento enquanto dirige: cima, cima, quadrado, L2, direita, X, R1, baixo, R2, bola.
Suicídio: Direita, L2, baixo, R1, esquerda, esquerda, R1, L1, L2, L1

Super Salto: Cima, cima, triângulo, triângulo, cima, cima, esquerda, direita, quadrado, R2, R2

Vida Infinita: baixo, X, direita, esquerda, direita, R1, direita, baixo, cima, triângulo.

Magro: Triângulo, cima, cima, esquerda, direita, quadrado, O, direita

Musculoso: Triângulo, cima, cima, esquerda, direita, quadrado, O, esquerda

Gordo: Triângulo, cima, cima, esquerda, direita, quadrado, O, baixo.

Respeito máximo: L1, R1, triangulo, baixo, R2, X, L1, cima, L2, L2, L1, L1.

Fôlego Infinito: Baixo, esquerda, L…

CoinURL