{"id":4841,"date":"2023-08-25T00:00:00","date_gmt":"2023-08-25T00:00:00","guid":{"rendered":"https:\/\/tech-lib.eu\/tech\/jak-ukladat-obrazky-pro-web-v-aplikaci-photoshop\/"},"modified":"2023-08-25T00:00:00","modified_gmt":"2023-08-25T00:00:00","slug":"jak-ukladat-obrazky-pro-web-v-aplikaci-photoshop","status":"publish","type":"post","link":"https:\/\/tech-lib.eu\/tech\/jak-ukladat-obrazky-pro-web-v-aplikaci-photoshop\/","title":{"rendered":"Jak ukl\u00e1dat obr\u00e1zky pro web v aplikaci Photoshop"},"content":{"rendered":"<div class=\"articlecontent\">\n<div class=\"newlinediv\"><\/div>\n<p> Aplikace Adobe Photoshop nab\u00edz\u00ed \u0159adu mo\u017enost\u00ed optimalizace velikosti soubor\u016f p\u0159i p\u0159\u00edprav\u011b fotografi\u00ed pro web bez ztr\u00e1ty kvality. Tento p\u0159\u00edsp\u011bvek vysv\u011btluje, jak ukl\u00e1dat fotografie pro web, a zab\u00fdv\u00e1 se \u010dasto kladen\u00fdmi ot\u00e1zkami na toto t\u00e9ma. Jak ukl\u00e1dat fotografie pro web? <\/p>\n<div class=\"newlinediv\"><\/div>\n<p> P\u0159i ukl\u00e1d\u00e1n\u00ed fotografi\u00ed pro web ve Photoshopu dodr\u017eujte n\u00e1sleduj\u00edc\u00ed pokyny: <\/p>\n<div class=\"newlinediv\"><\/div>\n<p> Po proveden\u00ed pot\u0159ebn\u00fdch \u00faprav p\u0159ejd\u011bte do nab\u00eddky &#8222;Soubor&#8220; a vyberte mo\u017enost &#8222;Ulo\u017eit pro web&#8220; (ve star\u0161\u00edch verz\u00edch m\u016f\u017ee b\u00fdt k dispozici mo\u017enost &#8222;Ulo\u017eit pro web a za\u0159\u00edzen\u00ed&#8220;). <\/p>\n<div class=\"newlinediv\"><\/div>\n<p> 2. Po otev\u0159en\u00ed dialogov\u00e9ho okna &#8222;Ulo\u017eit pro web&#8220; se zobraz\u00ed n\u00e1hled obr\u00e1zku a n\u011bkolik parametr\u016f. 3. Z mo\u017enost\u00ed v horn\u00ed \u010d\u00e1sti dialogov\u00e9ho okna vyberte po\u017eadovan\u00fd form\u00e1t souboru. JPEG, PNG a GIF jsou t\u0159i nejpou\u017e\u00edvan\u011bj\u0161\u00ed typy soubor\u016f obr\u00e1zk\u016f pro web. 4. Upravte nastaven\u00ed komprese nebo kvality obr\u00e1zku tak, abyste dos\u00e1hli ide\u00e1ln\u00ed rovnov\u00e1hy mezi velikost\u00ed souboru a kvalitou obr\u00e1zku. Men\u0161\u00ed velikost souboru bude v\u00fdsledkem v\u011bt\u0161\u00ed komprese nebo ni\u017e\u0161\u00ed kvality, ale m\u016f\u017ee t\u00edm utrp\u011bt ostrost obr\u00e1zk\u016f. 5. Po\u010d\u00edtejte se zm\u011bnou velikosti fotografie na specifikace pot\u0159ebn\u00e9 pro zobrazen\u00ed na webu. To lze prov\u00e9st zad\u00e1n\u00edm po\u017eadovan\u00e9 \u0161\u00ed\u0159ky nebo v\u00fd\u0161ky do p\u0159\u00edslu\u0161n\u00fdch pol\u00ed dialogov\u00e9ho okna. 6. Zkontrolujte, zda optimalizovan\u00fd obr\u00e1zek spl\u0148uje va\u0161e o\u010dek\u00e1v\u00e1n\u00ed, n\u00e1hledem v dialogov\u00e9m okn\u011b. Nakonec vyberte m\u00edsto v po\u010d\u00edta\u010di, kam optimalizovan\u00fd obr\u00e1zek ulo\u017e\u00edte kliknut\u00edm na tla\u010d\u00edtko &#8222;Ulo\u017eit&#8220;. <\/p>\n<div class=\"newlinediv\"><\/div>\n<p> Pro\u010d Photoshop neum\u00ed ukl\u00e1dat pro web? Mo\u017enost &#8222;Ulo\u017eit pro web&#8220; ve Photoshopu nemus\u00ed b\u00fdt k dispozici, pokud pou\u017e\u00edv\u00e1te nejnov\u011bj\u0161\u00ed verzi Adobe Photoshop CC 2021. M\u00edsto n\u00e1stroje &#8222;Ulo\u017eit pro web&#8220; p\u0159idala spole\u010dnost Adobe mo\u017enost &#8222;Exportovat jako&#8220;, kter\u00e1 nab\u00edz\u00ed toto\u017enou funkci. Tuto mo\u017enost z\u00edsk\u00e1te v\u00fdb\u011brem mo\u017enosti &#8222;Exportovat&#8220; v nab\u00eddce &#8222;Soubor&#8220; a pot\u00e9 &#8222;Exportovat jako&#8220;. <\/p>\n<div class=\"title\"> \u010c\u00edm se li\u0161\u00ed mo\u017enosti Ulo\u017eit jako a Ulo\u017eit pro web ve Photoshopu? <\/div>\n<p> Mo\u017enosti optimalizace, kter\u00e9 n\u00e1stroje &#8222;Ulo\u017eit jako&#8220; a &#8222;Ulo\u017eit pro web&#8220; ve Photoshopu nab\u00edzej\u00ed, jsou t\u00edm, co je od sebe nejv\u00edce odli\u0161uje. Mo\u017enost &#8222;Ulo\u017eit jako&#8220; v\u00e1m d\u00e1v\u00e1 mo\u017enost ulo\u017eit obr\u00e1zek v r\u016fzn\u00fdch form\u00e1tech, nap\u0159\u00edklad PSD, TIFF nebo JPEG, bez jak\u00e9koli optimalizace pro web. Pokud pot\u0159ebujete zachovat vrstvy, pr\u016fhlednost nebo jin\u00e9 sofistikovan\u00e9 vlastnosti, je tato mo\u017enost u\u017eite\u010dn\u00e1. <\/p>\n<div class=\"newlinediv\"><\/div>\n<p> Funkce &#8222;Ulo\u017eit pro web&#8220; (nebo &#8222;Exportovat jako&#8220; v n\u00e1sleduj\u00edc\u00edch verz\u00edch) je v\u0161ak ur\u010dena v\u00fdhradn\u011b pro pou\u017eit\u00ed na webu. Poskytuje parametry pro optimalizaci velikosti souboru p\u0159i zachov\u00e1n\u00ed uch\u00e1zej\u00edc\u00ed kvality obr\u00e1zku. Pomoc\u00ed t\u00e9to mo\u017enosti m\u016f\u017eete vyb\u00edrat z r\u016fzn\u00fdch typ\u016f soubor\u016f, v\u010detn\u011b JPEG, PNG a GIF, a tak\u00e9 upravovat kompresi a velikost obr\u00e1zku pro co nejlep\u0161\u00ed zobrazen\u00ed na webu. Jak\u00fd form\u00e1t m\u00e1m pou\u017e\u00edt p\u0159i ukl\u00e1d\u00e1n\u00ed soubor\u016f aplikace Photoshop? <\/p>\n<div class=\"title\"> Pot\u0159eby va\u0161eho projektu ur\u010d\u00ed, zda m\u00e1te obr\u00e1zek ulo\u017eit jako JPEG nebo PNG. <\/div>\n<p> Pro webov\u00e9 fotografie je obl\u00edben\u00fdm form\u00e1tem JPEG (Joint Photographic Experts Group). Je nejvhodn\u011bj\u0161\u00ed pro fotografie nebo grafiku se slo\u017eit\u00fdmi barevn\u00fdmi p\u0159echody, proto\u017ee podporuje miliony barev. Proto\u017ee JPEG pou\u017e\u00edv\u00e1 ztr\u00e1tovou kompresi, mus\u00ed se n\u011bkter\u00e9 informace ztratit, aby se minimalizovala velikost souboru. P\u0159i extr\u00e9mn\u00ed kompresi v\u0161ak m\u016f\u017ee doj\u00edt ke ztr\u00e1t\u011b kvality obr\u00e1zku nebo se mohou objevit znateln\u00e9 artefakty. <\/p>\n<div class=\"newlinediv\"><\/div>\n<p> Bezeztr\u00e1tovou kompresi podporuje standard PNG (Portable Network Graphics), kter\u00fd zachov\u00e1v\u00e1 kvalitu obr\u00e1zku bez sn\u00ed\u017een\u00ed velikosti souboru. Je ide\u00e1ln\u00ed pro pr\u016fhledn\u00e9 obr\u00e1zky nebo p\u0159\u00edmo\u010darou grafiku s v\u00fdrazn\u00fdmi \u010darami a pln\u00fdmi barvami. P\u0159i v\u00fdb\u011bru form\u00e1tu berte v \u00favahu kompromis mezi kvalitou a velikost\u00ed souboru, proto\u017ee soubory PNG maj\u00ed obvykle v\u011bt\u0161\u00ed velikost ne\u017e soubory JPEG. <\/p>\n<div class=\"newlinediv\"><\/div>\n<p> Chcete-li sn\u00ed\u017eit velikost souboru a zachovat kvalitu obr\u00e1zku p\u0159i ukl\u00e1d\u00e1n\u00ed fotografi\u00ed pro web v aplikaci Photoshop, pou\u017eijte mo\u017enost &#8222;Ulo\u017eit pro web&#8220; (nebo &#8222;Exportovat jako&#8220;). P\u0159i rozhodov\u00e1n\u00ed mezi form\u00e1ty JPEG a PNG pro sv\u016fj projekt berte v \u00favahu jeho konkr\u00e9tn\u00ed po\u017eadavky. Vyzkou\u0161ejte n\u011bkolik nastaven\u00ed komprese, abyste na\u0161li takov\u00e9, kter\u00e9 nejl\u00e9pe vyv\u00e1\u017e\u00ed velikost souboru a kvalitu obrazu.<\/p><\/div>\n<div class=\"questions\">\n<div class=\"questionstitle\">FAQ<\/div>\n<div class=\"question\">\n<div class=\"qtitle\"> Jak\u00e1 je nejlep\u0161\u00ed velikost souboru JPEG pro web?<\/div>\n<p> Ide\u00e1ln\u00ed rovnov\u00e1ha mezi kvalitou a velikost\u00ed souboru a tak\u00e9 obsah obr\u00e1zku ur\u010duj\u00ed vhodnou velikost souboru JPEG pro web. Pro webov\u00e9 fotografie se obvykle doporu\u010duje usilovat o velikost souboru mezi 30 a 100 KB. Je v\u0161ak nezbytn\u00e9 vz\u00edt v \u00favahu jak zam\u00fd\u0161lenou funkci obr\u00e1zku, tak konkr\u00e9tn\u00ed specifikace webov\u00e9 str\u00e1nky. Nap\u0159\u00edklad miniatury nebo fotografie, kter\u00e9 nejsou hlavn\u00edm c\u00edlem, by m\u011bly m\u00edt men\u0161\u00ed velikost souboru, zat\u00edmco fotografie s vysok\u00fdm rozli\u0161en\u00edm, kter\u00e9 mus\u00ed zachovat jasnost a detaily, mohou vy\u017eadovat v\u011bt\u0161\u00ed velikost souboru. Objeven\u00ed ide\u00e1ln\u00edho kompromisu pro va\u0161e jedine\u010dn\u00e9 po\u017eadavky lze dos\u00e1hnout experimentov\u00e1n\u00edm s r\u016fzn\u00fdmi nastaven\u00edmi komprese ve Photoshopu. <\/p>\n<\/div>\n<div class=\"question\">\n<div class=\"qtitle\"> Jak\u00fd je nejlep\u0161\u00ed zp\u016fsob ukl\u00e1d\u00e1n\u00ed JPEG pro web?<\/div>\n<p> N\u00ed\u017ee uveden\u00e9 postupy p\u0159edstavuj\u00ed nejlep\u0161\u00ed p\u0159\u00edstup k ukl\u00e1d\u00e1n\u00ed fotografi\u00ed JPEG ve Photoshopu pro web: 1. Otev\u0159ete program Photoshop a sv\u016fj obr\u00e1zek. 2. V nab\u00eddce vyberte mo\u017enost Soubor &gt; Exportovat &gt; Ulo\u017eit pro web (star\u0161\u00ed). <\/p>\n<div class=\"newlinediv\"><\/div>\n<p> 3. V dialogov\u00e9m okn\u011b Ulo\u017eit pro web vyberte jako form\u00e1t souboru JPEG. 4. Chcete-li nastavit rovnov\u00e1hu mezi velikost\u00ed souboru a kvalitou obr\u00e1zku, posu\u0148te posuvn\u00edk Kvalita. Ni\u017e\u0161\u00ed kvalita zajist\u00ed men\u0161\u00ed velikost souboru, ale existuje mo\u017enost, \u017ee dojde ke ztr\u00e1t\u011b detail\u016f obrazu. 5. Vyberte spr\u00e1vn\u00fd barevn\u00fd prostor. Jeliko\u017e je sRGB \u0161iroce podporov\u00e1n prohl\u00ed\u017ee\u010di, doporu\u010duje se pro pou\u017eit\u00ed s webov\u00fdmi fotografiemi. 6. Obr\u00e1zek m\u016f\u017eete d\u00e1le optimalizovat v\u00fdb\u011brem mo\u017enost\u00ed jako Progresivn\u00ed pro postupn\u00e9 na\u010d\u00edt\u00e1n\u00ed obr\u00e1zku nebo P\u0159ev\u00e9st na sRGB pro zaji\u0161t\u011bn\u00ed jednotn\u00fdch barev v r\u016fzn\u00fdch za\u0159\u00edzen\u00edch. 7. Na prav\u00e9m panelu zobrazte n\u00e1hled obr\u00e1zku, abyste vid\u011bli, jak bude vypadat po kompresi. 8. Pot\u00e9, co jste s nastaven\u00edm spokojeni, klikn\u011bte na tla\u010d\u00edtko ulo\u017eit a vyberte, kam se m\u00e1 soubor JPEG ulo\u017eit. <\/p>\n<div class=\"newlinediv\"><\/div>\n<p> Tyto metody v\u00e1m uk\u00e1\u017e\u00ed, jak ukl\u00e1dat fotografie JPEG optimalizovan\u00e9 pro web, \u010d\u00edm\u017e se dos\u00e1hne rovnov\u00e1hy mezi kvalitou obrazu a velikost\u00ed souboru, kter\u00e1 zaru\u010d\u00ed rychl\u00e9 na\u010d\u00edt\u00e1n\u00ed, ani\u017e by to bylo na \u00fakor celkov\u00e9ho estetick\u00e9ho dojmu.<\/p>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Aplikace Adobe Photoshop nab\u00edz\u00ed \u0159adu mo\u017enost\u00ed optimalizace velikosti soubor\u016f p\u0159i p\u0159\u00edprav\u011b fotografi\u00ed pro web bez ztr\u00e1ty kvality. Tento p\u0159\u00edsp\u011bvek vysv\u011btluje, jak ukl\u00e1dat fotografie pro web, a zab\u00fdv\u00e1 se \u010dasto kladen\u00fdmi ot\u00e1zkami na toto t\u00e9ma. Jak ukl\u00e1dat fotografie pro web? P\u0159i ukl\u00e1d\u00e1n\u00ed fotografi\u00ed pro web ve Photoshopu dodr\u017eujte n\u00e1sleduj\u00edc\u00ed pokyny: Po proveden\u00ed pot\u0159ebn\u00fdch \u00faprav p\u0159ejd\u011bte do &#8230; <a title=\"Jak ukl\u00e1dat obr\u00e1zky pro web v aplikaci Photoshop\" class=\"read-more\" href=\"https:\/\/tech-lib.eu\/tech\/jak-ukladat-obrazky-pro-web-v-aplikaci-photoshop\/\" aria-label=\"\u010c\u00edst v\u00edce o Jak ukl\u00e1dat obr\u00e1zky pro web v aplikaci Photoshop\">\u010c\u00edst d\u00e1l<\/a><\/p>\n","protected":false},"author":441,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1980],"tags":[],"class_list":["post-4841","post","type-post","status-publish","format-standard","hentry","category-optimalizace-obrazku"],"_links":{"self":[{"href":"https:\/\/tech-lib.eu\/tech\/wp-json\/wp\/v2\/posts\/4841","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tech-lib.eu\/tech\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tech-lib.eu\/tech\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tech-lib.eu\/tech\/wp-json\/wp\/v2\/users\/441"}],"replies":[{"embeddable":true,"href":"https:\/\/tech-lib.eu\/tech\/wp-json\/wp\/v2\/comments?post=4841"}],"version-history":[{"count":0,"href":"https:\/\/tech-lib.eu\/tech\/wp-json\/wp\/v2\/posts\/4841\/revisions"}],"wp:attachment":[{"href":"https:\/\/tech-lib.eu\/tech\/wp-json\/wp\/v2\/media?parent=4841"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tech-lib.eu\/tech\/wp-json\/wp\/v2\/categories?post=4841"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tech-lib.eu\/tech\/wp-json\/wp\/v2\/tags?post=4841"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}