Az ikonok betűtípusgá alakítása
Számos oka van annak, hogy a webhely ikonjait egyetlen betűtípussá konvertálni nagyon jó ötlet.
Az egyik az, hogy így kapunk drasztikusan csökkenti a súlyt, és ezért akár 14% -kal is meggyorsíthatja a web betöltési idejét.
Egy másik ok az a sokoldalúság, amelyet a web fejlesztésekor feltételez, mivel az ikon hozzáadása egyszerű HTML-sor bevezetésére szorítkozik, és emellett kínál minden előnye annak, ha ezt az ikont betűtípusként kezeljük a CSS-ben, és bármikor megváltoztathatjuk a méretet vagy a színt, anélkül, hogy FTP-vel kellene képeket feltölteni újra és újra.
És az utolsó, és talán a legfontosabb ok, hogy miért egyszerűség a mászásnál az ikonok, a mobil képernyőről a 40 hüvelykesre a felbontás elvesztése nélkül, mivel, röviden vektorokról beszélünk és nem raszterképek, mint egy normál png esetén.
Hogyan kezdjük?
- Az első dolog, amit meg kell tennie, az ikonok létrehozása az Illustrator, a Sketch, a Photoshop vagy bármely más alkalmazásban vektorszerkesztő program.
- Győződjön meg arról, hogy minden vonás kibővült (az Illustratorban -> Objektum> Kibontás), és hogy nincsenek maszkok vagy effektek. Egyszerű és tiszta nyomon követhető objektumnak kell lennie.
- Exportálja az ikont .SVG néven, egy vektoros formátum.
Az Iconvau lehetővé teszi számunkra a sablon letöltését, hogy még könnyebben létrehozhassuk az ikonjainkat.
Hogyan lehet őket forrást szerezni?
Sok ingyenes weboldal létezik amelyek lehetővé teszik .SVG ikonjainak egyetlen forrás formátumú fájlba történő összeállítását. Hármat ajánlunk:
Iconvau
Fontello
Icomoon
Alapvetően mindhárman ugyanazt teszik, lehetővé teszik, hogy feltöltse saját ikonjait, vagy válasszon a saját ingyenes ikonjai katalógusából, és töltse le a fájlt a forrásokkal együtt és az összes szükséges anyagot a webhelyükre történő telepítéshez.
Használhatja a Glyph nevű Photoshop bővítményt is, amely lehetővé teszi, hogy ugyanezt tegye, mint ezek a webhelyek: