10 skvělých kombinací fontů Google v roce 2020

Seznam módních písem ručně vybraných z písem Google, která se dobře spárují a jak je nainstalovat na svůj web.


Nejlepší kombinace písem Google

Typografie webových stránek bývala mystifikující designovou praxí, než je tomu dnes. Složitý proces zdobení webové stránky pomocí vlastních písem, který kdysi vyžadoval převod a vkládání souborů písem, aby byl hostován na serveru uživatele, a výběr dostupných písem byl omezen na vlastní sbírku uživatele nebo znalost typografie mimo standardní systémová písma. Výsledkem bylo, že většina webových stránek vypadala téměř stejně ve formátování obsahu, který se spoléhal na mnoho nadměrně používaných a světských web bezpečná písma.

To vše se v roce 2010 změnilo vydáním Písma Google, projekt s otevřeným zdrojovým kódem, který umožňuje mnohem snadnější implementaci vlastních písem na webových stránkách. Instalace těchto písem na vlastní web je naštěstí proces, který je rychlý a snadný, ale měli byste si uvědomit, že ne každá kombinace fontů v knihovně Google je receptem na typografický úspěch. Se správným párováním písem a úvahami o použití však může vaše online značka vyzařovat profesionalitu, krásu a přívětivost pro čtenáře bez nutnosti nákladných přizpůsobených písem. V tomto článku vám ukážu, jak toho všeho dosáhnout.

Seznam 10 trendových kombinací písem Google

Pojďme na to! V žádném konkrétním pořadí zde není 10 nejlepších kombinací písem Google, které v současné době trendy:

1. Open Sans Condensed + Open Sans

Trendy Google Google Combination - Open Sans Condensed a Open Sans

Zde je snadná kombinace, která dělá zázraky pro téměř jakékoli použitelné použití. Otevřete Sans je jedním z – pokud ne – nejvšestrannějších písem v celé sbírce písem Google. Je to velmi snadné číst ve velkých blocích textu, ale stále je dost nápadný na titulky.

Jednoduchý. Sofistikovaný. Známé. Nemůžete pokazit!

Skutečné použití

Nemohu předvídat žádný scénář, kde Otevřete Sans by byla špatná volba. Pokud hledáte konkrétně patkové písmo, myslím, že toto bude sloužit většině firem, blogů, vstupní stránky nebo webové aplikace dokonale.

2. Oswald + EB Garamond

Trendy kombinace písem Google - Oswald s EB Garamond

Oswald je skvělé písmo pro titulky bez ohledu na hmotnost písma nebo použití velkých písmen. Jeho kondenzovaná povaha pomáhá upoutat pozornost a pop, ale také vytváří příjemně jedinečný text jako písmo hlavního těla.

EB Garamond je elegantní aktualizace klasického písma Garamond. Toto písmo, které je okamžitě rozpoznatelné a nadčasové, vyzařuje ve vaší typografii výraznou profesionalitu.

Skutečné použití

Toto párování funguje dobře pro profesionály, kteří se zabývají špičkovou klientelou, jako jsou právníci, realitní kanceláře nebo dokonce luxusní butiky. Všestrannost Oswald a klasický vzhled EB Garamond udělejte skvělý text s popisem produktu, kde je důležité zdůraznit položku prémiové kvality.

3. Montserrat + Merriweather

Trendy Google Fonts kombinace - Montserrat s Merriweather

Montserrat je oblíbený mezi designéry pro jeho univerzálnost a jednoduchost, a Merriweather dvojice úžasně s kontrastním stylem a snadnou čitelností. Neváhejte je vyměnit jako nadpisy nebo odstavcové texty – oba fungují skvěle!

Skutečné použití

Tato konkrétní kombinace je příjemnou rovnováhou moderního a klasického designu. Jeho rozmanitost použití by proto mohla podpořit mnoho typů podniků. Osobně mám pocit, že by tato písma byla dobrá pro jakýkoli typ online zpravodajského zdroje nebo vydavatelské agentury.

4. Roboto Thin + Roboto Regular

Trendy kombinace písem Google - Roboto Thin s Roboto Regular

Roboto rodina fontů je osobní oblíbená položka a také ji používáme zde na stránce Jak získat online. Extrémně všestranný s širokou škálou hmotností písma prakticky neexistuje žádné omezení, pro které by bylo možné písmo použít. Moderní a geometrický, ale přesto nějak přátelský a spolehlivý, Roboto je zázrak formy a funkce.

Skutečné použití

Tady je další párování, pro které byste neměli být nuceni najít špatné použití. Zatímco Roboto funguje téměř pro cokoli, myslím, že je obzvláště skvělé pro technologické začínající podniky, moderní malé podniky nebo jakoukoli značku značky s ohledem na budoucnost.

5. Raleway + Roboto Slab

Populární kombinace písem Google - Raleway with Roboto Slab

Je to náš přítel Roboto znovu! Tentokrát se však díváme na variace serifů, Roboto Slab. Je to písmo, které je stejně všestranné jako jeho bratranec, ale je trochu klasičtější. Při spárování s výrazným a odvážným Raleway, máme úžasný zápas čisté a propracované typografie.

Skutečné použití

Raleway je jedním z těch písem, která křičí sofistikovanost. Když se používá jako titulek se všemi čepicemi, myslím, že to funguje skvěle pro luxusní předměty, jako jsou šperky, značkové oděvy nebo podobně upscale produkty elektronického obchodu.. Roboto Slab podporuje to dobře jednoduchým a přístupným popisným textem.

Oba pracují také zaměnitelně. Vyzkoušejte různé varianty hmotnosti pro obě písma v nadpisech i v textu těla a podívejte se, které párování zachytí vaši značku nejlépe.

6. Playfair Display + Source Sans Pro

Trendy kombinace Google Fonts - Playfair Display s Source Sans Pro

Podle jeho návrháře, Playfair Display byl inspirován formami dopisů z 18. století při přechodu z ostnů na pera s ocelovými hroty. Není tedy žádným překvapením, že toto písmo vyzařuje kouzlo starého světa, ale s moderní rotací.

Source Sans Pro posouvá věci o kousek dál do budoucnosti a vytváří zajímavou kombinaci, která je ozdobená a přitom stále utilitární.

Skutečné použití

Playfair Display přidává osobní dojem něčemu, jako je označení nebo popis produktu. Pokud máte možnost použít své symboly ampersandu nebo měny, okamžitě uvidíte, proč je to ideální volba pro produkt nebo službu zaměřenou na luxus a vzhled.. Source Sans Pro udržuje text zakotven v moderní a čisté prezentaci.

7. Fjalla One + Noto Sans

Trendy Google Fonts kombinace - Fjalla One s Noto Sans

Fjalla One nemusí být nejvšestrannější fonty, ale jedna věc, kterou dělá velmi dobře, je vytváření titulků, které vyžadují pozornost. Malá nebo velká, malá nebo velká písmena, tato písmena jsou hypnotická bez ohledu na to, co s nimi uděláte.

Noto Sans si klade za cíl být skutečně univerzálním písmem, kde bez ohledu na jazyk může být zobrazen bez chyb formátování pro uživatele z celého světa. Estetika písma je stejně tak všestranná jako jeho užitečnost.

Skutečné použití

Blogy nebo vstupní stránky by byly skvělé pro toto párování – nebo opravdu cokoli s dlouhými těly textu, které vyžadují rozdělitelný obsah znatelné podnadpisy. Díky univerzální adaptabilitě Noto Sans je to dobrá volba, kde je prioritou oslovit mezinárodní publikum.

8. Alegreya + Lato

Trendy kombinace Google Fonts - Alegreya s Lato

Alegreya má určitou přitažlivost, která mi připadá velmi zemitá a přátelská. O jeho osobnosti není předstírání; to, co vidíte, je to, co dostanete.

Lato mohl dát Otevřete Sans běh za své peníze jako mistr všestranných písem v knihovně Google.

Společně vytvářejí kombinaci, která je zábavná, snadno čitelná a pragmatická.

9. PT Sans úzké + PT Sans

Populární kombinace písem Google - PT Sans úzká s PT Sans

Další moderní styl na starém světě, PT Sans a jeho bratří, PT je úzké, když se spojí, učiní okamžité a nezaměnitelné prohlášení.

Skutečné použití

Každé písmo funguje stejně dobře jako nadpis nebo text těla; konkrétní párování, které vyberete, bude záviset na povaze vašich slov – i když mám sklon dávat přednost PT Sans Narrow v kratších dávkách.

Je navržen jako „velmi důležitý nástroj pro moderní digitální komunikaci“ a zdá se, že je nejvhodnější – i když rozhodně ne omezeně – použít tato písma pro technické spouštění, softwarové aplikace nebo jiné digitální podniky..

10. Amatic SC + Josefin Sans

Trendy Google Fonts kombinace - Amatic SC s Josefin

Dobře, tohle je rozhodně více na světelnou stranu. Je zřejmé, že tato kombinace nebude fungovat pro každého, ale rozmarná povaha obou Amatic SC a Josefin Sans vytvořte něco, co bude určitě vyniknout – pokud budete postupovat opatrně!

Skutečné použití

Pokud jste zábavný umělec, hudebník nebo bavič, pak by toto písmo mohlo být důležité pro zachycení vaší jedinečné osobnosti. V závislosti na zastřešujícím tónu a předmětu by tato kombinace mohla fungovat i pro mezeru na blogu.

Rady: Nepoužívejte Amatic SC jako váš hlavní text. Budete řídit své čtenáře šílené.

Bonus: 5 z našich oblíbených prémiových písem

Víme, že tento článek pojednává o nejlepších, populárních fontech Google, ale chtěli jsme také uvést jako bonus některá z našich oblíbených prémiových písem. Prémiová písma samozřejmě nejsou zdarma – ale poskytují vašemu webu jedinečný a vlastní design. Tato písma nejsou populární ani trendující a jsou ve skutečnosti opakem těch, které jsme uvedli výše. Jsou však skvělé pro ty, kteří chtějí pro svou značku vlastní a přizpůsobený design a dobře se hodí, když jsou použity pro loga nebo dokonce kreativní záhlaví:

Bonus 1: Mega Craft Bundle X

Bonus 2: Valentýnský balíček

Bonus 3: Balíček skvělých písem

Bonus 4: Malý grafický balíček

Bonus 5: Žárlivý

RYCHLÝ TIP: Prémiová písma nabízejí návrhářům šanci dosáhnout nadčasového designu a jsou vysoce doporučována pro loga a identitu značky.

Proč byste měli používat písma Google?

Vítejte v tom, co mnoho webových designérů považuje za svého nejlepšího přítele. Na základě zkušeností vám mohu říci, že jsem do webů již jen zřídka vkládal soubory vlastních písem. Google Fonts je nyní téměř výhradně prvním a posledním místem, na které se obracím s typografií webových stránek. Zde je proč:

  • Své zcela zdarma. Nezáleží na tom, kolik písem si vyberete nebo na jakém počtu webů je používáte. Nikdy nezaplatíš desetník.
  • Jak března 2018, tam jsou přes 850 písem v knihovně. Je pravděpodobné, že najdete ten správný styl, který odpovídá vaší značce.
  • Své rychle. Protože písma jsou hostována na serverech Google, jsou soubory inteligentně komprimovány a navrženy tak, aby se rychle načítaly.
  • Své snadný. Jednoduchá kopie a vložení do souboru HTML a máte hotovo.
  • Své organizovaný. Všechna písma jsou rozdělena do kategorií a lze je prohledávat v rámci jedné databáze. Už nemusíte hledat pomocí chaotických podsložek v počítači, abyste našli dokonalé písmo.
  • Zmínil jsem se o tom volný, uvolnit? Je to zdarma!

Jak nainstalovat písma Google

Nejsou zde žádné bolesti hlavy. Jen jdi na Písma Google a najděte potřebná písma.

Když vyberete svá písma, budou kumulativně přidána do kolekce ve spodní části stránky. Po dokončení vyhledávání klikněte na spodní kartu a objeví se okno s pokyny pro vložení.

Přidání stylů

Odtud si můžete vybrat, zda chcete přidat další styl, jako je kurzíva, tučné písmo, tučné písmo a podobně. Stačí kliknout na ZÁKAZNÍK a vyberte styly, které podle vás budete potřebovat.

Zde je například způsob výběru obou pravidelný a tučně text pro písmo Khula.

Přidání stylu písma do písem Google

Vložení standardu nebo @importu?

Zjistíte, že máte dvě možnosti pro vkládání písem na svůj web: pomocí standardu k použití na vašich stránkách HTML soubor nebo @import url být součástí vašeho webu CSS soubor. Takže který z nich byste měli použít?

Obecně nejlepší volbou je zkopírovat a vložit řádek do vašeho souboru HTML. Vaše písma se budou obvykle načítat rychleji, místo čekání na načtení souboru CSS a tato metoda má také o něco lepší podporu (velmi) starých prohlížečů..

Kam umístit kód

Chystáte se zkopírovat a vložit řádek kódu, který vám Google poskytne část vašeho souboru HTML. Takže s použitím písma Khula, které jsem si vybral výše, bude to vypadat takto:

RYCHLÝ TIP: Styly písem můžete také zadat tak, že je vypíšete do adresy URL oddělené čárkami. Například: „https://fonts.googleapis.com/css?family=Khula:tučné, kurzíva, tučně

Použití písma v seznamu stylů

Nyní jednoduše vyvoláte písmo obvyklým způsobem CSS kód. Pro demonstrační účely by mohl váš hlavní nadpis a text odstavce vypadat takto:

h1 {
rodina fontů: ‘Khula’, sans-serif;
hmotnost písma: 700;
velikost písma: 48 pixelů;
}
p {
rodina fontů: ‘Khula’, sans-serif;
font-weight: 400;
velikost písma: 16px;
}

RYCHLÝ TIP: Nezapomeňte zahrnout záložní písmo, jako je „serif“, „sans-serif“ nebo podobné webové bezpečné písmo, ve vzácné události, kterou se vaše písmo Google nenačte..

Rady ohledně párování vašich písem

Rozhodování o tom, která písma se mají seskupit, může být někdy obtížnou uměleckou rovnováhou. Na jedné straně bude váš výběr písma nejúčinnější, když bude ve stylech dostatek kontrastu; každé písmo na vašem webu musí vyniknout od ostatních a musí si ospravedlnit jeho použití. Na druhou stranu nechcete, aby se vaše písma stylovaly příliš daleko od sebe, což by mohlo vyvolat dojem, že byly vybrány náhodně.

RYCHLÝ TIP: Přemýšlejte o tom, co emoce nebo nápad vyvolá konkrétní písmo. Zkuste ji spárovat s jiným písmem, které evokuje stejnou emoce nebo nápad. Je to všechno o nalezení správných písem, která mluví s vaší jedinečnou značkou. Zjistíte to neodmyslitelně, když se písmo cítí jako vaše značka nebo zda vydává smíšené signály.

Serif a Sans-Serif

Osvědčenou metodou je spárovat patkové písmo s bezpatkovým. Jejich styly mají tendenci dobře spolu kontrastovat a nabízejí snadné rozlišení mezi titulky a odstavci.

Experimentování je klíčové

Když volím písma pro nový web, ráda si stáhnu všechny možné možnosti písma Google do svého počítače a zahraju si s nimi v dokumentu pro zpracování textu. Fidgeting s různými velikostmi a váhami a porovnání kombinací bok po boku je efektivní způsob, jak určit nejlepší možné párování. Když si uděláte čas na experiment, můžete to dokonce zjistit pomocí a tenký variace daného písma umožňuje lepší text nadpisu, než kdybyste použili úplně samostatné písmo. (Nejjednodušší řešení je často nejlepší.)

Závěr

Google Fonts je výkonný zdroj pro kutily, kteří na svém webu nechtějí platit za drahá vlastní písma. Ale s velkou mocí přichází velká zodpovědnost: typografie vyžaduje pečlivé zamyšlení, aby se to udělalo dobře, a ne každé písmo tam je vítěz. Doufáme, že vás tento průvodce pomůže nasměrovat správným směrem a inspiruje vás k nalezení dokonalého párování písem, které zachytí osobnost vaší značky..

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me