A tipográfia megértése 10 Hasznos eszközök és források
A tipográfia megértéséről szóló utolsó cikkemben arról írtam, hogy mi történik a tipográfia tervezésében, és hogyan manipulálhatom, hogy javuljon a webhely elrendezésében, és hogy javítsa a felhasználói élményt. Ebben a cikkben a lista vagyok 10 kedvenc eszközem a tipográfia számára az interneten.
Ezek segíthetnek a HTML-rácsok és a tartalomterületek megépítésében, CSS-stílusok létrehozásában, betűtípusok létrehozásában és egy csomó egyéb jó dologban. Nézze meg az alábbi linkeket, és győződjön meg róla, hogy tudomásul veszi gondolatait a hozzászólás utáni területen.
Ajánlott olvasás: A tipográfia megértése: Írás az interneten
Betűtípus mátrix
Ezt az online útmutatót a 24 órás tervező blog írta. A szabványos webes betűtípusok mátrix táblázata tartalmazza, amelyeket alapértelmezés szerint a különböző szoftvergyártók találnak. A népszerű címek közé tartoznak a Windows, a Mac OS X, a Microsoft Office és az Adobe Creative Suite programok.
Szín kontraszt ellenőrzése
A szín kontraszt gyakran problémát jelent, ha a szabványos fekete-fehér modellen kívül esik. Ha talál egy meccset, úgy érzi, mintha a design tökéletes lenne. A gyenge színkombináció azonban nagyon rossznak tűnik, és negatívan befolyásolja a tervezést. Ez a kis webes eszköz segíthet kiválasztani egy színkészletet, hogy megfeleljenek a stílus elrendezéséhez.
HTML-Ipsum
Szüksége van egy Lorem Ipsum eszközre, amely többet tehet, mint a kimeneti szöveg? Ez az online HTML-generátor kódblokkokat hoz létre a leggyakoribb oldalelemekhez. Néhány példa: rendezetlen listák, definíciós listák, webes űrlapok, táblázatok és sok más megoldás.
Typechart
A Typechart a CSS fejlesztői egyik kedvenc eszköze. Gyakran keresek egy adott betűtípust a rendszeremhez egy webprojekthez, de nem tudom megcsinálni az egész gyűjteményemet. Ez a félelmetes eszköz lehetővé teszi a betűkészletcsaládok népszerű választásainak szitálását, és akár a megfelelő CSS kód letöltését is!
PX-to-EM.com
Hacsak nem állítja vissza az alapértelmezett böngésző szövegméretét, valószínűleg olyan problémák találhatók, amelyek megfelelnek az ems-nek a pixelekkel. Ez a böngészőalkalmazás egy konverziós táblát és felhasználói felületet biztosít a px-em számára. Ez egy nagyon egyszerű eszköz, de ez egy praktikus útmutatót kínál, amely igazán egyszerű funkcionalitással rendelkezik - és nem tudod megverni az ingyenes árcédulát.
CSS típus beállítása
Nem ajánlom, hogy túl sokáig ragaszkodj a CSS Type Set-hez, mivel ez valóban kezdő eszköz. Lehetővé teszi, hogy CSS kódot hozzon létre a kiválasztott betűtípus tulajdonságok alapján. Miközben először nagyon hasznos, az idő múlva a mankóvá válik. És nem tudod motiválni, hogy magad is elsajátítsd a CSS tulajdonságokat. De ha időt kell takarítanunk egy projektre, ezt az eszközt nem lehet figyelmen kívül hagyni.
tipikus
Itt van egy igazán egyedi példa egy betűtípus előnézeti könyvtárra. A tipikus flipping magában foglal egy maréknyi betűtípust, amelyek az operációs rendszeredhez tartoznak. Automatikusan beolvassa a betűtípus-könyvtárat, hogy felveszi a legtöbb web-biztonságos megoldást. Összehasonlíthatja őket egymás mellett, és könnyedén választhat a kedvenc lehetőségek között. Ez egy másik nagyszerű időmegtakarító, amelyet könyvjelzőként jegyez, és nem gondolja az utolsó pillanatig.
Tipográfiai rács
Rengeteg beszélgetés van a rács tervezése során a HTML-ben és a CSS-ben. Valószínűleg megérti a hálózat működésének fogalmát, és a weboldal mérése pixelben nem különbözik. Ez a CSS-Tricks által készített grid-bemutató inkább egy vezérelt erőfeszítés, hogy bemutassa a digitális korszak tipográfiai alapjait. Ez sokkal fejlettebb téma a web design területén. De ha van némi türelmem, azt javaslom, hogy átnézzük a részleteket, hogy megtudjuk, hogyan befolyásolják ezek a hálózati tulajdonságok az oldal elrendezését.
WhatTheFont!
Mindannyian találtunk egy logót vagy képet, ami igazán jó, azonosíthatatlan betűtípust tartalmaz. Mi az, amit a Font néhány évig az interneten tett, és ez még mindig a kedvencem. Kiválaszthatja a feltölteni kívánt képet, és a szkript elemzi a képen belüli szöveget, hogy megfeleljen a hasonló betűtípusoknak. Az alkalmazás még akkor is összekapcsolja Önt a külső termékekkel, ahol minden fontot megvásárolhat.
Alapvonal / vonalmagasság számológép
Végül egy nagyon hatékony eszköz a vonalmagasság és a ritmus tulajdonságainak létrehozására. Egyszerűen adja meg az alap betűméret és a vonalmagasság értékeit, vagy mellékelje a saját CSS kódját az oldalra. Az alkalmazás néhány különböző stílusban előnézetet készít, így megismerheti, hogy ezek a tulajdonságok hogyan fognak megjelenni a saját webhelyén.