Proč některé značky působí důvěryhodně okamžitě, zatímco jiné vypadají amatérsky, přestože mají dobré produkty? Část odpovědi je v typech obrazových souborů. K zlepšení nepotřebujete designérské vzdělání. Potřebujete jasnou definici a pár praktických kontrol.
K běžným typům obrazových souborů patří JPEG, PNG, WebP, SVG a GIF pro různé způsoby použití. Tato kapitola srozumitelně vysvětluje, co to znamená, proč to ovlivňuje váš web i marketing a jak to uplatnit, aniž byste se ztratili v odborných výrazech. Uvidíte také, jak do stejného obrazu zapadá SEO obrázků. Projděme si to krok za krokem.
Hlavní myšlenky typů obrazových souborů
K běžným typům obrazových souborů patří JPEG, PNG, WebP, SVG a GIF pro různé způsoby použití.
Výběr typu vyvažuje kvalitu, průhlednost a velikost souboru.
Hero obrázky a obrázky na pozadí často používají moderní komprimované formáty.
Jak to uvést do praxe
SVG používejte pro loga a ikony, WebP nebo JPEG pro velké fotky tam, kde je to podporováno.
Podívejte se na optimalizaci obrázků pro web a obrázky na webu a propojte toto téma se zbytkem modulu.
Malá, ale pravidelná vylepšení porazí občasné kompletní redesigny, když se teprve učíte.
Praktický kontrolní seznam na dnešek
SVG používejte pro loga a ikony, WebP nebo JPEG pro velké fotky tam, kde je to podporováno.
Když procházíte jakoukoli stránku, ptejte se, zda jsou typy obrazových souborů vhodně zvolené už při prvním posunu na mobilu. Pokud ne, přeskupte sekce dřív, než začnete ladit detaily.
Uložte si snímky obrazovky před změnami a po nich, abyste poznali, co na vašem webu skutečně pohnulo výsledky u typů obrazových souborů.
Sdílejte tento kontrolní seznam s každým, kdo váš web upravuje, aby SEO obrázků zůstalo jednotné i na nových stránkách.
Vyberte si jedno číslo, které budete tento měsíc sledovat, například čas na stránce nebo zahájená vyplnění formuláře. Změny designu pak svážete s výsledky podnikání, a ne jen s vkusem.
Jak toto téma souvisí s celou vaší značkou
Vizuální rozhodnutí málokdy platí jen pro jednu stránku. Hero obrázky a obrázky na pozadí často používají moderní komprimované formáty.
Vaše příspěvky na sociálních sítích, e-maily i tištěné materiály by měly opakovat stejnou hierarchii, barvy a pravidla písma jako váš web.
Když se vizuální podoba značky rozchází, zákazníci cítí nenápadný nesoulad, i když nedokážou říct proč.
Použijte fotografii s negativním prostorem a porovnejte poznatky s příbuznou kapitolou v tomto modulu.
Výběr typu vyvažuje kvalitu, průhlednost a velikost souboru.
Časté otázky, které lidé přehlížejí
Vedlejší pojmy jako SEO obrázků a hero image vám pomohou najít hlubší příklady a porovnat svou práci s běžnými standardy.
Hero obrázky a obrázky na pozadí často používají moderní komprimované formáty.
Zapište si jednu změnu před a po, kterou tento týden otestujete na živé stránce. Malé změřené úpravy porazí vágní plány.
Když váš tým používá společnou slovní zásobu o typech obrazových souborů, ubude kol úprav s designéry a agenturami.
Nástroje, které usnadní vizuální úpravy
K řadě úprav rozvržení a stylu nepotřebujete vlastní kód. Vizuální editor vám umožní upravit mezery, barvy a písmo a přitom si prohlížet náhled pro mobil i počítač.
WEMASY obsahuje Tvůrce webů s vizuální úpravou, takže změny zveřejníte, aniž byste u každé drobnosti čekali na vývojáře. Až budete chtít využít, co jste se naučili, otevřete Tvůrce webů.
Až změny zveřejníte, znovu si projděte optimalizaci obrázků pro web a obrázky na webu, ať si celý modul drží pohromadě.
Teď máte k typům obrazových souborů funkční optiku. Použijte ji, když kontrolujete web, schvalujete marketingové podklady nebo zadáváte práci designérovi. Pokračujte kapitolami obrázky na webu a fotografie s negativním prostorem, ať v tomto modulu neztratíte tempo.
Učit se typy obrazových souborů je postupná dovednost. Vraťte se k této kapitole poté, co nasadíte jedno vylepšení, aby se poznatky z čtení proměnily ve zvyk. Malé opakované kontroly porazí snahu nacpat si všechna pravidla najednou. Pište si poznámky, co zabralo u vašeho publika, aby další úprava šla rychleji.
Často kladené otázky
Jak dlouho trvá zorientovat se v typech obrazových souborů?
Většina malých firem uvidí jasnější stránky během několika soustředěných sezení, jakmile uplatní základy z této kapitoly. Začněte úvodní stránkou a stejná pravidla pak přeneste na stránky služeb a kontaktů.
Potřebujete designéra pro typy obrazových souborů?
Designér pomůže u složitých rebrandingů, ale řadu úprav kolem typů obrazových souborů zvládnete sami, jakmile víte, na co se dívat. Pro související rady použijte vedle této kapitoly optimalizaci obrázků pro web.
Může vám WEMASY pomoci s obrázky různých typů na vašem webu?
WEMASY obsahuje v Tvůrci webů vizuální editor, takže rozvržení, barvy a písmo upravíte bez kódu. Otevřete Tvůrce webů, upravte šablony a zkontrolujte změny na mobilu.
Jaká je nejčastější chyba u typů obrazových souborů?
Lidé se snaží opravit všechno najednou místo jedné stránky po druhé. Vyberte si jednu prioritu, například čitelnost nebo kontrast, a pak se podívejte na obrázky na webu pro další zlepšení.
Jak souvisejí typy obrazových souborů s SEO?
Jasná vizuální hierarchie a čitelné písmo udrží návštěvníky na stránce déle, což podporuje signály zapojení, které vyhledávače sledují. Nejlepších výsledků dosáhnete, když úpravy designu spojíte s dobrou strukturou obsahu.
Co se učit dál po typech obrazových souborů?
Pokračujte kapitolami optimalizace obrázků pro web a obrázky na webu v této knize, abyste pro svou značku online vybudovali ucelený vizuální systém.