Fire tilpassede ikonskriftsgeneratorer sammenlignet
Ikonskrifter er rasende akkurat nå. De gjør det så enkelt å legge inn vektorgrafikk på en side som designere overalt viser til dem som den viktigste måten å håndtere ikoner på.
Problemet er selvfølgelig at vi trenger mer kontroll over hvilke ikoner vi legger inn. Noen ganger henter vi fra en rekke kilder, inkludert vårt eget arbeid, og vi trenger en god måte å sette sammen alt på. Angi ikon fontgeneratorer. Følg med når vi sammenligner noen av favorittene våre.
Hvorfor en generator?
Ulempen med å bruke en ikonfont er at du er begrenset av ikonene som tilfeldigvis er i settet du lastet ned. Hvis du vil inkludere tre forskjellige ikoner fra tre forskjellige sett, må du laste inn tre forskjellige skrifter, noe som faktisk kan bety lasting i hundrevis av ikoner som du ganske enkelt ikke trenger.
Dette er ikke den beste måten å legge inn ikoner på hvis du vil ha et magert, lite nettsted uten overflødige ressurser og unødvendige belastningsforsinkelser. Det er her egendefinerte ikonfonter kommer inn. I dette scenariet tar du de tre ikonene dine, kaster dem inn i en ørliten tilpasset font, og legger den inn på siden din.
Dessverre har ikke alle oss kunnskap eller ressurser til å bygge våre egne skrifter. Vær imidlertid ikke bekymret. Disse egendefinerte ikonfontgeneratorene har du dekket. Enten du vil bruke dine egne ikoner eller utnytte eksisterende ikonsett, er det et verktøy nedenfor for å få jobben gjort.
Fontello
Den første generatoren som vi skal sjekke ut er Fontello. Denne appen er superglatt, veldig enkel å bruke og har elleve helt gratis ikonsett inkludert Font Awesome og Iconic. Det er ikke tusenvis av ikoner å velge mellom, men det er definitivt nok til at du skal kunne finne det du leter etter.
Når vi snakker om å finne det du leter etter, blir den oppgaven enkel ved å øyeblikkelig oppdatere søkefunksjonen øverst på siden. Jeg elsker livefiltrering her, som er langt bedre enn å vente på at en ny side skal lastes inn med søkeresultatene.
Det er like enkelt å velge ikoner for den egendefinerte skriften som å klikke på dem. Når du har funnet og valgt ikonene du vil inkludere, hopper du over til den andre fanen der du kan endre navnene på hvert ikon. Det er lite tilpasningsalternativer som dette som gjør Fontello så flott.
Det neste trinnet er å sjekke ut "Rediger koder" -fanen slik at du kan tilpasse tegnene som er knyttet til hvert ikon. Å gjøre dette er enkelt nok, bare bruk de medfølgende feltene.
Etter å ha fullført trinnene ovenfor, er du klar til å gå. Skriv inn et filnavn og klikk på nedlastingslenken for å motta den tilpassede skriften.
nedlasting
Fontello-nedlastingen inkluderer hele fjorten filer fordelt på flere mapper. Fotavtrykket til hver fil er lite, men det store antallet elementer du mottar kan virke overveldende for noen som lette etter en enkel løsning. Når det er sagt, er det veldig fint å ha et fullt fungerende eksempel å jobbe med, og de har gått gjennom mye arbeid for å sikre at alt er så nettleserkompatibelt som mulig.
IcoMoon
Den neste appen vi skal se på er IcoMoon. I all ærlighet er det mye som Fontello, men det er noen viktige forskjeller som er verdt å undersøke.
Akkurat som med Fontello kan du enten bla gjennom ikonene ved å bla eller bruke den integrerte søkefunksjonen for å finne noe spesifikt.
Det er mange flere ikoner tilgjengelig enn du ser som standard. For å sjekke ut resten, trykker du på "Bibliotek" -knappen nær toppen av skjermen.
Dette tar deg til en side som for tiden har seksten forskjellige samlinger å velge mellom, hvorav mange er gratis mens andre må kjøpes.
Importere andre ressurser
En av de beste funksjonene i IcoMoon er muligheten til å importere andre ressurser som kan inkluderes i den tilpassede byggingen. Du kan laste opp andre ikonfonter eller til og med din egen tilpassede SVG-grafikk. Dette gjør IcoMoon til en fantastisk ressurs for alle som ønsker å bygge sin egen ikonfont fra bunnen av.
Genererer skriften
Når du har plukket ut ikonene dine, kan du fortsette til nedlasting av font via knappen nederst på siden. Legg også merke til at du har muligheten til å laste ned ikonene som et bilde (det vil generere en sprite-side).
Akkurat som med Fontello, før du laster ned, får du noen alternativer for å endre innstillingene og kodingen for skrifttypen din.
nedlasting
Nedlastingen her er betydelig mindre enn med Fontello. Det er bare ni filer, hvorav fem er skrifttypen. I utgangspunktet gir Fontello deg en haug med CSS-filer mens IcoMoon kondenserer den til en. Dette gjør alt mye lettere å sile gjennom, og demosiden er også litt finere.
Pictonic
Neste på vår liste er Pictonic. For å bruke dette nettstedet, må du registrere deg for en konto. Derfra får du tre alternativer. Du kan bruke gratisikonene, bruke betalte ikoner til en kurs på $ 0, 59 per ikon eller få ubegrenset tilgang for $ 199.
Her ser vi den samme drillen som før, bruker live søk-funksjonen eller bla gjennom de tilgjengelige ikonene ved å bla og klikke på de du ønsker.
Det er også en rullegardinmeny som lar deg enkelt filtrere resultatene etter kategori. Dette er også en god måte å se på de 320 gratis ikonene (som stort sett er sosiale logoer og programvarelogoer).
nedlasting
Denne gangen ser jeg ikke virkelig noen alternativer for å tilpasse nedlastingen, du bare klikker på "Fortsett" og deretter "Last ned" og du får det som viser seg å være den største nedlastingen ennå.
Med Pictonic mottar du filene automatisk på omtrent alle måter du måtte ønske dem: fontfiler, PNG-er og SVG-er. Antall filer du mottar, avhenger av antall ikoner du valgte. Jeg elsker at jeg har alle disse alternativene, men jeg vil gjerne velge hva jeg gjør og ikke vil ha før nedlastingen.
Pictos Server
Jeg lagret outlier for sist. Pictos Server handler om ting ganske annerledes enn de andre nettstedene. I stedet for å bygge en tilpasset font som du laster ned og legger inn på din egen server, vert Pictos ikonene for deg. Det er vanligvis kjent som "Typekit of icon", som er en grei beskrivelse av hva du kan forvente av tjenesten.
Etter min telling er det for tiden rundt 338 ikoner å velge mellom. Du kan slanke tilbudet ved å velge fra et av Pictos-settene eller søke etter noe spesifikt.
Når du har valgt ikonene, kan du skrive inn tegnene du vil representere hvert ikon. Herfra klikker du bare på "Generer kode" -knappen, som gir deg en CSS-innebygd-kobling som du bare kaster inn i filen din.
Priser
Siden Pictos er en vertstjeneste, er det åpenbart en månedlig avgift involvert. Prisene for planene er satt i henhold til sidevisninger, og starter med $ 0 for opptil 25.000 månedlige visninger opp til $ 50 for opptil 4.000.000 månedlige visninger.
Det er også viktig å merke seg at gratisplanen ser ut til å være begrenset til tolv ikoner per skrift.
Hvordan sammenligner de?
Naturligvis avhenger svaret på spørsmålet om hvilket nettsted som er "best" av dine spesifikke behov. Det ser ut til at hvert nettsted utmerker seg på sin egen måte. Hvis du leter etter den enkleste løsningen, kan du ikke slå Pictos Server. Det er veldig lite arbeid som er involvert, og å legge inn ikonfonten er et blunk.
Hvis du leter etter massevis av gratis skrifter uten problemer med å registrere deg for en konto, kan du sjekke Fontello. Det er en flott tjeneste med mange alternativer og vil sannsynligvis være alt du trenger.
Når det gjelder funksjoner og alternativer, er IcoMoon vanskelig å slå. Jeg elsker at det lar deg laste opp og integrere ditt eget verk eller til og med andre ikonfonter som du har funnet. Det er også mange gratis ikoner her, og til og med noen premium pakker hvis du virkelig vil ut.
Totalt sett var Pictonic sannsynligvis min minst favoritt av gjengen. Valget av gratis ikoner var ikke så bra, og du har ikke tilpasningsalternativene som de andre tjenestene har. En ting jeg liker med Pictonic er den enkle prismodellen for premiumikoner: $ 0, 59 per ikon eller $ 199 for ubegrenset tilgang. Fint og enkelt!
Hvilket ikon Font Generator er din favoritt?
Totalt sett er alle disse fire tjenestene verdt å sjekke ut. De er alle veldig enkle å bruke og spekket med verdi.
Nå som du har sett tankene mine om disse fire fontgeneratorene, legg igjen en kommentar nedenfor og fortell meg tankene dine. Har du brukt noen av disse tjenestene i tidligere prosjekter? Hvilken anbefaler du? Hvilke andre alternativer er det der jeg savnet?