Tüpograafia mõistmine 10 Kasulikud tööriistad ja ressursid
Oma viimases artiklis Tüüpograafia mõistmise kohta kirjutasin ma sellest, mis läheb tüpograafia kujundamisse ja kuidas seda manipuleerida, et parandada teie veebisaidi paigutust ja suurendada kasutajate kogemusi. Selles artiklis olen loetletud 10 minu lemmiktrüki tööriista veebis.
Need võivad aidata luua HTML-võrke ja sisupiirkondi, luua CSS-stiile, luua fontide nimesid ja hulk muid lahedaid asju. Vaadake mõningaid allolevaid linke ja andke meile teada oma mõtted postiküsitluse valdkonnas.
Soovitatav lugemine: Tüpograafia mõistmine: veebi kirjutamine
Font Matrix
See online-juhend on postitatud 24-tunnise disainiblogi poolt. See sisaldab maatriksitabelit kõigist standardsetest veebifontidest, mida leiate vaikimisi erinevatelt tarkvaratarnijatelt. Populaarsed pealkirjad hõlmavad Windows, Mac OS X, Microsoft Office ja Adobe Creative Suite'i programme.
Värvi kontrastikontroll
Värvikontrast on sageli probleemiks, kui te olete väljaspool must-valge mudelit. Kui leiad sobi, siis tundub see nagu disaini täiuslikkus. Samas on halb värvikombinatsioon väga halb ja mõjutab negatiivselt üldist disaini. See väike veebitööriist aitab teil valida värvide kogumi, mis sobivad üksteisega mis tahes stiili paigutuse jaoks.
HTML-ipsum
Kas teil on vaja Lorem Ipsumi tööriista, mis suudaks teha rohkem kui ainult teksti väljavõte? See online HTML-generaator loob koodiplokke kõige levinumate elementide jaoks. Mõned näited on korrastamata nimekirjad, definitsiooniloendid, veebivormid, tabelid ja palju muid lahendusi.
Typechart
Typechart on üks minu lemmikvahendeid CSS arendajana. Ma otsin tihti oma süsteemis konkreetse fondi vastavust veebiprojektile, kuid mul ei ole aega kogu oma kollektsiooni klappida. See vinge tööriist võimaldab teil läbi sõeluda populaarsete fondivalikute valikute ja isegi alla laadida õige CSS-koodi!
PX-to-EM.com
Kui te ei nulli vaikimisi brauseri teksti suurust, on tõenäoliselt probleeme, mis sobivad kuni pikslitega. See brauserirakendus annab nii konversioonitabeli kui ka kasutajaliidese, et px oleks em. Kindlasti on see väga lihtne tööriist, kuid see pakub käepärast juhendit, millel on tõesti lihtne funktsionaalsus - ja te ei saa võita tasuta hinnakirja.
CSS-i tüüp
Ma ei soovita CSS Type Set'iga liiga kaua kinni jääda, sest see on tõesti algaja tööriist. See võimaldab teil genereerida CSS-koodi, mis põhineb konkreetsetel valitud fontide omadustel. Kuigi see on kõigepealt väga kasulik, muutub see aja jooksul karguks, mis toetub. Ja te ei saa ise motiveerida CSS-i omadusi ise hallata. Aga kui teil on vaja projekti aega säästa, ei saa seda vahendit tähelepanuta jätta.
tüüpiline peegeldamine
Siin on üks tõeliselt unikaalne näide fondi eelvaate raamatust. tüüpiline flipping sisaldab käputäis kirju, mis on teie operatsioonisüsteemile omased. See skannib teie fontide kataloogi automaatselt, et saada kõige veebipõhiseid lahendusi. Võite neid võrrelda kõrvale ja valida oma lemmikvalikute vahel. See on veel üks suur ajaveetaja, keda te järjehoidja ja ei mõelda kuni viimase hetke.
Tüpograafiline võrk
HTML ja CSS võrgustiku ümber kujundamise üle räägitakse palju. Sa tõenäoliselt mõistad, kuidas võrgud töötavad ja veebisaidi mõõtmine pikslites ei erine. See CSS-Tricks'i koostatud võrgukoolitus on pigem juhitud pingutus digitaalse ajastu tüpograafia aluste tutvustamiseks. See on veebidisaini valdkonnas palju rohkem arenenud teema. Aga kui teil on kannatust, soovitan teil läbi vaadata üksikasjad, et näha, kuidas need võrguomadused teie lehe paigutust tegelikult mõjutavad.
Mis on Font!
Me kõik oleme leidnud logo või pildi, millel on tõesti jahe tuvastamatu font. MisTheFont on internetis paar aastat teinud ja on ikka veel minu lemmik. Valite üleslaaditava pildi ja nende skript analüüsib pildil olevat teksti, et see sobiks sarnaste kirjatüüpidega. Rakendus ühendab teid isegi välistoodetega, kus saate iga fonti osta.
Baasjoone / joon-kõrguse kalkulaator
Lõpuks tõesti võimas tööriist liinide kõrguse ja rütmiomaduste loomiseks. Sisestage lihtsalt põhifondi suuruse ja rea kõrguse väärtused või lisage oma kohandatud CSS-kood küljele. Rakendus loob eelvaateid mõne erineva stiiliga, et saaksite ettekujutuse sellest, kuidas need omadused teie veebisaidil näevad.
