20 fantastiske jQuery-plugins for webtype
De siste årene har web-typografi gått fra en forlegenhet til et punkt med stolthet. Fra CSS til JavaScript skaffer vi deg fantastiske verktøy nesten daglig som hjelper oss med å implementere fantastisk type.
I dag skal vi se på de beste jQuery-pluginene som er spesialbygget for å gjøre webtypen mer fantastisk. Last ned noen få og ta din type videre.
Utforsk designressurser
Typografisk målingmanipulering
FitText - En plugin for oppblåsing av webtype
FitText lar deg enkelt og automatisk strekke et stykke tekst til størrelsen på den overordnede beholderen.
HATCHSHOW: en jQuery-plugin for balanseringstiltak
Hatchshow lar deg lage kolonner med tekst med et enhetlig mål, slik at du får den harde kanten, variabel tekststørrelse (en veldig populær effekt).
slabText - en jQuery-plugin for å lage responsive overskrifter
Nok en plugin som viser tiltakene for separate linjer. Det fine med denne er at linjene flyter veldig bra når du endrer størrelse på utsiktsområdet.
Responsive-Mål
Denne pluginen handler ikke om å lage kreative overskrifter, i stedet vurderer den noen få variabler om din type og genererer et ideelt og responsivt tiltak for avsnittene dine. Dette er ypperlig for å holde typen høyt lesbar i responsiv design.
BigText
BigText beregner skriftstørrelse og ordavstand som er nødvendig for å matche en tekstlinje til en bestemt bredde. Her er det en kul veiviser.
utligning
Kerning.js
Dette gjør akkurat slik det høres ut: hjelper deg med å kjerne webtypen din. Nettdesignere hopper vanligvis ut på kjernen fordi det er så komplisert og rotete, dette gjør prosessen en enkel.
TypeButter: Optisk Kerning FTW!
Heller enn å manuelt finjustere kerning for hver bokstav, kan du med TypeButter konfigurere optisk kerning som gjør jobben for deg. Du kan bruke en av de oppgitte fontoppsettene eller rulle dine egne.
jKerny.js, jQuery-plugin for å gjøre kerning enkelt
jKerny implementerer nye CSS-pseudovelgere for bokstavavstand, ordavstand, første bokstav, siste bokstav og mer.
innpakning
Bacon
Innpakning av tekst til det ekstreme. Bacon lar deg pakke tekst rundt en bezier-kurve eller en linje. Det er faktisk ganske imponerende og kan lage noen virkelig komplekse innpakninger.
jQSlickWrap - Glatt tekstinnpakning for jQuery
JQSlickWrap hjelper deg med å vikle teksten rundt et bilde, uansett hvor komplisert. Du justerer bare noen få innstillinger, og resten blir tatt vare på automatisk.
Vertikale rytme og grunnlinjegitter
jMetronome: Bruker jQuery for å beholde typografisk rytme
Dette skriptet hjelper deg med å opprettholde en vertikal rytme for typografien din ved å legge til polstring i forskjellige ikke-tekstelementer for å sikre at dets totale høyde er et multiplum av dokumentets samlede linjehøyde.
SimonFairbairn / Line-In-Typografi
Denne pluginen viser linjer basert på temaets linjehøyde, slik at du kan stille den vertikale rytmen riktig og stille opp all typografien din til et baseline-rutenett.
Auto linjehøyde: en jQuery-plugin for fleksible oppsett
Auto linjehøyde justerer linjehøyden til en beholder (for eksempel en div) i forhold til bredden, i forhold til skriftstørrelsen. Et annet flott verktøy for å hjelpe med responsiv type.
Superpraktisk
Lettering.js - En jQuery-plugin for radikal webtypografi
Lettering.js gir deg hva CSS ikke gjør: friheten til å målrette hver bokstav individuelt. Dette åpner for alle mulige fantastiske muligheter for kreativ styling per brev.
KarlRoos / jQuery.responsiveText
Plug and play responsiv tekst. Bare målrett en container eller hele siden, så skriptet vil gjøre resten!
Kule og gale effekter
jqIsoText: Plugin for jQuery Text Effect
En finurlig teksttillegg som manipulerer størrelsen på individuelle bokstaver for å skape en unik effekt.
Arctext.js - Buet tekst med CSS3 og jQuery
Å lage buede tekstlinjer er ganske vanskelig når du jobber med live webtype. Denne pluginen gjør det mye enklere og kan til og med hjelpe deg med å animere endringen.
Textualizer
Textualizer bygger en kreativ overgang fra ett avsnitt til et annet. Overgangen er en slags virvlet, blandet effekt som griper oppmerksomheten din.
Shuffle Letters Effect: en jQuery-plugin
Denne plugin gir deg en animasjon som bla gjennom en haug med tilfeldige bokstaver før du lander på tekststykket du skrev inn. En fin og interessant måte å introdusere en overskrift på.
TextGrad
TextGrad oppretter en gradient og strekker den over en tekstlinje. Enkelt og effektivt!
Hva gikk jeg glipp av?
Disse tjue jQuery-pluginene representerer de beste typografiske verktøyene jeg kunne finne. Jeg er sikker på at det er massevis mer der ute, så legg igjen en kommentar nedenfor og la meg få vite hva jeg savnet!
