15 Orodja za tipografijo na spletu Vsi oblikovalci morajo vedeti
Tipografija je temelj vsakega oblikovanja, saj je branje ena najbolj osnovnih stvari, ki jih počnemo na spletu. Izbrana tipografija vpliva na več vidikov spletnega mesta, vključno z berljivost, razpoloženje in celotno uporabniško izkušnjo. To je bistveno za oblikovalce in razvijalce poznati osnovna načela tipografije do ustvarite berljive, prijetne modele.
O orodjih za seznanjanje s pisav smo govorili že prej in danes bomo delili z vami orodja za tip, ki vam omogočajo boljšo izkušnjo branja na spletnih mestih, ki jih gradite in / ali oblikujete..
Tu so vtičniki, spletna orodja in skripte, ki vam bodo pomagali ustvarite odlične naslove in čisto berljivo besedilo.
Tipska ploščica
Ne bo oblikoval izbire za vas, ampak bo določil pravo oznako s stilom za običajne tipografske predloge. Prav tako vam lahko daje nasvete o pravilnem slogu kopiranja besedila.
Preveri: Demo | Dokumentacija
Gutenberg
Gutenberg je prilagodljiv in enostaven tipografski zagonski komplet za razvijalce in oblikovalce. To vam bo pomagalo, da nastavite velikost osnovnega tipa, višino linije in maksimalno širino. Gutenberg je odprtokodni projekt, zato ga lahko prispevate, ga prilagajate in spreminjate.
Preveri: Demo | Dokumentacija
Lettering.js
Lettering.js je vtičnik jQuery, ki vam omogoča nadzor nad vrsto sesutja. To vam omogoča, da bi dobili uredniško oblikovanje z lahkoto in upravljanje kode. Spletna stran vsebuje neverjetne primere tipografije, narejene s tem vtičnikom za navdih.
Preveri: Demo | Dokumentacija
Typebase.css
Typebase.css je prilagodljiv tipografski slog. Vsebuje tako različice in manj različic ter je enostavno spremenjen v sodobne spletne projekte.
Preveri: Demo | Dokumentacija
FitText
FitText je plugin, ki bo prilagodil velikost pisave vaše spletne strani. To vam bo pomagalo doseči prilagodljive naslove za različne ločljivosti zaslona; z drugimi besedami, naredite odziv na tipografijo. Narejen je samo za prikazovanje ogromnega besedila.
Preveri: Demo | Dokumentacija
Kerning.js
Kerning.js vam pomaga pri samodejnem spreminjanju, prilagajanju in spreminjanju tipografije s CSS. Z Kerning.js lahko začnete.
Preveri: Demo | Dokumentacija
Typesettings.css
Typesettings.css je vaše igrišče za ustvarjanje minimalističnih spletnih projektov ali blogov. Vsi tipografski slogi, ki se uporabljajo tukaj, so navdihnjeni z osnovami grafičnega oblikovanja.
Preveri: Demo | Dokumentacija
Nahrbtnik
Z Rucksackom lahko ustvarite čudovito tipografijo tekočine, zahvaljujoč novi odzivni lastnosti na velikost pisave. Ustvarjanje odzivne tipografije je izjemno preprosto.
Preveri: Demo | Dokumentacija
FlowType.JS
Najbolj berljiva tipografija vsebuje od 45 do 75 znakov na vrstico, toda za ugotovitev, da je ravnovesje za razvijalce zahtevna naloga. FlowType.JS spremeni velikost pisave in posledično višino črte glede na širino določenega elementa.
Preveri: Demo | Dokumentacija
Blast.js
Blast.js vam bo pomagal ločiti besedila, da boste lažje manipulirali tipografijo. Vsebuje 4 vgrajene ločnice: znak, besedo, stavek in element. Lahko se ujema tudi z izrazi in frazami po meri.
Preveri: Demo | Dokumentacija
slabText
slabText je preprost skript, ki razdeli naslove v vrstice in popolnoma izpolni razpoložljivi horizontalni prostor. Skript izračuna idealno število znakov za vsako vrstico tako, da razdeli razpoložljivo širino pisave po velikosti črk.
Preveri: Demo | Dokumentacija
Tip Scale
Z možnostjo Type Scale lahko predogledate in izberete pravo vrsto lestvice za vaš projekt. Ni pravil - samo igraj se z velikostjo pisave, merilom in različnimi spletnimi pisavami.
Preveri: Demo | Dokumentacija
Tipografska
Tipografija vam pomaga, da odzovete tipografijo. Vse kar morate storiti je, da izberete le nekaj pisav, nastavite nekaj nastavitev in dobite lepo odzivno tipografijo.
Preveri: Demo | Dokumentacija
Typi
Typi je mešanica, ki jo lahko uporabite za enostavno odzivno tipografijo. Ustvari velikost pisave in višine vrstic za HTML in druge elemente. Tudi Typi ima funkcijo navpičnega ritma za izračun višine črte.
Preveri: Dokumentacija
Lining.js
Z vtičnikom Lining.js boste dobili popoln nadzor nad spletno tipografijo. Podprto je za večino priljubljenih brskalnikov, kot so Safari, Google Chrome, Opera in Mozilla Firefox.
Preveri: Demo | Dokumentacija
Bonus: 2 več orodij!
Stanje spletnega tipa
Stanje spletnega tipa je spletno mesto, ki ponuja posodobljene podatke o podpori za vrsto in funkcije po spletu. Uporabite lahko iskanje ali kategorije, na primer kerning, kapitalne razmake, nalaganje pisav CSS in drugo, da najdete točno to, kar potrebujete.
Tipografija
Tipografija je odličen vtič za splet in skico, ki vam omogoča, da po enih črkah postavite neprekinjene prostore, povežete številko in enoto. Prav tako odstrani dvojne prostore, vstopi, pike in druge tipkarske napake, tako da lahko dosežete čisto lepo tipografijo, ki jo je lahko brati.
Preveri: Dokumentacija