30 parasta Web Typography Resources Online -palvelua
Näyttää siltä, että web-suunnittelijoiden keskuudessa on kaksi leiriä: ne, jotka omaksuvat web-typografian , kokeilevat sitä ja yrittävät kokeilla uusia asioita lähes kaikissa niiden malleissa; ja ne, jotka välttävät sen kuin rutto, päättäen käyttää tavallisia, web-turvallisia kirjasimia, joilla on vain vähän vaihtelua.
Näyttää myös siltä, että monet suunnittelijat, jotka kuuluvat toiseen ryhmään, toivovat, että he olivat enemmän kuin ensimmäiset.
Alla olevat resurssit auttavat sinua parantamaan verkkotyyppisi riippumatta siitä, mihin leiriin kuuluu.
On työkaluja ainutlaatuisen typografian, viitteiden ja artikkeleiden luomiseen, jotka voivat opettaa sinulle typografisia periaatteita, sekä runsaasti inspiraatiota ja uutisia, jotta sinä päivität web-typografian tilasta.
Typografiatyökalut
Typetester
Typetesterin avulla voit verrata jopa kolmea fonttia, vierekkäin ja haluamasi näytesanoman. Voit määrittää perusviivan fontin koon, kirjasimen, koon, johtavan, seurannan, kohdistuksen, sanojen välisen etäisyyden, koristelun, värin ja taustan värin, jotta saat tarkan kuvan siitä, mitä fontit näyttävät todelliselta verkkosivulta. Sitten, kun olet kaiken etsimässä juuri haluamallasi tavalla, voit tarttua CSS: ään.
HTML Ipsum
HTML-Ipsum on lorem ipsum-generaattori, joka on tarkoitettu nimenomaan web-suunnitteluun. Sen sijaan, että annat vain tekstin palaset, HTML-Ipsum voi antaa sinulle valmiiksi muotoillun tekstin, kuten kappaleet, tilatut luettelot, tyhjät taulukot, lomakkeet ja navigaatioluettelot. Esimuotoiltu teksti, kuten tämä, on erinomainen tapa säästää aikaa, kun luodaan verkkosivujen mokkakuvat ja alkuperäiset mallit.
Typechart
Tyyppikartan avulla voit selata esimuotoiltuja, web-turvallisia kirjasimia ja tarkastella niitä, kun ne näkyvät sekä Windows-tietokoneessa että Mac-tietokoneessa. Voit lajitella fontit mukaan lukien koon, kirjasimen ja painotuksen mukaan.
WP-Typografia
WP-Typografia on WordPress-laajennus, joka auttaa tekemään standardin WP-typografian houkuttelevammaksi. Se tukee tavuttamista, etäisyyden säätöä, älykkään hahmon korvaamista (mukaan lukien lainausmerkit, viivat, ellipsit ja matemaattiset symbolit) sekä CSS-koukut erityisten asioiden (mukaanlukien ampersands, lyhenteet ja numerot) muotoiluun.
CSS-tyyppisarja
CSS Type Setin avulla voit muotoilla tekstiä ja kopioida CSS. Se on yksinkertainen CSS-generaattori, joka sopii erinomaisesti yhden fontin määrittämiseen kerrallaan. Sen avulla voit hallita kirjasintyyppiä, kokoa, välejä, johtajia, koristeita ja värejä.
Käännä tyypillinen
Flipping Tyypilliset näytöt näyttävät tekstiä useista tietokoneeseen asennetuista kirjasimista. Se on erinomainen tapa verrata joukkoa fontteja, vierekkäin, kaikki kerralla. Ainoa varoitus: vain joitakin fontteja on web-turvallinen.
Typografinen ruudukko
Vakiintunut vertikaalinen rytmi on yksi niistä asioista, jotka erottavat hyvää typografiaa. Typografinen ruudukko auttaa sinua määrittämään pystysuoran rytmin. Se sisältää myös vertikaalisen ruudukon, joka ohjaa sekä typografiaa että muita elementtejä.
WhatTheFont
WhatTheFont tarjoaa helpon tavan selvittää, mikä fontti on. Lähetä vain kuva (tai määritä URL-osoite) ja WhatTheFont määrittää, mitä fonttia käytetään. Tämä on erinomainen tapa löytää fontteja, joita on käytetty kuvissa tai Flash-tiedostoissa.
CSS vertikaalisella rytmillä
Kuten jo mainittiin, johdonmukainen vertikaalinen rytmi asettaa erinomaisen typografian erilleen siitä, mikä on vain "hyvää". Tämä työkalu auttaa sinua luomaan CSS typografialle, jolla on pysyvä vertikaalinen rytmi. Syötä vain fonttiperhe, perusfontin koko, perusviivan korkeus ja tavoite fonttikoot ja laske, jotta saisit CSS: n tasaiselle pystysuoralle rytmille.
Baseline Rhythm Calculator
Toinen suuri vertikaalinen rytmilaskuri. Tämä kuitenkin näyttää, mitkä eri kirjasinkokoisuudet näyttävät vierekkäin, kun ne on asetettu vakiintuneeseen vertikaaliseen rytmiisi. Se on erinomainen tapa varmistaa, että kaikki käytettävät kirjasinkokoot näyttävät kunnollisilta.
Fonttipolttimella
Font Burner -ominaisuuden avulla voit upottaa fontit sivustoillesi sIFR: n avulla käyttämällä graafista käyttöliittymää. Fonttipolttimella on tällä hetkellä yli 1000 fonttia, ja siellä on myös WordPress-laajennus. Sinun tarvitsee vain käyttää sitä, löydät fontin, jota haluat käyttää, kopioida upotuskoodin ja liittää sen verkkosivustosi koodiin.
Blind Text Generator
Tämä dummy-tekstigeneraattorin avulla voit luoda ei vain lorem ipsum -ohjelmaa, mutta myös muutamaa muuta tekstiä. Samalla voit myös muotoilla kyseisen tekstin suoraan generaattorissa (napsauta Lisäasetukset) ja kopioi sitten CSS.
lähtötilanteessa
Lähtökohtana on ruudukko- ja typografiakehys, joka sisältää tiedostoja, joilla nollaa selaimen oletusarvot ja luodaan perus typografinen layout. Se on hyvä vaihtoehto suunnittelijoille, jotka haluavat käyttää verkkoasennusta ja haluavat myös apua sivuston typografian suunnittelussa. Typografia-asetukset sisältävät otsikoita, luetteloita, kappaleita, blockquotes ja taulukoita sekä joitain muita merkintäkoodeja.
Fontti Matriisi
Fonttimatriisi näyttää Mac- ja Windows-käyttöjärjestelmien, Microsoft Office- ja Adobe Creative Suite -ohjelmiston mukana tulevat fontit, jotka kaikki ovat verkossa, mikä helpottaa niiden kirjasinten löytymistä. Esimerkiksi jos sivustosi kohdistuu enimmäkseen muotoilijoihin, voit tehdä Adobe Creative Suite -ohjelmistostasi ensimmäisenä kirjasintyyppiäsi, kun taas jos sivusto on tarkoitettu yrityskäyttäjille, ensimmäinen kirjasin voi olla jotain Microsoft Officesta.
typograph
Typografialla voit kokeilla eri asteikkoja ja muita vertikaalisen rytmin osia. Se sisältää useita perinteisiä asteikkoja (mukaan lukien Le Corbusier ja Fibonacci) sekä muita layoutvaihtoehtoja.
Web-fonttipalvelut
Typekit
Typekit tarjoaa kirjasimia eri tyyppisiltä myyjiltä ja valimoilta, mukaan lukien Movable Type of League, FontFont ja Veer (voit tarkastella koko fonttiluetteloa kirjautumatta tilille). Ne tarjoavat myös lisävalvontatoimintoja fonttien muotoiluun, äärettömään skaalautuvuuteen ja kolofoniin, joka kertoo kävijöille, mitä fontteja sivustossasi käyttää. Typekitin hinnoittelu on kohtuullista, vaihtelevasta maksuttomasta osittaisesta käyttöoikeudesta jopa 100 dollariin vuodessa korkean liikenteen sivustoille.
Kernest
Kernest on Web-fonttipalvelu, joka käyttää OFL-, GPL-, GUST- ja Creative Commons -fontteja sekä kaupallisluvista. Monet niiden fontit ovat vapaita käyttää (palvelu itse on ilmainen), kun taas toiset ovat tilausmaksuja alkaen muutaman dollarin.
Fontit elävät Ascenderistä
Ascender tarjoaa omat Web-fonttipalvelunsa, Fonts Live. Heillä on käytössään yli 110 kirjasinlajia, joissa on monotype-, Microsoft-, Bigelow & Holmes- ja muita fontteja sekä omat kirjasimet.
Google Font API
Google tarjoaa rajoitetun valikoiman avoimen lähdekoodin web-kirjasimia. Vaikka valinta ei ole suuri, se on ilmaista ja Google tukee sitä, joten et todennäköisesti aja kapasiteettikysymyksiin tai viivästymiseen.
TypeFront
TypeFont lähestyy web-fontteja hieman eri tavalla. Web-ystävällisiä kirjasimia sisältävän kirjaston tarjoamisen sijasta niiden avulla voit ladata omia fontteja, joilla on web-ystävällinen käyttöoikeus. Tämä on hieno vaihtoehto, jos fontteja, joita haluat käyttää, ei ole tällä hetkellä tarjolla millä tahansa muulla web-fonttipalvelulla. Alhaisen liikenteen sivustoihin sisältyy ilmainen suunnitelma sekä maksulliset suunnitelmat.
Typotheque Web-fontit
Typotheque tarjoaa omat web-kirjasintopalvelunsa, jotta fontit ovat saatavilla fonttien ja fonttien käyttöön. Etuna on, että on olemassa vain kertaluonteinen lisenssikustannus, joka voi kattaa sekä tulostus- että web-sovellukset. Haittapuoli on se, että valinta rajoittuu vain niiden fontteihin.
Typografia Resurssit ja artikkelit
Web-sovelluksen tyypillisen tyylin elementit
Tämä on erittäin perusteellinen opas kaikille niille, jotka haluavat oppia paitsi hyvän web-typografian perusteet, mutta myös kehittyneemmät tekniikat ja periaatteet. Se on jaettu lukuihin ja alaryhmiin, mukaan lukien vaaka- ja pystysuuntaiset liikkeet, lohkot ja kohdat, sivut, koko ja paljon muuta. Se on käynnissä oleva työ, joten odotat lisää tulevan näkyviin.
Nice Web Type
Mukava Web-tyyppi on tonnia tietoa web-typografian toteutuksesta. Heillä on "muistiinpanoja" kaikesta aloittamasta web-typografian avulla käyttämällä CSS @ font-facea. He keskustelevat myös trendistä ja uusista ideoista säännöllisesti, ja heillä on sivu, jossa he pitävät joitain parhaita kirjasimia siellä.
12 esimerkkejä kappaleen typografiasta
Tämä Jon Tanin näytekappaleformaattien kokoelma on loistava lähtökohta kenelle tahansa, joka suunnittelee teksti-raskas sivusto. Monet suunnittelijat jättävät huomiotta kaikki mahdollisuudet, jotka tulevat kappaleiden muotoiluun ja valitsevat perinteisempiä, konservatiivisempia vaihtoehtoja. Tämä artikkeli osoittaa, että ei ole vaikeaa astua laatikosta ja tehdä jotain mielenkiintoista kappaleiden kappaleiden kanssa.
Typografinen kontrasti ja virtaus
Tämä on fantastinen WebDesignerWall-opas web-typografian virtauksen ja kontrastin periaatteista. Se jakaa nämä periaatteet useisiin osioihin, mukaan lukien koko, kirjasintyyppi / luokittelu, väri ja paino.
Tarkistettu Fontti Stack
Tässä artikkelissa käsitellään yleisten web-turvallisten CSS-fonttien laajentamista tutkimalla muita yleisesti asennettuja kirjasimia. Se tutkii myös joidenkin suosittujen sivustojen kirjasinpinoja sekä suosituksia siitä, miten ne voisivat parantaa pinojaan.
Web-typografiassa
Tämä artikkeli Jason Santa Maria on A List Apart on erittäin kattava tarkastella pariksi kirjoituksia sivustossasi suunnitelmia. Se on aihe, jota ei käsitellä kovin usein, mutta on ensiarvoisen tärkeää luoda hyviä typografisia malleja verkossa.
Ajattelu tyypin kanssa
Think with Type on vastaavan verkkosivuston Ellen Luptonin samalle nimelle. Se tarjoaa runsaasti perustietoa typografiasta. Vaikka paljon se on keskittynyt painettu typografia, runsaasti mukana olevia tietoja voidaan soveltaa web typografiaan.
10 suurta vinkkejä Web-typografian parantamiseen
Luettelo kymmenestä yksinkertaisesta asiasta, joita voit tehdä sivustosi suunnittelun typografian parantamiseksi. Se sisältää tietoa fontti, koko, asteikko ja hierarkia, johtava ja enemmän.
Typografia Inspiraatio, trendit ja uutiset
Typophile
Typophile on foorumi kirjasinlajittelijoille ja typografijoille. Jos haluat selvittää, mitä typografian maailmassa tapahtuu, Typophile on hyvä paikka etsiä. Se on myös hyvä paikka saada apua typografisiin ongelmiin, joita sinulla mahdollisesti on.
Rakastan typografiaa
ILT on blogi, joka on kokonaan typografiassa. Siinä käsitellään sekä muotoilua että liiketoiminta-aiheita ammattimaisesta näkökulmasta. Heidän arkistointi on valtava, joten on paljon tietoa nykyisistä ja aiemmista uutisista ja suuntauksista, jotka pitävät sinut kiireisenä.
me rakastamme typografiaa
WLT on typografian, kirjoitus-, signage- ja muun tyyppinen galleria. Käyttäjät voivat lähettää heille rakastettavia kuvia, ja se on hyvä paikka viettää typografian inspiraatiota seuraavaa projektia varten.
Otsikoiden tipografia
Muotoilun elementteillä on upea galleria, jossa on yli 120 esimerkkiä otsikon typografiasta. He käyttävät gamut yksinkertaisista monimutkaisiin, erilaisiin kirjasintyyleihin ja tyyliin. Se on erinomainen paikka mennä, jos etsit vähän inspiraatiota. Heillä on myös galleria vedä lainausmerkkejä 20+ esimerkkiä.
ladonnalle
Typographica tarjoaa tyypin arvosteluja, kommentteja ja typografioita. Heidän tyyppikartoituksensa ovat erityisen informatiivisia, jos aiot oppia siitä, mikä tekee hyvän kirjasintyypin.
Hieno Web-typografian kohtausten takana
Tämä on oikeastaan ensimmäinen viiden osan sarjassa. Tämä viesti tarkastelee A List Apartin takana olevaa typografiaa, erottaen sivuston eri osiin käytetyt fontit ja tyylejä. Seuraavat virat tarkastellaan: Jesús RodrÃguez Velasco , Jon Tan , Designr.it , ja Codex Transportica .
Typesites
Typesitesites on blogi, joka näyttää hienoja web-typografian malleja säännöllisesti. Niiden sivustot ovat moninaisia, mutta kaikki sisältävät tyypin inspiraatiokäyttöä.
Käännetty yksinomaan Webdesigner Depot - sivustolle Cameron Chapman