Wordpress

A 15 legjobb Google-betűtípus szám szerint 2021-ben (plusz tippek a használatukhoz)

1052 különböző Google-betűtípus-család áll rendelkezésre ingyenesen (a cikk írásakor). Ez rengeteg választási lehetőség! Így nem csoda, ha segítségre van szüksége, hogy megtalálja a tűt a szénakazalban a legjobb Google betűtípusok listájával.

Elkészítettük az Ön számára, majd megosztunk néhány bevált módszert a Google Fonts WordPressben való használatához.

A betűtípus kiválasztása több, mint pusztán esztétikai választás – jelentős hatással lehet webhelye visszafordulási arányára és konverziós arányára, különösen, ha nehezen olvasható betűtípust választ. Ezért érdemes szánni egy kis időt a tökéletes Google Fonts család kiválasztására a webhelyéhez, ahelyett, hogy az első betűtípust használná, amellyel találkozik.

Ha még több betűtípusra van szüksége, tekintse meg a WordPress webhelyén használható több mint 50 modern betűtípusról szóló bejegyzésünket.

Miért érdemes a Google Fonts-ot használni?

Több ezer betűkészlet-tár található az interneten, szóval mitől is olyan különleges a Google Fonts?

Google Fonts katalógus.
Google Fonts katalógus.

Először is ingyenes! Ráadásul a Google Fontokat a Google karbantartja és szállítja, ami azt jelenti, hogy garantáltan biztonságosak. Természetesen rengeteg furfangos webhely van, ahonnan ingyenes betűtípusokat tölthet le, de ki tudja, mit talál még ezekkel a fájlokkal?

Az ilyen webhelyeken található betűtípusok minősége néha megkérdőjelezhető.

A Google több mint ezer kiváló minőségű betűtípust válogatott össze. Ha nem egy grafikus, aki tökéletesen járatos a tipográfiában, ez egy biztonságosabb választás.

Másodszor, nincsenek bonyolult engedélyezési korlátozások. A Google Fonts katalógusban található összes betűtípus nyílt forráskódú, és ingyenesen használható kereskedelmi projektekben. Letöltheti vagy beágyazhatja őket webhelyére, és akár nyomtatási projektekben is felhasználhatja őket.

Bár nincs egységes licenc, a legtöbb betűtípus az adattárban az Open Font License-t használja.

Nyissa meg a font licencet.
Nyissa meg a font licencet.

Más „ingyenes betűtípusok” ritkán ingyenesek, és zavarba ejtő engedélyezési korlátozások egész sorával érkeznek, amelyek forró vízbe sodorhatják, ha hibázik. Sajnos a Google Fonts nem ugyanazzal a csomaggal érkezik.

És végül, a Google Fonts API segítségével könnyű hozzáadni a Google Fonts-ot webhelyéhez. Alternatív megoldásként letöltheti őket egyenként, és FTP/SFTP-n keresztül feltöltheti webszerverére.

Míg a Google Fonts általában egyszerű, és talán nem is olyan feltűnő, mint egyes fizetős betűtípusok, minden bizonnyal felülmúlja a webbiztonságos betűtípusokat, amelyek előre telepítve vannak a nagyobb operációs rendszerekkel, ugyanazokkal a betűtípusokkal, amelyeket már mindenki ezerszer látott.

1052 különböző Google-betűtípus-család áll rendelkezésre ingyenesen… már túlterheltnek érzi magát? 🤯 Szűkítsd le választásaidat ebből a bejegyzésből 👇Kattintson Tweet

Mit kell keresni a Google betűtípusban

Ha van egy dolog, amit meg kell tanulnod egy webhely tervezése során, az az, hogyan válassz a projektedhez megfelelő Google betűtípust. A jó tipográfia tönkreteszi vagy tönkreteszi a webhelyet.

Ez jelentéktelen részletnek tűnhet, de ez lehet a különbség aközött, hogy valaki korán elhagyja webhelyét, vagy kitart aközött, hogy hűséges olvasóvá vagy vásárlóvá váljon.

A megfelelő betűtípus kiválasztásával a grafikusok éveket töltenek azzal, hogy elsajátítsák, de néhány alapelvet szem előtt tartva gyönyörű betűtípust választhat webhelyéhez.

  • Az Ön márkájához illik: Ez lehet a legkritikusabb szempont. A legjobb webhelyek olyan betűtípussal rendelkeznek, amely megmutatja személyiségüket, miközben továbbra is olvasható, és illeszkedik a jelenlegi megjelenéshez. Például az Apple és az Iron Maiden nagyon különböző betűtípusokat használ, de mindkettő megfelel a márkájuknak.
  • Olvashatóság: A második legfontosabb alapelv az olvashatóság. Egy bolondos fantasy vagy szutykos betűtípus minden bizonnyal passzolhat a márkához, de ha a látogatói nem tudják elolvasni, akkor gyorsan távoznak. Ezért a betűtípusoknak professzionálisnak és olvashatónak kell lenniük.
  • Betűtípus besorolás: Noha egy betűtípus besorolásának több száz módja van, ez az öt fő típus: serif, sans-serif, script, monospace és dekoratív. A szkript vagy serif betűtípus eleganciát közvetít, míg a monospace betűtípusok népszerűek a műszaki oldalakon. Ezen besorolások ismerete jobb kiindulópontot ad a kereséshez.
  • Kijelző vagy törzs betűtípus: A megjelenítési betűtípusok nagy méretekhez, fejlécekhez vagy nyomtatási projektekhez valók. Az egyedi tervezés érdekében megengedhetik maguknak, hogy kevésbé olvashatók legyenek. A törzsbetűtípusok elsődleges irányelve az olvashatóság, mivel ezek teszik ki a webhely nagy részét.
  • Hangulat és szándék: Csakúgy, mint minden művészi alkotás, a művészek is egyedi hangulatokhoz és beállításokhoz terveznek betűtípusokat. A legtöbb betűtípushoz megjegyzések tartoznak a tervezésükre és a használatukra. Használja őket annak eldöntésére, hogy a betűtípus megfelel-e a projektnek.

A 10 legjobb Google-betűtípus 2021-ben (a tömegek bölcsessége szerint)

Szóval, hogyan lehet összeállítani a legjobb Google-betűtípusok listáját, ha ezekből annyi szubjektív? Nem akarjuk, hogy ez a teljes lista elfogult legyen, ezért az adatok alapján összeállítjuk a legnépszerűbb Google betűtípusok listáját.

A Google Fonts elemzését használjuk, hogy megbízzunk a tömegek bölcsességében. A több mint 50 trillió betűtípus-megtekintéssel a Google-nak csak egy kevés adata van, amelyből gyűjthet.

Ezután egy kicsit túllépünk a nyers népszerűségi számokon, és kiválasztunk néhány feltörekvő HTML-betűtípust, amelyek egyre népszerűbbek.

Kész? Merüljünk be!

1. Roboto

Roboto.
Roboto.

A régóta futó #1 hely és BehmasterA Roboto a választott betűtípus, Christian Robertson szans-serif ajánlata, amelyet a Google az Android rendszer betűtípusaként fejlesztett ki. Mára rendkívül népszerű, 12 különböző stílusban kapható, és többször is megjelenik a Google Fonts elemzésében.

Például a Roboto a legnépszerűbb betűtípus. De a Roboto Condensed a hatodik legnépszerűbb betűtípus is, és a Roboto Slab is a 12. helyen szerepel!

2. Nyitott nélkül

Nyissa meg nélküle.
Nyissa meg nélküle.

Az Open Sans Condensed a Google által megrendelt, jól olvasható betűtípus, amelyet elődje, a Droid Sans ihletett. A Google az Open Sans-t használja egyes webhelyein, valamint nyomtatott és internetes hirdetéseiben. Az Open Sans Condensed, az itteni testvérbetűtípus, szintén a tizenharmadik legnépszerűbb helyet foglalja el a Google Fonts-ban.

3. Lato

Lato.
Lato.

A Lato egy másik népszerű választás Łukasz Dziedzictől. A dizájn mögött egészen a történet húzódik meg, egyensúlyba hozva az egymásnak ellentmondó célokat, így egyedi, könnyű sans-serif betűtípust kap.

4. Montserrat

Monstserrat.
Monstserrat.

A Montserrat egy sans-serif betűtípus Julieta Ulanovskytól, aki Buenos Aires névadó Montserrat negyedében él. A könnyűtől a nehézig terjedő 18 különböző stílusban elég sok a választék.

5. Oswald

Oswald.
Oswald.

Az Oswald egy sans-serif betűtípus, amelyet eredetileg Vernon Adams fejlesztett ki. Úgy tervezték, hogy szem előtt tartva a különálló alternatív gótikus stílust, amelyet merész vonásai tesznek nyilvánvalóvá.

6. Forrás Pro nélkül

Forrás Sans Pro.
Forrás Sans Pro.

A Source Sans Pro egy sans-serif betűtípus, amelyet az Adobe számára hoztak létre, és az Adobe első nyílt forráskódú fontja. Paul Hunt készítette, világos betűinek köszönhetően tiszta és olvasható.

7. Slabo 27px/13px

Slabo.
Slabo.

A Slabo egy serif betűtípus, amelyet John Hudson, a Tiro Typeworks-től fejlesztett ki. Ezt a betűtípust kifejezetten bizonyos méretekhez tervezték – 27 képpont vagy 13 képpont, az Ön igényeitől függően.

8. Raleway

Raleway
Raleway

A 18 különböző stílussal rendelkező Raleway egy másik nagycsaládos sans-serif betűtípus, amelyet eredetileg Matt McInerney készített. Ha szereti a Raleway-t, és valami egyedit keres, a Raleway Dots hasonló stílust kínál, pontozott megközelítéssel, amely alkalmas nagy címlapokra.

9. PT nélkül

PT nélkül.
PT nélkül.

A PT Sans-t az Orosz Föderáció nyilvános típusaihoz fejlesztették ki, és mint ilyen, latin és cirill karaktereket is tartalmaz. Számos más betűtípus is található a PT családban, beleértve néhány serif opciót.

10. Merriweather

Merriweather.
Merriweather.

Merriweather neve egy kellemes dizájn gondolatát ébreszti, és a tervezők pontosan ezt akarták. Bár nem annyira népszerű, a Merriweather Sans egy testvérprojekt, amely kivételesen jól párosul vele.

Bónusz betűtípusok + feltörekvők

A számok alapján a fenti tíz betűtípus a legnépszerűbb Google Fonts. De ha csak a legnépszerűbb opciókat jelenítjük meg, az rossz szolgálatot tesz a feltörekvő betűtípusok számára, amelyek nem kapták meg az expozíciót, hogy megjelenjenek az elemzésben.

Íme néhány kedvencünk, amelyek nem tűntek fel az elemzések élén.

11. Noto Sans / Serif

Noto Sans / Serif.
Noto Sans / Serif.

A Noto a Google által megrendelt betűtípus, amely serif és sans-serif változatban is elérhető. Rendszeres frissítéseket kap, és jelenleg jóval több mint 100 Noto-betűtípus érhető el, és folyamatosan újabbak érkeznek!

A Noto célja, hogy lefedje a különböző nyelvek összes ábécéjét és karakterét, miközben egyedi kialakítása harmonikusan illeszkedik több száz különböző betűtípuscsaládhoz. Ezek a származékok közé tartozik a népszerű Noto Sans KR és Noto Sans JP.

12. Nunito Sans

Nunito Sans.
Nunito Sans.

A Nunito Sans egy sans-serif opció, amely gyorsan növekvő népszerűségnek örvend. Használata 2018 és 2019 között megháromszorozódott, és évről évre egyre népszerűbb.

13. Első koncert

Első koncert.
Első koncert.

A Concert One egy lekerekített groteszk betűtípus, amely kiváló választási lehetőséget kínál a címsorokhoz. Nem szokványos kialakítása biztosan vonzza a szemet.

14. Felszólítás

Gyors.
Gyors.

A Prompt a Cadson Demak thaiföldi kommunikációs tervezőcég sans-serif ajánlata. Hurok nélküli (a sans-serif thai megfelelője), és thai és latin karaktereket is tartalmaz.

15. Work Sans

Work Sans.
Work Sans.

A Work Sans egy képernyőkön való használatra optimalizált sans-serif betűtípus. A tervezők a közepes súlyú stílusok használatát javasolják 14 képpont és 48 képpont között.

Villámgyors, megbízható és teljesen biztonságos tárhelyre van szüksége WordPress webhelyéhez? Behmaster mindezt biztosítja, és a hét minden napján, 24 órában világszínvonalú támogatást nyújt a WordPress szakértőitől. Tekintse meg terveinket

A legjobb Google betűtípus-kombinációk létrehozása

Ha úgy gondolta, hogy nehéz volt kiválasztani egy betűtípust a Google Fonts szolgáltatásból, várja meg, amíg megkísérli párosítani őket a webhelyén! Szerencsére ez nem olyan probléma, amelyet meg kell oldania (hacsak nem akarja). A legjobb Google Fonts-kombinációkat többféleképpen is kitalálhatja.

Először is, maga a Google Fonts webhely népszerű párosításokat javasol, ha lefelé görget az oldalon:

A népszerű Google Fonts párosítások felfedezése.
A népszerű Google Fonts párosítások felfedezése.

Ezen túlmenően egy olyan webhelyet is használhat, mint a Font Pair, hogy további javaslatokat kapjon.

A Google Fonts használatának bevált gyakorlatai a WordPress rendszeren

Ha megtalálta a tökéletes betűtípust projektjéhez, íme néhány bevált módszer a Google Fonts használatához a WordPress rendszeren.

Korlátozza a használt betűsúlyok számát

Néhány ilyen betűtípus – például a Montserrat és a Raleway – 18 különböző betűsúllyal rendelkezik. Bár ez jó választási lehetőségeket kínál, ne szeretné mind a 18 súlyt betölteni a WordPress webhelyére, mert ez lelassítja a betöltési időt.

Ennek az irányelvnek a betartása nagyon fontos!

A legtöbb betűtípus esetében egy jó ökölszabály, hogy legfeljebb három súlyozást használjon:

  • Szabályos
  • kurzív

Sok manapság látható WordPress webhely még a dőlt betűt is kihagyja, és csak két különböző betűsúllyal megy.

Ha saját maga ágyazza be a Google Fonts-t, akkor pontosan kiválaszthatja, hogy mely súlyokat használja. Először látogasson el egy betűtípus-oldalra, majd kattintson Válassza ezt a stílust a kívántak mellé.

Betűtípus kiválasztása a Google Fontsban.
Betűtípus kiválasztása a Google Fontsban.

A legtöbb WordPress téma manapság egyszerű módokat tartalmaz a használni kívánt Google-betűtípusok és súlyok kiválasztására. De nem minden témafejlesztő összpontosít a teljesítményre. Ezért bizonyos esetekben jobb, ha letiltja a Google Fonts funkciót a témában, és saját maga adja hozzá őket.

A változó betűtípusok is kezdenek népszerűvé válni, és minden modern böngésző támogatja őket. Ezek nagyszerűek, mert lehetővé teszi egy betűtípus-fájl különböző tulajdonságokkal történő átalakítását. A Google Fonts rengeteg változó betűtípus közül választhat, és a keresést le is szűkítheti ezekre.

"Beállítás

Fontolja meg a Google Fonts helyi tárolását

A betűkészletek Google szerveréről való kiszolgálásának alternatívájaként helyileg is tárolhat betűtípusokat, ami teljesítményelőnyöket kínál. Ne feledje azonban, hogy a legtöbb Google-betűtípus valószínűleg már gyorsítótárban van az emberek böngészőjében. Ezért javasoljuk a teljesítménytesztek elvégzését.

Ha a Google-betűtípusoktól eltérő prémium betűtípust használ, például az általunk használt „Brandon” betűtípust Behmaster helyben való tárolása (és a CDN-ről való kiszolgálásuk) a legjobb út. Ha többet szeretne megtudni erről a témáról, tekintse meg bejegyzéseinket a betűtípusok helyi tárolásáról.

Válasszon egy betűtípust, amely frissítéseket kap

A betűtípusok olyanok, mint a WordPress bővítményei és témái – idővel frissítéseket és fejlesztéseket kapnak, hogy még jobbá tegyék őket. És bár a tét közel sem olyan vészes, mint a WordPress bővítményeké, még mindig hasznos lehet olyan betűtípust választani, amely rendszeres frissítéseket kap. Például a Google Noto családja 2014 óta rendszeres frissítéseket kap.

Mivel a listán szereplő betűtípusok többsége népszerű, valószínűleg jó fogadás, hogy a listán szereplő bármely betűtípus rendszeres frissítéseket és fejlesztéseket kap. És ha úgy dönt, hogy lekerül a listáról, soha nem rossz ötlet annak biztosítása, hogy melyik betűtípust választja elég népszerű ahhoz, hogy felhívja magára a figyelmet.

Ne feledkezzen meg a kisegítő lehetőségekről

Az Egészségügyi Világszervezet szerint a 2015-ben összegyűjtött adatok szerint becslések szerint 253 millió ember él látássérüléssel: 36 millióan vakok, 217 millióan pedig közepesen súlyos vagy súlyos látássérültek. Emellett 2.2-re 2021 milliárdra emelkedett a valamilyen fogyatékossággal élők száma.

A Google Fonts használatakor szabályozhatja, hogyan nézzen ki a CSS segítségével, például a színt és a méretet. Ezért ne felejtse el betartani a Web Content Accessibility Guidelines (WCAG) 2.0-s verzióját. Ez biztosítja, hogy tartalma mindenki számára könnyen elérhető legyen.

Ezen irányelvek követése a fogyatékkal élők szélesebb köre számára teszi elérhetővé a tartalmat, beleértve a vakokat és gyengénlátókat, süketséget és halláscsökkenést, tanulási zavarokat, kognitív korlátokat, mozgáskorlátozottakat, beszédfogyatékosságot, fényérzékenységet és ezek kombinációit. – A webtartalom akadálymentesítési irányelvei (WCAG) 2.0

Az egyik kritikus irányelv a színkontraszt. A betűtípusunk kissé túl világos volt a régebbi dizájnhoz képest Behmaster webhelyet, és a látogatók hangot adtak aggodalmuknak, mivel ez megnehezítette az olvasást. Az utolsó dolog, amit tenni akar, az az, hogy csodálatos tartalmat tegyen közzé, hogy az megterhelje az emberek szemét!

Használhat olyan eszközt, mint például a WebAIM Color Contrast Checker, hogy ellenőrizze, hogy a betűtípusok színei megfelelnek-e a hivatalos ajánlásoknak. Láthatja például, hogy a blogbejegyzéseink színei most átmentek a teszten. 👍

Színkontraszt-ellenőrző eszköz.
Színkontraszt-ellenőrző eszköz. 

Google Fonts hozzáadása a WordPresshez

Egy-két betűtípus kiválasztása után az utolsó lépés az, hogy hozzáadja a webhelyéhez. A Google Fonts-nak köszönhetően ez a feladat a szokásosnál is egyszerűbb.

Tegyük fel, hogy szeretne egy betűtípust bevinni a webhelyére. Ebben az esetben három lehetőség közül választhat: telepíthet egy beépülő modult, például az Easy Google Fonts vagy a Google Fonts Typography alkalmazást, a Google Fonts API használatával feltöltheti a betűtípust webhelyére, vagy manuálisan letöltheti és tárolhatja a webhelyén.

Ha tudnia kell, hogyan változtassa meg betűtípusait a WordPressben, összeállítottunk egy részletes útmutatót, amely segít Önnek.

A betűtípus kiválasztása több, mint pusztán esztétikai választás – jelentős hatással lehet webhelye visszafordulási arányára és konverziós arányára 😲 Kezdje el itt ⬇️Kattintson Tweet

Összegzés

A Google Fonts fantasztikus, és több millió webhely használja. A szilárd tipográfiai és ikonográfiai elvek révén kellemesebbé, nyitottabbá, gyorsabbá és elérhetőbbé teszik az internetet.

A jobb általános élmény biztosítása érdekében javasoljuk, hogy kövesse a bevált betűtípus-gyakorlatokat, például korlátozza a betűtípusok súlyát, helyileg tárolja a betűtípusokat (ha szükséges), és tartsa be a kisegítő lehetőségekre vonatkozó irányelveket.

Most rád hárul – melyek a kedvenc betűtípusai és betűpárjai a Google Fonts szolgáltatásból? Tudassa velünk lent a megjegyzésekben, és ne felejtse el elolvasni a WordPress betűtípusokról szóló részletes útmutatónkat!

Kapcsolódó cikkek

0 Hozzászólások
Inline visszajelzések
Az összes hozzászólás megtekintése
Vissza a lap tetejére gombra