{"id":7188,"date":"2023-12-14T05:26:45","date_gmt":"2023-12-14T05:26:45","guid":{"rendered":"https:\/\/musilda.cz\/?p=7188"},"modified":"2023-12-14T05:26:45","modified_gmt":"2023-12-14T05:26:45","slug":"optimalizace-wordpress-obrazku-pomoci-pluginu-imagify","status":"publish","type":"post","link":"https:\/\/affinite.io\/cs\/optimalizace-wordpress-obrazku-pomoci-pluginu-imagify\/","title":{"rendered":"Optimalizace WordPress obr\u00e1zk\u016f pomoc\u00ed pluginu Imagify"},"content":{"rendered":"\n
Optimalizace obr\u00e1zk\u016f je d\u016fle\u017eit\u00e1 nejen z pohledu rychlosti webu, ale i celkov\u00e9ho SEO. Obr\u00e1zky, kter\u00e9 jsou na webu v nevhodn\u00e9m form\u00e1tu, nebo zbyte\u010dn\u011b velik\u00e9m rozli\u0161en\u00ed v\u00fdrazn\u011b zat\u011b\u017euj\u00ed webov\u00e9 str\u00e1nky, kter\u00e9 se z toho d\u016fvodu dlouze na\u010d\u00edtaj\u00ed a odrazuj\u00ed tak potencion\u00e1ln\u00ed n\u00e1v\u0161t\u011bvn\u00edky. <\/p>\n\n\n\n
M\u00edra okam\u017eit\u00e9ho opu\u0161t\u011bn\u00ed webu se zna\u010d\u00ed pomoc\u00ed „bounce rate“ a ovliv\u0148uje hned n\u011bkolik aspekt\u016f. Optim\u00e1ln\u00ed rychlost webu(Speed index) by m\u011bla spr\u00e1vn\u011b dos\u00e1hnout maxim\u00e1ln\u011b 3 vte\u0159in(kompletn\u00ed na\u010dten\u00ed).<\/p>\n\n\n\n Jak je na tom V\u00e1\u0161 web si m\u016f\u017eete vyzkou\u0161et nap\u0159\u00edklad pomoc\u00ed Google n\u00e1stroje pro m\u011b\u0159en\u00ed rychlosti PageSpeed Insight<\/a>. <\/p>\n\n\n\n Imagify je jedn\u00edm z nejroz\u0161\u00ed\u0159en\u011bj\u0161\u00edch WordPress plugin\u016f co se t\u00fd\u010de optimalizace a zm\u011bny velikost\u00ed obr\u00e1zk\u016f. <\/p>\n\n\n\n Obsahuje n\u00e1stroje, kter\u00e9 umo\u017e\u0148uj\u00ed nap\u0159. hromadnou optimalizaci, p\u0159evod form\u00e1t\u016f obr\u00e1zk\u016f do .webP a mnoh\u00e9 dal\u0161\u00ed. Jeho z\u00e1kladn\u00ed verze je se v\u0161emi funkcemi dostupn\u00e1 pln\u011b zdarma.<\/p>\n\n\n\n P\u0159ejdeme do Pluginy > P\u0159idat nov\u00fd plugin<\/strong>, kde plugin jednodu\u0161e nainstalujeme a aktivujeme.<\/p>\n\n\n\n Po aktivaci pluginu ve WordPressu je\u0161t\u011b nejsme schopni pou\u017e\u00edvat jakoukoliv funkci, proto\u017ee pot\u0159ebujeme nejd\u0159\u00edve budeme pot\u0159ebovat API kl\u00ed\u010d, kter\u00fd z\u00edsk\u00e1me n\u00e1sledovn\u011b:<\/p>\n\n\n\n Ne\u017e za\u010dneme cokoliv optimalizovat, plugin si p\u0159edt\u00edm spr\u00e1vn\u011b nastav\u00edme.<\/p>\n\n\n\n Pokud nech\u00e1me za\u0161krtnutou tuto mo\u017enost, tak se ka\u017ed\u00fd nov\u011b nahran\u00fd obr\u00e1zek ve WordPressu automaticky optimalizuje. <\/p>\n\n\n\n Origin\u00e1ln\u00ed obr\u00e1zky se p\u0159ed optimalizac\u00ed budou z\u00e1lohovat do samostatn\u00e9 slo\u017eky.<\/p>\n\n\n\n Pokud neza\u0161krtneme, obr\u00e1zky se defaultn\u011b budou optimalizovat pomoc\u00ed „smart compression“ pro nejlep\u0161\u00ed pom\u011br komprese a kvality.<\/p>\n\n\n\n Pokud v\u0161ak na webu chceme zachovat obr\u00e1zky s vysokou kvalitou(portfolio fotografa…), nech\u00e1me pol\u00ed\u010dko za\u0161krtnut\u00e9.<\/p>\n\n\n\n Pokud na web nahrajeme obr\u00e1zek, nap\u0159. ve form\u00e1tu .jpg, tak si Imagify vytvo\u0159\u00ed novou verzi toho sam\u00e9ho obr\u00e1zku, ale ve form\u00e1tu .webP. <\/p>\n\n\n\n Dal\u0161\u00ed mo\u017enost\u00ed je tuto verzi ve p\u0159eveden\u00e9m form\u00e1tu zobrazovat na webu(Display images in webP\u2026<\/strong>). D\u016fvod, pro\u010d bychom m\u011bli nechat ob\u011b kolonky za\u0161krtnut\u00e9 je ten, \u017ee form\u00e1t .webP umo\u017e\u0148uje zobrazovat obr\u00e1zky ve vysok\u00e9 kvalit\u011b, ale s mnohem men\u0161\u00ed velikost\u00ed soubor\u016f ne\u017e form\u00e1ty, jako jsou JPEG a PNG.<\/p>\n\n\n\n V p\u0159\u00edpad\u011b, \u017ee se na web nahraje v\u011bt\u0161\u00ed obr\u00e1zek ne\u017e je zvolen\u00e1 velikost(v pixelech), automaticky se jeho velikost zmen\u0161\u00ed, \u010d\u00edm\u017e dok\u00e1\u017eeme efektivn\u011b sn\u00ed\u017eit velikost webu a m\u016f\u017eeme tak pos\u00edlit rychlost na\u010d\u00edt\u00e1n\u00ed.<\/p>\n\n\n\n Po ka\u017ed\u00e9m nahr\u00e1n\u00ed obr\u00e1zku si WordPress vytvo\u0159\u00ed n\u011bkolik verz\u00ed stejn\u00e9ho souboru se zm\u011bn\u011bnou velikost\u00ed<\/a>. Pr\u00e1v\u011b t\u00edmto zp\u016fsobem jsme schopni automaticky optimalizovat tyto r\u016fzn\u00e9 velikosti obr\u00e1zk\u016f vytvo\u0159en\u00e9 WordPressem.<\/p>\n\n\n\n M\u00e1me zde mo\u017enost optimalizovat samotnou \u0161ablonu. Dal\u0161\u00edm nastaven\u00edm je volba konkr\u00e9tn\u00edch slo\u017ekek, ve kter\u00fdch chceme optimalizaci prov\u00e9zt(skryt\u00e9 slo\u017eky se optimalizaci vyhnou).<\/p>\n\n\n\n Za\u0161krtnut\u00edm povol\u00edme zobrazov\u00e1n\u00ed mo\u017enosti „Imagify“ v horn\u00edm n\u00e1strojov\u00e9m panelu. <\/p>\n\n\n\n Po dokon\u010den\u00ed z\u00e1kladn\u00edho nastaven\u00ed je pot\u0159eba v\u0161e ulo\u017eit. T\u00edmto na\u0161e pr\u00e1ce st\u00e1le nekon\u010d\u00ed, a \u010dek\u00e1 n\u00e1s tak posledn\u00ed a fin\u00e1ln\u00ed krok k optimalizaci obr\u00e1zk\u016f, „Bulk Optimization<\/strong>„<\/p>\n\n\n\n Jedn\u00e1 se o skv\u011bl\u00fd n\u00e1stroj, kter\u00fd dok\u00e1\u017ee hromadn\u011b optimalizovat v\u0161echny obr\u00e1zky najednou. Vhodn\u00fd je zejm\u00e9na pro u\u017eivatele, kte\u0159\u00ed do dne\u0161ka zanedb\u00e1vali \u00fadr\u017ebu webu a nikdy p\u0159edt\u00edm obr\u00e1zky neoptimalizovali. <\/p>\n\n\n\n S touto funkc\u00ed jsme schopni optimalizovat celou knihovnu m\u00e9di\u00ed b\u011bhem kr\u00e1tk\u00e9 chv\u00edle. Imagify je sice zdarma, ale i tak m\u00e1 sv\u00e9 hranice. Ve verzi zdarma tak m\u016f\u017eeme optimalizovat pouze 200 obr\u00e1zk\u016f m\u011bs\u00ed\u010dn\u011b.<\/p>\n\n\n\n Hromadnou optimalizaci zah\u00e1j\u00edme tla\u010d\u00edtkem „IMAGIFEM ALL“.<\/p>\n\n\n\n Pokud nem\u00e1me dostatek kreditu na optimalizaci v\u0161ech obr\u00e1zk\u016f, nebo pot\u0159ebujeme optimalizovat pouze n\u011bkter\u00e9 konkr\u00e9tn\u00ed obr\u00e1zky, m\u016f\u017eeme tak jednodu\u0161e prov\u00e9zt p\u0159\u00edmo v knihovn\u011b m\u00e9di\u00ed. U ka\u017ed\u00e9ho obr\u00e1zku se n\u00e1m nov\u011b p\u0159idala mo\u017enost optimalizace.<\/p>\n\n\n\n V tomto konkr\u00e9tn\u00edm p\u0159\u00edpad\u011b jsme obr\u00e1zek zmen\u0161ili o n\u011bjak\u00fdch 37%. Po optimalizaci m\u00e1me d\u00e1le na v\u00fdb\u011br:<\/p>\n\n\n\n Na v\u00fdb\u011br m\u00e1me ze z\u00e1kladn\u00edch t\u0159\u00ed licenc\u00ed, kter\u00e9 se daj\u00ed zakoupit m\u011bs\u00ed\u010dn\u011b, nebo ro\u010dn\u011b.<\/p>\n\n\n\n Vhodn\u00e1 je v\u0161ak pouze pro men\u0161\u00ed weby s omezen\u00fdm mno\u017estv\u00edm obr\u00e1zk\u016f.<\/p>\n\n\n\n Optimalizace obr\u00e1zk\u016f je kl\u00ed\u010dov\u00fdm faktorem p\u0159i zrychlov\u00e1n\u00ed webu. Neoptimalizovan\u00e9 obr\u00e1zky, nebo obr\u00e1zky ve \u0161patn\u00e9m form\u00e1tu zat\u011b\u017euj\u00ed web a odrazuj\u00ed tak potencion\u00e1ln\u00ed n\u00e1v\u0161t\u011bvn\u00edky. Pomal\u00e1 rychlost na\u010d\u00edt\u00e1n\u00ed webu d\u00e1le dok\u00e1\u017ee zhor\u0161it i jeho SEO. Po zrychlen\u00ed nen\u00ed na \u0161kodu upravit i samotn\u00e9 n\u00e1zvy obr\u00e1zk\u016f<\/a>. <\/p>\n\n\n\n D\u00edky Imagify jsme schopni v\u0161e napravit za relativn\u011b malou chv\u00edli. Existuj\u00ed sice i ostatn\u00ed pluginy pro optimalizaci, ale pokud krom\u011b z\u00e1kladn\u00ed optimalizace hled\u00e1te komplexn\u00ed n\u00e1stroj, kter\u00fd dok\u00e1\u017ee hromadn\u00e9 \u00fapravy, optimalizaci ji\u017e p\u0159i nahr\u00e1v\u00e1n\u00ed, nebo automatick\u00fd p\u0159evod obr\u00e1zk\u016f do form\u00e1tu .webP, Imagify se st\u00e1v\u00e1 jasnou volbou ve sv\u00e9m oboru.<\/p>\n\n\n\n Alternativou Imagify m\u016f\u017ee b\u00fdt nap\u0159. plugin ShortPixel<\/a>, nebo TinyPNG.<\/p>\n\n\n\n Je dobr\u00e9 m\u00edt na pam\u011bti, \u017ee kompletn\u00edho zrychlen\u00ed WordPress webu jsme v n\u011bkter\u00fdch situac\u00edch schopni b\u011bhem kr\u00e1tk\u00e9 chv\u00edle, ale ve v\u011bt\u0161in\u011b p\u0159\u00edpad\u016f se m\u016f\u017ee jednat o velmi zdlouhavou a \u010dasov\u011b n\u00e1ro\u010dnou pr\u00e1ci. V\u00edce o t\u00e9to problematice se dozv\u00edte v \u010dl\u00e1nku „Jak n\u00e1kladn\u00e9 je zrychlen\u00ed WordPressu<\/a>„.<\/p>\n","protected":false},"excerpt":{"rendered":" Z jak\u00e9ho d\u016fvodu obr\u00e1zky v\u016fbec optimalizovat? Optimalizace obr\u00e1zk\u016f je d\u016fle\u017eit\u00e1 nejen z pohledu rychlosti webu, ale i celkov\u00e9ho SEO. Obr\u00e1zky, kter\u00e9 jsou na webu v nevhodn\u00e9m form\u00e1tu, nebo zbyte\u010dn\u011b velik\u00e9m rozli\u0161en\u00ed v\u00fdrazn\u011b zat\u011b\u017euj\u00ed webov\u00e9 str\u00e1nky, kter\u00e9 se z toho d\u016fvodu dlouze na\u010d\u00edtaj\u00ed a odrazuj\u00ed tak potencion\u00e1ln\u00ed n\u00e1v\u0161t\u011bvn\u00edky. M\u00edra okam\u017eit\u00e9ho opu\u0161t\u011bn\u00ed webu se zna\u010d\u00ed pomoc\u00ed „bounce<\/p>\n","protected":false},"author":1,"featured_media":7212,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[49,30,31],"tags":[],"class_list":["post-7188","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-obrazky","category-wordpress","category-wordpress-pluginy"],"_links":{"self":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts\/7188"}],"collection":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/comments?post=7188"}],"version-history":[{"count":0,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts\/7188\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/media\/7212"}],"wp:attachment":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/media?parent=7188"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/categories?post=7188"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/tags?post=7188"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}<\/a><\/figure>\n\n\n\n
Pro\u010d pou\u017e\u00edvat pr\u00e1v\u011b Imagify?<\/h2>\n\n\n\n
Instalace a aktivace Imagify<\/h2>\n\n\n\n
<\/a><\/figure>\n\n\n\n
\n
<\/a><\/figure>\n\n\n\n
Nastaven\u00ed > Imagify<\/h2>\n\n\n\n
General Settings – obecn\u00e9 nastaven\u00ed<\/h3>\n\n\n\n
<\/a><\/figure>\n\n\n\n
Auto-Optimize images on upload – automatick\u00e1 optimalizace obr\u00e1zk\u016f ihned po nahr\u00e1n\u00ed<\/h4>\n\n\n\n
Backup original images – z\u00e1lohovat p\u016fvodn\u00ed obr\u00e1zky<\/h4>\n\n\n\n
Lossless compression – bezztr\u00e1tov\u00e1 komprese<\/h4>\n\n\n\n
Optimization – optimalizace<\/h3>\n\n\n\n
OPTIMIZATION > WEBP FORMAT<\/h4>\n\n\n\n
<\/a><\/figure>\n\n\n\n
Create webP versions of images – Vytvo\u0159en\u00ed obr\u00e1zk\u016f ve form\u00e1tu .webP<\/h5>\n\n\n\n
OPTIMIZATION > MEDIA LIBRARY<\/h4>\n\n\n\n
<\/a><\/figure>\n\n\n\n
Resize larger images – zm\u011bnit velikost v\u011bt\u0161\u00edch obr\u00e1zk\u016f<\/h5>\n\n\n\n
Files optimization<\/h5>\n\n\n\n
Custom folders – vlastn\u00ed slo\u017eky <\/h5>\n\n\n\n
<\/a><\/figure>\n\n\n\n
Display Options – mo\u017enosti zobrazen\u00ed<\/h3>\n\n\n\n
<\/a><\/figure>\n\n\n\n
M\u00e9dia > Bulk Optimization – hromadn\u00e1 optimalizace<\/h2>\n\n\n\n
<\/a><\/figure>\n\n\n\n
M\u00e9dia > Knihovna – optimalizace jednotliv\u00fdch obr\u00e1zk\u016f<\/h2>\n\n\n\n
<\/a><\/figure>\n\n\n\n
\n
Kolik Imagify stoj\u00ed?<\/h2>\n\n\n\n
<\/a><\/figure>\n\n\n\n
Imagify – licence STARTER – pln\u011b zdarma<\/h3>\n\n\n\n
\n
Imagify – licence GROWTH – \u0159e\u0161en\u00ed pro st\u0159edn\u011b velk\u00e9 a v\u011bt\u0161\u00ed weby<\/h3>\n\n\n\n
\n
Imagify – licence INFINITE – nejdra\u017e\u0161\u00ed licence, se kterou si ka\u017ed\u00fd vysta\u010d\u00ed<\/h3>\n\n\n\n
\n
Z\u00e1v\u011br<\/h2>\n\n\n\n