Pagrindinis » UI / UX » Tipografijos supratimas 10 Naudingi įrankiai ir ištekliai

    Tipografijos supratimas 10 Naudingi įrankiai ir ištekliai

    Mano paskutiniame straipsnyje apie supratimą apie tipografiją parašiau apie tai, kas patenka į tipografijos dizainą ir kaip jį manipuliuoti, kad pagerintumėte jūsų svetainės maketą ir pagerintumėte naudotojų patirtį. Šiame straipsnyje aš įtraukiu į sąrašą 10 mano mėgstamiausių tipografijos įrankių žiniatinklyje.

    Tai gali padėti kurti HTML tinklus ir turinio sritis, kurti CSS stilius, generuoti šriftų pavadinimus ir kitų įdomių dalykų krūva. Patikrinkite kai kurias žemiau pateiktas nuorodas ir būtinai praneškite mums savo mintis pokalbio srityje.

    Rekomenduojamas skaitymas: Typografijos supratimas: Rašymas internete

    Šrifto matrica

    Šis internetinis vadovas buvo paskelbtas 24 valandų dizaino dienoraštyje. Jame yra visų standartinių žiniatinklio šriftų matricos lentelė, kurią pagal numatytuosius nustatymus rasite įvairiuose programinės įrangos gamintojuose. Populiarūs pavadinimai apima „Windows“, „Mac OS X“, „Microsoft Office“ ir „Adobe Creative Suite“ programas.

    Spalvų kontrasto patikrinimas

    Spalvų kontrastas dažnai yra problema, kai išvengsite standartinio juodos ir baltos spalvos modelio. Kai surasite rungtynes, tai atrodo kaip dizaino tobulumas. Tačiau prastas spalvų derinys atrodo labai blogas ir neigiamai paveiks bendrą dizainą. Šis nedidelis žiniatinklio įrankis gali padėti išsirinkti spalvų rinkinį, kad jie atitiktų vienas kito stiliaus išdėstymą.

    HTML-Ipsum

    Ar jums reikia „Lorem Ipsum“ įrankio, kuris gali padaryti daugiau nei tik išvesties tekstas? Šis internetinis HTML generatorius sukurs dažniausiai naudojamų puslapio elementų kodų blokus. Kai kurie pavyzdžiai: nereguliuojami sąrašai, apibrėžimų sąrašai, žiniatinklio formos, lentelės ir daugybė kitų sprendimų.

    „Typechart“

    Typechart yra viena iš mano mėgstamiausių įrankių kaip CSS kūrėjas. Dažnai noriu suderinti konkretų mano sistemos šriftą su interneto projektu, bet aš tiesiog neturiu laiko apversti visą savo kolekciją. Šis nuostabus įrankis leidžia persijoti populiarių šriftų šeimų pasirinkimų ir netgi atsisiųsti tinkamą CSS kodą!

    PX-to-EM.com

    Jei nenustatysite numatytojo naršyklės teksto dydžio, greičiausiai turėsite problemų, atitinkančių „ems“ pikselius. Ši naršyklėje esanti programa suteikia konversijos lentelę ir vartotojo sąsają, skirtą p. Tai tikrai paprastas įrankis, tačiau jis siūlo patogų vadovą su tikrai paprastu funkcionalumu - ir jūs negalite įveikti nemokamos kainos žyma.

    CSS tipo rinkinys

    Nerekomenduoju per ilgai laikytis CSS tipo rinkinio, nes tai tikrai pradedantiesiems skirtas įrankis. Tai leidžia jums sukurti CSS kodą pagal konkrečias pasirinktas šrifto savybes. Nors iš pradžių tai labai naudinga, laikui bėgant ji tampa ramentu, kuris pasilieka. Ir jūs negalėsite motyvuoti valdyti CSS savybių. Bet jei jums reikia sutaupyti laiko projektui, šios priemonės negalima pamiršti.

    tipiškas

    Čia yra vienas tikrai unikalus šrifto peržiūros bibliotekos pavyzdys. tipiškas prakeikimas apima keletą šriftų, kurie yra gimtoji jūsų operacinei sistemai. Jis automatiškai nuskaito jūsų šriftų katalogą, kad pasiektų labiausiai saugius interneto sprendimus. Galite juos palyginti lygiagrečiai ir lengvai pasirinkti tarp mėgstamiausių parinkčių. Tai dar vienas puikus laiko taupymas, kurį žymi ir nemanote iki paskutinės minutės.

    Tipografinis tinklelis

    Daug kalbama apie HTML ir CSS projektavimą aplink tinklelį. Jūs tikriausiai suprantate, kaip veikia tinklai, o svetainės matavimas pikseliais nesiskiria. Šis „CSS-Tricks“ tinklelio mokymas yra labiau orientuotas į pastangas įvesti skaitmeninės eros tipografijos pagrindus. Tai daug labiau pažengusi žiniatinklio dizaino sritis. Tačiau, jei turite kantrybės, rekomenduoju pereiti prie informacijos, kad pamatytumėte, kaip šios tinklo ypatybės gali iš tikrųjų paveikti jūsų puslapio išdėstymą.

    Kas tai yra!

    Mes visi radome logotipą ar vaizdą su kai kuriais tikrai kietais neatpažįstamais šriftais. Kas jau keletą metų vykdo internetą, ji vis dar yra mano mėgstamiausia. Jūs pasirenkate įkeltą vaizdą ir jų scenarijus analizuos paveikslėlio tekstą, kad atitiktų bet kokius panašius šriftus. Programa netgi susieja jus su išoriniais produktais, kuriuose galite įsigyti kiekvieną šriftą.

    Pradinis / linijos aukščio skaičiuoklė

    Galiausiai tikrai galingas įrankis linijos aukščio ir ritmo savybių generavimui. Tiesiog įveskite pagrindinio šrifto dydžio ir linijos aukščio vertes, arba įtraukite savo pasirinktą CSS kodą į šoną. Programa generuos peržiūros keliais skirtingais stiliais, kad galėtumėte sužinoti, kaip šios savybės atrodys jūsų svetainėje.