S WordPress můžete do svých blogových příspěvků a na své stránky snadno vkládat obrázky. Aby však tyto obrázky vypadaly dobře, měli byste zvolit správnou velikost obrázku. Právě o to dnes v našem článku jde: velikosti obrázků ve WordPress.

Je důležité vědět, jak fungují velikosti obrázků na WordPress webu a jak můžete na své webové stránky přidat vlastní velikosti obrázků. Pak můžete použít nejvhodnější typ souboru obrázku ve správné velikosti a na ideálním místě. 

Správná velikost nejenže zajistí ucelenější vzhled vašich webových stránek, ale i sdílení příspěvků na blogu. V tomto článku se dozvíte, jak používat správné velikosti obrázků pro WordPress web.

Budeme se zabývat následujícími tématy: 

• Jak WordPress spravuje nahrané obrázky
• Jak měnit velikost a upravovat obrázky ve WordPress
• Ideální velikosti obrázků pro WordPress
• Osvědčené postupy pro optimalizaci obrázků na WordPress
• Jak přidat vlastní velikosti obrázků ve WordPress
• Závěr k velikosti obrázků WordPress a obecným osvědčeným postupům

Jak WordPress spravuje nahrané obrázky

Jak již bylo zmíněno, velikost obrázku je pro WordPress důležitá. Pokud zvolíte špatnou velikost, budou totiž vypadat rozmazaně. A co hůř, pokud jsou obrázky příliš velké, mohou zpomalit vaše webové stránky.

Nesprávná velikost obrázků může také narušit rozvržení stránky nebo příspěvku na blogu a způsobit zbytečné posouvání do stran. Dobrou zprávou je, že WordPress disponuje nastavením, díky němuž můžete těmto problémům předejít. 

Velikosti obrázků ve WordPress

• Velikost miniatury: 150 x 150 pixelů
• Střední velikost: 300 x 300 pixelů 
• Největší velikost: 1024 x 1024 pixelů
• Plná velikost: odpovídá původní velikosti nahraného obrázku ve výchozím nastavení.

Jakmile obrázek nahrajete do WordPress, vytvoří se automaticky tyto čtyři různé velikosti obrázků. 

Důvod, proč WordPress vytváří takovéto velikosti obrázků, je dvojí. Za prvé nemusíte ručně měnit jejich velikost. Za druhé zajišťuje, aby pro různá místa na webu byla vybrána správná velikost obrázku. 

WordPress například zobrazuje miniatury v seznamu blogových příspěvků v postranním panelu nebo widgetu zápatí. Obrázek, který se má zobrazit v záhlaví nebo v samotném příspěvku, však musí být větší. Proto WordPress vybírá jednu z větších velikostí, aby byl obraz dobře viditelný. 

Pokud tedy chcete použít stejný obrázek na různých místech svého webu, nemusíte ztrácet čas ruční úpravou jeho velikosti ani si pamatovat, jaká velikost je zapotřebí. Stačí nahrát obrázek – WordPress se postará o zbytek.

Jak měnit velikost a upravovat obrázky ve WordPress

S WordPress můžete snadno měnit velikost standardních obrázků. Stačí jen několik kliknutí a velikost obrázků je optimalizována během okamžiku. 

Chcete-li změnit výchozí velikosti obrázků, přejděte do  Nastavení > Média. Jak vidíte na našem obrázku, jsou zde uvedeny všechny výchozí velikosti. Můžete je snadno upravit zadáním požadovaných rozměrů.

Po úpravě standardních velikostí obrázků WordPress na požadované rozměry klikněte na tlačítko Uložit změny. V budoucnu budou všechny obrázky, které nahrajete na své webové stránky, přizpůsobeny novým rozměrům. 

Kdy je třeba změnit standardní velikosti obrázků ve WordPress

V některých chvílích může být nezbytné optimalizovat obrázky pro WordPress. Pokud jste si například koupili WordPress šablonu, která používá vlastní velikosti obrázků, a vy se chcete ujistit, že WordPress bude měnit velikost nahraných obrázků na požadované rozměry. 

Dalším příkladem jsou kreativci, kteří potřebují k prezentaci své práce konkrétní velikost obrázků. Optimalizace obrázků může být nutná také v případě, že máte e-shop a potřebujete mít u produktů konkrétní velikosti obrázků.

Osvědčené postupy pro optimalizaci obrázků na WordPress

Kromě správných velikostí obrázků existuje několik dalších osvědčených postupů pro WordPress optimalizaci. 

Optimalizovat velikost souborů obrázků

Obrázky jsou často jednou z hlavních příčin pomalého načítání. Pokud jsou vaše obrazové soubory příliš velké, bude muset publikum dlouho čekat, než je prohlížeč stáhne a zobrazí. 

Než tedy nahrajete fotografie na své webové stránky, měli byste zmenšit velikost jejich souborů. Obecně platí, že u obrázků byste se měli snažit o velikost souboru do 150 KB. Velikost souboru můžete snížit uložením obrázku v nižší kvalitě. 

U velkých fotografií, jako jsou například tapety, je třeba najít správnou rovnováhu mezi velikostí souboru a kvalitou. Jinými slovy, chcete zmenšit velikost souboru, ale zabránit tomu, aby byl obrázek rozpixelovaný.

TinyJPG je online nástroj pro kompresi obrázků, který umožňuje výrazně zmenšit velikost obrázků – až o 70 procent – bez snížení kvality. 

Zdarma můžete najednou komprimovat až 20 obrázků o velikosti do 5 MB. Můžete se také přihlásit do tarifu Pro, který TInyJPG nabízí. Začíná na 25 dolarech ročně za uživatele. Tarif Pro umožňuje komprimovat více než 20 obrázků najednou a ruší omezení velikosti 5 MB pro WordPress obrázky.  

TinyJPG je skvělé řešení pro obrázky, které chcete nahrát na své webové stránky. Ale co s obrázky, které již na webu máte? Tady je možné využít např. plugin ShortPixel. 

Tento plugin vám pomůže komprimovat obrázky, které jste již na svůj web nahráli. Zpracovává a komprimuje také všechny budoucí nahrané obrázky. Snižuje velikost souboru až o 75 procent bez ztráty kvality. 

Kromě toho můžete s pluginem převést i všechny formáty obrázků JPG, PNG a GIF do formátů WebP a AVIF, které byly výslovně vyvinuty pro bezeztrátovou kompresi obrázků na webu a v knihovně médií.

ShortPixel je zdarma až pro 100 obrázků měsíčně. Další obrázkové „kredity" si můžete zakoupit za cenu od 4,99 $ za 7.000 obrázkových kreditů.

Použít správný typ obrázku

S WordPress můžete nahrávat obrázky v různých formátech. Ty se obvykle ukládají jako JPG, PNG nebo GIF. Každý z těchto formátů má však své výhody a nevýhody. 

Zde je přehled různých typů obrázků:

• JPG (JPEG) je zkratka pro Joint Photographic Experts Group. Tento typ souboru podporuje 16 milionů barev a obvykle má nejmenší velikost souboru pro fotografie. Tento typ souboru se skvěle hodí pro obrázky na pozadí, produktové fotografie, hlavní obrázky a obecně pro všechny obrázky či fotky, které chcete použít na svém webu. 
• PNG je zkratka pro Portable Network Graphic. Tento formát obrázku podporuje méně barev než JPG. Můžete však ukládat obrázky s průhledným pozadím. Je vhodnou volbou pro obrázky loga, vzory na pozadí, dekorativní grafiku webových stránek, ikony sociálních médií a podobně. Obrázky uložené ve formátu PNG mohou být větší, pokud obsahují velké množství detailů. 
• GIF je zkratka pro Graphics Interchange Format a podporuje 256 barev a průhlednost. GIFy mohou být také animované. Soubory GIF mohou být malé, ale pokud obsahují složité animace, mohou být i větší. 

Dát si pozor na rozlišení obrazu

Dalším aspektem, který byste měli při optimalizaci obrázků pro web zvážit, je jeho rozlišení. Rozlišení obrázku se měří v „počtu bodů na palec" (DPI, dots per inch) a určuje kvalitu obrazu. Čím vyšší je hodnota DPI, tím vyšší je rozlišení obrazu. 

Pro webové účely by mělo být rozlišení obrázku nastaveno na 72 DPI, protože je to výchozí hodnota. Vyšší rozlišení má za následek přílišnou velikost a přispívá k pomalému načítání webu.

Přidání vlastních velikostí obrázků WordPress

Vlastní velikosti obrázků můžete přidat úpravou souboru functions.php. Řekněme, že chcete přidat vlastní velikost pro hlavní obrázek. 

Chcete-li je přidat do své šablony, stačí provést následující kroky:

V Dashboardu WordPress přejděte do části Vzhled > Editor. Otevřete soubor functions.php a vyhledejte následující řádek kódu:

add_theme_support( 'náhledy příspěvků');

Pokud ho tam nenajdete, přidejte tento řádek a klikněte na tlačítko Aktualizovat soubor. Pak do souboru functions.php přidejte následující řádek: 

add_image_size( 'Blog Featured Image', 1280, 630 );

Výše uvedený řádek přidá do motivu vlastní velikost a zadá šířku a výšku nové velikosti obrázku. Aktualizujte soubor a uložte změny. 

Poté je třeba aktualizovat kód ve své šabloně, aby zobrazoval novou vlastní velikost obrázku, kterou můžete při nahrávání vybrat. Tentokrát otevřete soubor index.php a vložte následující řádek kódu: 

the_post_thumbnail( 'blog featured image' ); 

Poté soubor aktualizujte a uložte změny. Nezapomeňte, že pokud vše uděláte ručně, bude vaše vlastní velikost obrázku přepsána při každé aktualizaci šablony. 

Proto doporučujeme použít podřízené šablony (child theme) nebo přidat vlastní velikosti obrázků pomocí pluginu Image Regenerate & Select Crop. S tímto pluginem můžete snadno zaregistrovat nové vlastní velikosti obrázků a generovat miniatury dle nových velikostí obrázků. 

Závěr: WordPress velikosti obrázků a obecné osvědčené postupy

Obrázky vám pomohou vyprávět příběh, usnadní čtenářům vytvořit si vztah k vašim příspěvkům a zaujmout je. 

Proto je důležité, abyste pro své webové stránky zvolili správnou velikost. Tipy v tomto článku vám pomohou nastavit správnou velikost obrázků a přidat vlastní velikosti obrázků na ve WordPress. 

Aby se vaše snaha o optimalizaci velikosti obrázku na webu WordPress vyplatila, měli byste své webové stránky zabezpečit spolehlivým hostingem. Nemá smysl zrychlovat web, je-li spjat s horším webhostingem. 

Vyzkoušejte WordPress hosting s Raidboxes a dejte svým webovým stránkám rychlé časy načítání, které si vaše cílové publikum zaslouží. Můžete nás kontaktovat, pokud se chcete dozvědět více o výhodách spravovaného WordPress hostingu .