15 Online tipografijos įrankiai Visi dizaineriai turėtų žinoti
Tipografija yra bet kokio dizaino pagrindas, nes skaitymas yra vienas svarbiausių dalykų, kuriuos darome internete. Jūsų pasirinkta tipografija turi įtakos daugeliui svetainės aspektų, įskaitant skaitymo, nuotaikos ir bendro naudojimo patirties. Svarbu, kad dizaineriai ir kūrėjai galėtų žinoti pagrindinius tipografijos principus į sukurti skaitytinus malonius dizainus.
Mes kalbėjome apie šriftų susiejimo įrankius prieš ir šiandien mes bendriname su jumis įvesdami įrankius, kuriais galite pasiekti geresnę skaitymo patirtį svetainėse, kurias kuriate ir (arba) kuriate.
Čia pateikiami papildiniai, internetiniai įrankiai ir scenarijai, kurie padės jums sukurti nuostabias antraštes ir švarus skaitomas tekstas.
Plokštelė
Tai jums nepadės kurti dizaino pasirinkimo, bet nustatys tinkamą žymėjimą su stiliaus tipais, naudojančiais bendrus tipografinius šablonus. Jis taip pat gali suteikti patarimų, kaip tinkamai kopijuoti teksto kopiją.
Patikrinkite: Demo | Dokumentacija
Gutenbergas
„Gutenberg“ yra lanksti ir paprasta naudoti tipografija, skirta kūrėjams ir dizaineriams. Tai padės nustatyti pagrindinio tipo dydį, linijos aukštį ir maksimalų plotį. „Gutenberg“ yra atviro kodo projektas, todėl nedvejodami prisijunkite, prisitaikykite ir keiskite jį.
Patikrinkite: Demo | Dokumentacija
Lettering.js
Lettering.js yra jQuery įskiepis, kuris suteikia jums galimybę kontroliuoti kerning tipo. Tai leidžia jums lengvai redaguoti redakciją ir valdyti kodą. Svetainėje pateikiami nuostabūs tipografijos pavyzdžiai, su kuriais įkvėptas šis įskiepis.
Patikrinkite: Demo | Dokumentacija
Typebase.css
Typebase.css yra pritaikoma spausdinimo stiliaus lentelė. Jame yra tiek saas, tiek mažiau versijų ir lengvai modifikuojami į šiuolaikinius interneto projektus.
Patikrinkite: Demo | Dokumentacija
„FitText“
„FitText“ yra įskiepis, kuris padarys jūsų svetainės šriftų dydžius lankstesnius. Tai padės jums pasiekti įvairias ekrano rezoliucijas; kitaip tariant, jūsų tipografija reaguoja. Jis skirtas tik didžiajam tekstui rodyti.
Patikrinkite: Demo | Dokumentacija
Kerning.js
Kerning.js padeda automatiškai transformuoti, keisti ir modifikuoti savo tipografiją su CSS. Su Kerning.js lengva pradėti.
Patikrinkite: Demo | Dokumentacija
Tipų nustatymai.css
Typesettings.css yra jūsų žaidimų aikštelė kuriant minimalistinius interneto projektus ar tinklaraščius. Visi čia naudojami tipografijos stiliai įkvėpti grafinio dizaino pagrindų.
Patikrinkite: Demo | Dokumentacija
Kuprinė
Su „Backpack“ galite sukurti nuostabų skysčių tipografiją dėl naujo, reaguojančio į šrifto dydį. Atsiradusių tipografijų kūrimas yra ypač lengvas.
Patikrinkite: Demo | Dokumentacija
FlowType.JS
Labiausiai skaitoma tipografija apima nuo 45 iki 75 simbolių eilutėje, tačiau norint sužinoti, kad pusiausvyra yra sudėtinga kūrėjų užduotis. „FlowType.JS“ keičia šrifto dydį ir vėliau linijos aukštį pagal konkretaus elemento plotį.
Patikrinkite: Demo | Dokumentacija
Blast.js
„Blast.js“ padės atskirti tekstus, kad būtų lengviau manipuliuoti tipografija. Jame yra 4 integruoti ribotojai: simbolis, žodis, sakinys ir elementas. Jis taip pat gali atitikti pasirinktines išraiškas ir frazes.
Patikrinkite: Demo | Dokumentacija
slabText
slabText yra paprastas scenarijus, kuris skiria antraštes į eilutes, kad būtų galima visiškai užpildyti turimą horizontalią erdvę. Scenarijus apskaičiuoja idealų skaičių simbolių, kuriuos reikia nustatyti kiekvienoje eilutėje, dalijant turimą plotį pikselių šriftu.
Patikrinkite: Demo | Dokumentacija
Tipo skalė
Su tipo skale galite peržiūrėti ir pasirinkti tinkamą projekto skalę. Nėra taisyklių - tiesiog žaisti su šrifto dydžiu, masteliu ir skirtingais interneto šriftais.
Patikrinkite: Demo | Dokumentacija
Tipografija
Tipografija padeda jums reaguoti į tipografiją. Viskas, ką jums reikia padaryti, yra tik keletas šriftų, nustatykite keletą nustatymų ir gausite gražią atsakingą tipografiją.
Patikrinkite: Demo | Dokumentacija
Typi
„Typi“ yra saaso mišinys, kurį galite naudoti norint lengvai reaguoti į tipografiją. Jis sukuria HTML ir kitų elementų šrifto dydį ir linijų aukštį. Be to, „Typi“ turi vertikalią ritmo funkciją, kad apskaičiuotų linijos aukštį.
Patikrinkite: Dokumentacija
Lining.js
Naudodami „Lining.js“ papildinį, galėsite visiškai kontroliuoti žiniatinklio tipografiją. Jis palaikomas populiariausiose naršyklėse, pvz., „Safari“, „Google Chrome“, „Opera“ ir „Mozilla Firefox“.
Patikrinkite: Demo | Dokumentacija
Premija: 2 Daugiau įrankių!
Žiniatinklio tipo būklė
Žiniatinklio tipo būklė yra svetainė, kurioje pateikiami naujausi duomenys apie tipo ir funkcijų palaikymą internete. Jei norite rasti būtent tai, ko jums reikia, galite naudoti paiešką arba kategorijas, pvz., Kerning, kapitalo tarpą, CSS šriftą ir dar daugiau.
Tipografija
„Typograph“ yra nuostabus žiniatinklio ir eskizo įskiepis, leidžiantis įterpti nesulaužančias erdves po vieno raidės žodžių, prijungti numerį ir įrenginį. Taip pat pašalinamos dvigubos erdvės, patenka į taškus ir kitus rašmenis, todėl galite pasiekti švarią, gražią, lengvai skaitomą spausdinimo tipografiją.
Patikrinkite: Dokumentacija