Pokud jste se již nějakou dobu zabývali počítači a digitálními obrázky, zejména pokud jste webový designér nebo fotograf publikující vaše fotografie online, nepochybně jste slyšeli, že je uvedeno správné rozlišení obrázků zobrazovaných na webu, nebo na počítačových obrazovkách obecně je 72 pixelů na palec (ppi).

Možná jste dokonce slyšeli, že zatímco 72 ppi je správné pro obrázky zobrazené na Macu, PC se systémem Windows potřebuje rozlišení nastavené na 96 ppi.

Někteří říkají, že je to „ppi“ ( pixely na palec), jiní tvrdí, že je to „dpi“ ( tečky na palec), a celá věc by byla velmi matoucí, kdyby to nebylo pro jednu malou skutečnost - je to všechno naprostý nesmysl! V tomto tutoriálu se naučíme, proč prostě neexistuje nic jako standardní rozlišení webu nebo obrazovky a proč, pokud jsou vaše obrázky určeny pro web, nemusíte se vůbec starat o rozlišení obrázků!

Malá historie …

Původ rozlišení obrazovky 72 ppi sahá až do poloviny 80. let, kdy Apple vydal své první počítače Macintosh. Tyto počítače zahrnovaly vestavěný 9palcový displej s rozlišením obrazovky 72 pixelů na palec. Proč 72 pixelů na palec? Je to proto, že obrazovky Macintosh byly speciálně navrženy tak, aby fungovaly v dokonalé harmonii s tiskárnami Apple ImageWriter, které měly rozlišení tisku 144 bodů na palec - přesně dvojnásobné rozlišení obrazovky. To usnadnilo změnu měřítka zobrazení obrazovky na tištěnou stránku, což znamenalo, že váš text a grafiku bylo možné zobrazit na obrazovce v přesné velikosti, v jaké by se objevily při tisku. Později, když Apple začal vyrábět větší displeje pro počítače Macintosh, zajistili, že rozlišení obrazovky bude nastaveno na stejných 72 pixelů na palec, aby uživatelé vždy viděli přesný náhled tištěného dokumentu na obrazovce (pokud byli, pomocí tiskárny ImageWriter).

Rozlišení obrazovky o velikosti 72 pixelů na palec však bylo standardní pouze u společnosti Apple a netrvalo dlouho. Společnosti třetích stran, které prodávají monitory pro počítače Macintosh, se nedržely standardu a ani konkurenční PC monitory. Dnes, téměř o tři desetiletí později, se technologie výrazně zlepšila a dny obrazovek s rozlišením pouze 72 ppi jsou dávno pryč. Dokonce i Apple, společnost, která celou věc začala, nyní prodává své displeje s mnohem vyšším rozlišením. Nikdo už nevyrábí 72 obrazovek ppi. Nikdo už nepoužívá 72 ppi obrazovek. A přesto, i když tato stará technologie je daleko za námi, stále máme spoustu lidí, kteří stále věří, že musíme ve Photoshopu nastavit rozlišení našich obrázků na 72 pixelů na palec, než je nahrajeme na web. Většina lidí si myslí, že je to tak, že se obrázky budou správně zobrazovat na obrazovce, takže začněme věci učením jednoduchého způsobu, jak prokázat, že váš počítačový monitor, spolu s každým moderním počítačovým monitorem, má rozlišení mnohem vyšší než 72 ppi.

Testování standardu 72 PPI

Stejně jako všichni ostatní v dnešní době má displej vašeho počítače (ať už se jedná o samostatný monitor, systém typu všetko v jednom, jako je iMac nebo část notebooku), rozlišení obrazovky vyšší než 72 pixelů na palec, a nemáte abych za to vzal moje slovo. Můžete si to snadno vyzkoušet sami. Vše, co potřebujete, je pravítko nebo metr. Nyní, když vám obchod prodá počítačový monitor, obvykle vám řeknou jeho velikost na základě jeho úhlopříčky, přičemž některé běžné velikosti jsou 17 palců, 19 palců, 24 palců atd. To je v pořádku, ale pro náš test tady se nemusíme starat o toto číslo. Potřebujeme zjistit skutečnou šířku obrazovky v palcích. Chcete-li to provést, jednoduše uchopte pravítko nebo měřicí pásku a změřte plochu obrazovky zleva doprava. Ujistěte se, že měříte pouze samotnou oblast obrazovky. Nezahrnujte žádný okraj kolem obrazovky. Potřebujeme skutečnou šířku obrazovky (fotografie počítačového monitoru z Shutterstocku):

Změřte šířku obrazovky (bez vnějšího okraje).

Jakmile změříte šířku, musíte se ujistit, že váš monitor je nastaven na své nativní rozlišení zobrazení, což je skutečný počet pixelů, které může obrazovka zobrazovat zleva doprava a shora dolů. Například monitor s nativním rozlišením displeje 1920 x 1080 (běžně označovaný jako „HD“), obsahuje 1920 pixelů zleva doprava a 1080 pixelů shora dolů. Momentálně používám monitor s nativním rozlišením displeje 2560 x 1440, ale můj notebook má nativní rozlišení displeje 1920 x 1200, takže se liší, což znamená, že budete muset znát nativní rozlišení displeje konkrétního monitoru. a ujistěte se, že je to monitor nastaven v možnostech zobrazení operačního systému.

Nyní, když jste změřili skutečnou šířku obrazovky a ujistili se, že váš monitor běží v nativním rozlišení obrazovky, abyste zjistili, jaké je jeho skutečné rozlišení (v pixelech na palec), jednoduše vezměte první číslo z nativního rozlišení obrazovky, které vám řekne šířku obrazovky v pixelech a rozdělí ji šířkou obrazovky v palcích. Například moje nativní rozlišení zobrazení je 2560 x 1440, takže vezmu první číslo 2560, což je šířka obrazovky v pixelech, a rozdělím ji šířkou v palcích, což v mém případě bylo 23, 4 (nebo docela blízko). Pomocí šikovné vestavěné kalkulačky mého operačního systému, 2560 ÷ 23, 4 = 109, 4, kterou zaokrouhlím na 109. Takže právě z tohoto rychlého a jednoduchého testu jsem potvrdil, že moje rozlišení obrazovky je 109 pixelů na palec, ne 72 pixelů na palec. Váš vlastní test s obrazovkou vám může dát jiný výsledek než můj, ale pokud stále nepoužíváte jeden z těch původních počítačů Macintosh z poloviny 80. let, bude to mnohem vyšší než 72 ppi.

Pokud chcete, můžete dělat totéž s výškou obrazovky. Stačí změřit pravítko nebo pásku a změřit skutečnou výšku obrazovky v palcích (opět se vyhnout hraniční oblasti kolem ní):

Změřte výšku obrazovky (bez vnějšího okraje).

Poté vezměte druhé číslo z nativního rozlišení obrazovky, které vám poskytuje výšku v pixelech, a vydělte ho výškou v palcích. Opět platí, že moje nativní rozlišení displeje je 2560 x 1440, takže si vezmu druhé číslo 1440 a rozdělím jej změřenou výškou obrazovky, která byla 13, 2 palce. Pomocí mé kalkulačky, 1440 ÷ 13, 2 = 109, 09, kterou opět zaokrouhlím na 109. Jak vidíme, měli byste dosáhnout téměř stejného výsledku pomocí šířky nebo výšky obrazovky. V mém případě byly oba zpracovány na 109 pixelů na palec, nikoli 72 pixelů na palec.

Pro srovnání se podívejme na skutečné rozlišení obrazovky mého notebooku. Je to MacBook Pro (vyrobený společností Apple, společností, která nám před mnoha lety dala původní standard 72 ppi). Můj MacBook Pro má nativní rozlišení displeje 1920 x 1200, takže stejně jako předtím jsem si vzal první číslo 1920, které mi dává šířku obrazovky v pixelech, a rozdělím jej šířkou obrazovka v palcích, což je v tomto případě 14, 4. Takže 1920 ÷ 14, 4 = 133, 3, které zaokrouhlím na 133 pixelů na palec . To je mnohem vyšší než 72 a dokonce vyšší než můj samostatný monitor. Totéž udělám s výškou, vezmu výšku v pixelech (1200) a vydělím ji výškou v palcích (9). 1200 × 9 = 133, 3, opět zaokrouhleno na 133 pixelů na palec.

Dva různé displeje, každý se dvěma různými rozlišeními obrazovky (109 ppi a 133 ppi), oba výrazně vyšší než 72 ppi, což podle mnoha lidí dnes zůstává průmyslovým standardním rozlišením pro prohlížení obrázků na webu a na obrazovce. Pokud má moje obrazovka, vaše obrazovka a obrazovka všech ostatních rozlišení vyšší než 72 ppi, nemluvě o skutečnosti, že obě moje obrazovky měly velmi odlišná rozlišení od sebe navzájem a vaše obrazovka může mít i jiné rozlišení, pak jasně, ne pouze neexistuje žádný oficiální standard pro rozlišení obrazovky, ale i kdyby tam byl, už by to nebylo 72 ppi. Tyto dny, stejně jako původní počítače Macintosh, pro které byly navrženy, jsou historií.

Plugin pro krátké kódy, akce a filtry: Chyba v krátkém kódu (ads-essentials-middle)

Rozlišení obrazu ovlivňuje velikost tisku, nikoli velikost obrazovky

Pokud vás skutečnost, že počítačové monitory dnes mají rozlišení obrazovky vyšší než 72 ppi, nepřesvědčila, že už neexistuje nic takového jako rozlišení rozlišení 72 ppi, je třeba zvážit další důležitý fakt. Pokud jste si dříve přečetli náš tutoriál Rozlišení obrázků, Rozměry pixelů a Velikost dokumentu, již víte, že rozlišení obrázku nemá absolutně nic společného s tím, jak se váš obrázek objeví na obrazovce. Digitální obraz ve skutečnosti sám o sobě nemá žádné vlastní rozlišení. Jsou to jen pixely. Má určitý počet pixelů zleva doprava a určitý počet shora dolů. Šířka a výška obrázku v pixelech je známá jako jeho rozměry v pixelech a to je vše, na čem záleží obrazovka počítače.

Velikost, ve které se obrázek objeví na obrazovce, závisí pouze na dvou věcech - pixelech obrazu a rozlišení obrazovky. Dokud nastavíte obrazovku na své nativní rozlišení zobrazení, jak jsme diskutovali výše, bude se zobrazovat obraz pixelů za pixel. Jinými slovy, každý pixel v obraze zabere přesně jeden pixel na obrazovce. Například obrázek o velikosti 640 x 480 pixelů vyplní oblast obrazovky o velikosti 640 x 480 pixelů. Na webové stránce by se na obrazovce objevil banner o šířce 800 pixelů. Nic víc, nic míň. A bez ohledu na to, jaké rozlišení obrázku nastavíte ve Photoshopu, ať už je to 72 ppi, 300 ppi nebo 3000 ppi, nebude mít vůbec žádný vliv na to, jak velký nebo malý se obraz objeví na obrazovce.

To proto, že rozlišení obrázku ovlivňuje pouze jednu věc - velikost obrázku při jeho tisku . Nastavením rozlišení ve Photoshopu řekneme tiskárně, nikoliv obrazovce, kolik pixelů v obrázku se vytlačí na palec papíru. Čím více pixelů vtlačíte na každý palec papíru, tím menší bude obraz při tisku. A obecně řečeno, čím více pixelů tisknete na palec, tím vyšší je kvalita tisku.

Můžeme snadno zjistit, jak velká fotografie se vytiskne na základě určitého rozlišení obrázku. Jednoduše vezměte šířku fotografie v pixelech a rozdělte ji rozlišením obrázku, poté vezměte výšku fotografie v pixelech a rozdělte ji také rozlišením obrázku. Pokud například vezmeme obrázek s rozlišením 640 x 480 pixelů a ve Photoshopu nastavíme jeho rozlišení na 72 ppi, můžeme rozdělit šířku a výšku fotografie jeho rozlišením a určit, že se bude tisknout na papír zhruba 8, 9 x 6, 7 palce. Pokud ve Photoshopu zvýšíme rozlišení na řekněme 240 ppi, což je běžnější rozlišení tisku, pak znovu, když uděláme matematiku, vydělíme šířku a výšku pixelu 240 ppi, víme, že by se fotografie vytiskla ve velikosti 2, 7 x 2 palce, což je mnohem menší, než kdybychom jej vytiskli na 72 ppi, ale celková kvalita tisku by byla mnohem lepší. Co je však důležitější pochopit, je to, že změnou rozlišení nijak neovlivňujeme vzhled obrazu na obrazovce.

Abychom viděli jasněji, jak rozlišení ovlivňuje velikost tisku a ne velikost obrazovky, zde je obrázek, který jsem otevřel ve Photoshopu. Tento malý kluk se také pokoušel pochopit všechny tyto věci s rozlišením 72 ppi pro webové rozlišení, ale vypadá to, že to může trochu přehánět (myslící dětská fotografie z Shutterstocku):

Rozlišení obrazu opravdu není tak složité, ale rozhodně A pro úsilí.

Otevře se dialogové okno Velikost obrázku Photoshopu přechodem do nabídky Obrázek na panelu nabídek v horní části obrazovky a výběrem Velikost obrázku :

Přejít na obrázek> Velikost obrázku.

V horní části dialogového okna Velikost obrázku je část Dimenze pixelů, která nám říká šířku a výšku obrázku v pixelech. Zde vidíme, že moje fotografie má šířku i výšku 500 pixelů, což z ní dělá slušnou velikost pro zobrazení na webu. Toto je jediná část dialogového okna Velikost obrazu, o kterou se stará obrazovka vašeho počítače - skutečné rozměry obrazových bodů v obrázku:

Sekce Pixel Dimensions nám zobrazuje šířku a výšku v pixelech.

Pod rozměry pixelů je část Velikost dokumentu, která nám říká, jak velký by se obrázek aktuálně objevil na papíře, kdybychom jej vytiskli. Tato část pojednává výhradně o velikosti tisku a nemá vůbec žádný vliv na to, jak se obrázek objeví na obrazovce. Stává se také, že je doma k všestranné možnosti rozlišení (důvod, proč jsme tady všichni!), Což dává smysl, protože rozlišení ovlivňuje velikost tisku, nikoli velikost obrazovky. Jak vidíme, Photoshop pokročil a nastavil rozlišení mé fotografie na 72 pixelů na palec (ano, dokonce i Photoshop přispívá k mýtu o 72 ppi) a přímo nad možností Rozlišení v polích Šířka a Výška vidím, že při 72 ppi by se moje fotografie o rozměrech 500 x 500 pixelů vytiskla na papír o rozměrech 6, 944 x 6, 944 palců (500 × 72 = 6, 944):

Sekce Velikost dokumentu ukazuje velikost tisku na základě aktuálního rozlišení. Nemá to žádný vliv na velikost obrazovky.

Uvidíme, co se stane, když zvýším rozlišení obrázku. Než to ale udělám, rychle zruším zaškrtnutí volby Převzít obrázek v dolní části dialogového okna, aby si obraz při změně rozlišení zachoval původní rozměry v pixelech:

Zrušte zaškrtnutí možnosti Převzorkovat obrázek.

Pokud není zaškrtnuto políčko Převzorkovat obraz, zvýším rozlišení z 72 pixelů na palec na 240 pixelů na palec . V horní části vidíme, že zvětšení rozlišení nezměnilo skutečné rozměry pixelů. Je to stále 500 x 500 pixelů, což znamená, že by stále zabíralo plochu obrazovky 500 x 500 pixelů. Ale při 240 ppi by nyní tisklo na papír o velikosti pouze 2, 083 x 2, 083 palce (500 × 240 = 2, 083). Změna rozlišení změnila velikost tisku fotografie, ale nic jiného:

Obrázek by se nyní tiskl menší, ale zůstal by na obrazovce přesně stejný rozměr 500 x 500 pixelů.

Znovu zvýším rozlišení obrázku, tentokrát na něco šíleného jako 500 pixelů na palec, jen aby byla matematika opravdu snadná. Obraz o velikosti 500 x 500 pixelů nastavený na rozlišení 500 pixelů na palec by se vytiskl jako obrázek 1 x 1 palec na papír (500 × 500 = 1). Skutečné rozměry obrazových bodů obrazu se opět nezměnily. Dokonce i při 500 ppi by se můj obraz na obrazovce nezdálil větší nebo menší, že by při 72 ppi nebo 240 ppi, nebo v jakémkoli rozlišení, protože je to stále obrázek o velikosti 500 x 500 pixelů bez ohledu na nastavení rozlišení a jeho rozměry pixelů jsou všechny obrazovky vašeho počítače se starají o:

Při 500 ppi by se obrázek skutečně tiskl velmi malý, ale stále by se na obrazovce objevil jako 500 x 500 pixelů.

A konečně, zde je bok po boku srovnání obrázku, jak se objevuje ve všech třech výše uvedených rozlišeních. Zmenšil jsem obrázek (nyní je to jen 200 x 200 pixelů), takže si mohu umístit všechny tři verze vedle sebe, ale první verze vlevo byla uložena na 72 ppi. Verze uprostřed byla uložena na 240 ppi a verze napravo byla uložena na 500 ppi:

72 ppi (vlevo), 240 ppi (uprostřed) a 500 ppi (vpravo) verze obrázku.

Jak jasně vidíme, rozlišení nemá vůbec žádný vliv na to, jak obrázek vypadá na obrazovce. Všechny tři verze zabírají místo přesně 200 x 200 pixelů bez ohledu na nastavení rozlišení. Kvalita každé verze je také naprosto stejná. Každá verze by se kvůli různým nastavením rozlišení tiskla ve velmi odlišné velikosti, ale to nijak nezmění velikost obrazovky ani kvalitu obrazu.

I když je pochybné, že tento nesmysl s rozlišením 72 ppi pro web a obrazovku zmizí v dohledné době, doufám, že tento tutoriál alespoň usnadnil pochopení, proč je v tomto okamžiku ve skutečnosti nesmysl. Počítačové monitory dnes mají rozlišení obrazovky vyšší než 72 ppi a možnost rozlišení obrázku ve Photoshopu ovlivňuje pouze velikost tisku fotografie, nikoli velikost obrazovky.

Jakákoli fotografie s rozměry pixelů dostatečně malá na to, aby se mohla zobrazit na webu, by byla příliš malá na to, aby si kdokoli mohl stáhnout a vytisknout verzi v dobré kvalitě v užitečné velikosti, takže se všemi těmito důvody, pokud bude vaše fotografie zobrazena pouze na obrazovce, ať už je to na webu, v e-mailu nebo v jakémkoli případě, neexistuje žádný logický důvod, proč byste ve Photoshopu museli nastavit rozlišení na 72 ppi. Pokud fotografii netisknete, nemusíte se vůbec starat o rozlišení obrázku. A tady to máme!

Kategorie: