Comparados quatro geradores de fontes de ícones personalizados
As fontes de ícone estão na moda agora. Eles facilitam a incorporação de gráficos vetoriais em uma página que os designers de todos os lugares os utilizam como a principal maneira de lidar com ícones.
O problema, claro, é que precisamos de mais controle sobre quais ícones incorporamos. Às vezes, buscamos uma variedade de fontes, incluindo nosso próprio trabalho, e precisamos de uma boa maneira de juntar tudo. Digite geradores de fontes de ícone. Acompanhe enquanto comparamos alguns de nossos favoritos.
Por que um gerador?
A desvantagem de usar uma fonte de ícone é que você está limitado pelos ícones que estão no conjunto que você baixou. Se você deseja incluir três ícones diferentes de três conjuntos diferentes, precisará carregar em três fontes diferentes, o que pode significar carregar centenas de ícones dos quais você simplesmente não precisa.
Obviamente, se você está procurando um site simples e sem recursos supérfluos e atrasos desnecessários no carregamento, essa não é a melhor maneira de incorporar ícones. É aqui que entram as fontes de ícone personalizadas. Nesse cenário, você pega seus três ícones, lança-os em uma única fonte minúscula e personalizada e incorpora-a à sua página.
Infelizmente, nem todos nós temos o conhecimento ou os recursos para criar nossas próprias fontes. Não se preocupe, esses geradores de fontes de ícones personalizados você cobriu. Se você deseja usar seus próprios ícones ou aproveitar os conjuntos de ícones existentes, há uma ferramenta abaixo para fazer o trabalho.
Fontello
O primeiro gerador que vamos verificar é o Fontello. Este aplicativo é super liso, muito fácil de usar e possui onze conjuntos de ícones totalmente gratuitos, incluindo Font Awesome e Iconic. Não há milhares de ícones para escolher, mas definitivamente existem o suficiente para que você possa encontrar o que está procurando.
Falando em encontrar o que você está procurando, essa tarefa é simplificada pelo recurso de pesquisa de atualização instantânea na parte superior da página. Adoro a filtragem ao vivo aqui, que é muito melhor do que esperar que uma nova página seja carregada com seus resultados de pesquisa.
Escolher ícones para sua fonte personalizada é tão fácil quanto clicar neles. Depois de encontrar e selecionar os ícones que deseja incluir, vá para a segunda guia, onde você pode alterar os nomes de cada ícone. São poucas opções de personalização como essa que tornam o Fontello tão bom.
O próximo passo é verificar a guia "Editar códigos" para poder personalizar os caracteres que estão associados a cada ícone. Isso é fácil, basta usar os campos fornecidos.
Depois de concluir as etapas acima, você está pronto para começar. Basta digitar o nome do arquivo e clicar no link de download para receber sua fonte personalizada.
Baixar
O download do Fontello inclui catorze arquivos, espalhados por várias pastas. A área de cobertura de cada arquivo é pequena, mas o grande número de itens que você recebe pode parecer esmagador para alguém que estava procurando uma solução simples. Dito isto, é muito bom ter um exemplo totalmente funcional para trabalhar e eles fizeram um grande esforço para garantir que tudo seja o mais compatível possível com o navegador.
IcoMoon
O próximo aplicativo que vamos dar uma olhada é o IcoMoon. Com toda a honestidade, é muito parecido com o Fontello, mas há algumas diferenças importantes que merecem ser examinadas.
Assim como no Fontello, você pode navegar pelos ícones rolando ou usar o recurso de pesquisa integrada para encontrar algo específico.
Há muito mais ícones disponíveis do que você vê por padrão. Para conferir o restante, clique no botão "Biblioteca" na parte superior da tela.
Isso o levará a uma página que atualmente possui dezesseis coleções diferentes para escolher, muitas das quais são gratuitas enquanto outras precisam ser compradas.
Importando outros recursos
Um dos melhores recursos do IcoMoon é a capacidade de importar outros recursos para incluir na sua compilação personalizada. Você pode fazer upload de outras fontes de ícone ou até de seus próprios gráficos SVG personalizados. Isso torna o IcoMoon um recurso incrível para quem deseja criar sua própria fonte de ícones do zero.
Gerando a fonte
Depois de escolher seus ícones, você poderá prosseguir com o download da fonte usando o botão na parte inferior da página. Observe também que você tem a opção de baixar os ícones como uma imagem (isso gerará uma página de sprite).
Assim como no Fontello, antes do download, você recebe algumas opções para alterar as configurações e a codificação da sua fonte.
Baixar
O download aqui é consideravelmente menor do que com o Fontello. Existem apenas nove arquivos, cinco dos quais são a fonte real. Basicamente, o Fontello fornece vários arquivos CSS, enquanto o IcoMoon o condensa em um. Isso facilita muito a análise e a página de demonstração também é um pouco melhor.
Pictonic
O próximo da nossa lista é Pictonic. Para usar este site, você precisa se inscrever em uma conta. A partir daí, você tem três opções. Você pode usar os ícones gratuitos, usar ícones pagos a uma taxa de US $ 0, 59 por ícone ou obter acesso ilimitado por US $ 199.
Aqui vemos a mesma simulação de antes, use o recurso de pesquisa ao vivo ou navegue pelos ícones disponíveis rolando e clicando nos que você deseja.
Há também um menu suspenso que permite filtrar facilmente os resultados por categoria. Essa também é uma boa maneira de ver os 320 ícones gratuitos (que são principalmente logotipos sociais e de software).
Baixar
Desta vez, não vejo realmente nenhuma opção para personalizar seu download, basta clicar em "Continuar" e depois em "Download" e você recebe o que acaba por ser o nosso maior download ainda.
Com o Pictonic, você recebe automaticamente os arquivos praticamente de todas as maneiras que deseja: arquivos de fonte, PNGs e SVGs. O número de arquivos que você recebe depende do número de ícones que você escolheu. Adoro ter todas essas opções, mas gostaria de escolher o que faço e o que não quero antes do download.
Servidor Pictos
Guardei o outlier por último. O Pictos Server trata as coisas de maneira um pouco diferente dos outros sites. Em vez de criar uma fonte personalizada que você baixa e incorpora em seu próprio servidor, a Pictos hospeda os ícones para você. É geralmente conhecido como "o Typekit de ícones", que é uma descrição decente do que você pode esperar do serviço.
Pela minha conta, atualmente existem cerca de 338 ícones para você escolher. Você pode diminuir a oferta escolhendo um dos conjuntos Pictos ou procurando algo específico.
Depois de escolher os ícones, você pode digitar os caracteres que deseja representar cada ícone. A partir daqui, basta clicar no botão "Gerar código", que fornece um link de incorporação CSS que você simplesmente lança no seu arquivo.
Preços
Como o Pictos é um serviço de hospedagem, obviamente há uma taxa mensal envolvida. Os preços dos planos são definidos de acordo com as visualizações de página, começando em US $ 0 para até 25.000 visualizações mensais e até US $ 50 para até 4.000.000 visualizações mensais.
Também é importante observar que o plano gratuito parece estar limitado a doze ícones por fonte.
Como eles se comparam?
Obviamente, a resposta para a pergunta de qual site é "melhor" depende de suas necessidades específicas. Cada site parece se destacar à sua maneira. Se você está procurando a solução mais fácil, não pode vencer o Pictos Server. Há realmente muito pouco trabalho envolvido e a incorporação da fonte do ícone é fácil.
Se você está procurando uma tonelada de fontes gratuitas sem as dificuldades de se inscrever em uma conta, consulte o Fontello. É um ótimo serviço com muitas opções e provavelmente será tudo o que você precisa.
Em termos de recursos e opções, o IcoMoon é difícil de bater. Eu amo que ele permite que você faça o upload e integre seu próprio trabalho ou até outras fontes de ícone que você encontrou. Há também uma tonelada de ícones gratuitos aqui e até alguns pacotes premium, se você realmente quiser dar tudo de si.
No geral, Pictonic foi provavelmente o menos favorito do grupo. A seleção de ícones gratuitos não foi tão boa e você não tem as opções de personalização dos outros serviços. Uma coisa que eu gosto na Pictonic é o modelo direto de preços para ícones premium: US $ 0, 59 por ícone ou US $ 199 para acesso ilimitado. Agradável e simples!
Qual gerador de fontes de ícones é o seu favorito?
No geral, vale a pena conferir todos esses quatro serviços. São todos muito fáceis de usar e repletos de valor.
Agora que você viu meus pensamentos sobre esses quatro geradores de fontes, deixe um comentário abaixo e conte-me seus pensamentos. Você já usou algum desses serviços em projetos anteriores? Qual você recomenda? Que outras opções estão por aí que eu perdi?