Velikost a měřítko obrázku v moderních stránkách SharePointu

Velikost a měřítko obrázku v moderních stránkách SharePointu

Moderní stránky a webové části jsou navržené tak, aby byly plně závislé na zařízeních, což znamená, že se obrázky používané ve webových částech liší podle toho, kde se zobrazují, které rozložení se používá, a na zařízení, na kterém jsou prohlíženy. Například moderní stránky jsou navržené tak, aby vypadaly skvěle na mobilních zařízeních, a Automatická změna velikosti obrázků pomáhá vytvářet atraktivní prostředí.

Příklady stránek na různých zařízeních

Jaké velikosti obrázků fungují nejlépe?

Vzhledem k návrhu stránky s odezvou se nejedná o konkrétní výšku nebo šířku v pixelech, které zajistí, aby obrázek zachoval určitý obrazec napříč zařízeními a rozloženími. Obrázky se změní a automaticky se oříznou, aby zobrazovaly nejlepší možný výsledek v různých zařízeních a rozloženích. Existují ale některé pokyny, které vám pomůžou zajistit, aby vaše obrázky vypadaly skvěle na vašich stránkách.

Hledání nejlepších velikostí obrázků na stránce závisí na těchto faktorech:

  • Poměr stran: vztah mezi výškou a šířkou obrázků

  • Rozložení sloupce: typ a počet sloupců na stránce

  • Rozložení webové části: rozložení zvolené pro webovou část, ve které se obrázek používá

Poměr stran

Poměr stran je vztah mezi šířkou a výškou obrázků. Obvykle se vyjadřuje jako dvě čísla, například 3:2, 4:3 nebo 16:9. Šířka je vždy první číslo. Jako příklad může poměr 16:9 být 1600 pixelů na šířku o výšce 900 pixelů. Nebo může být 1920 × 1080, 1280 x 720 nebo jakékoli jiné možnosti šířky/výšky, které se dají vypočítat jako 16:9. Když v některých editačních nástrojích pro úpravy fotografií určíte poměr stran obrázků, můžete najít poměr stran. 

Příklady poměrů stran 16:9 a 4:3.

Ve většině případů fungují obrázky v moderních webových částech na různých rozloženích a zařízeních, když mají poměr stran buď 16:9, nebo 4:3, podle toho, jaké je rozložení.

Rozložení sloupců

Stránku lze rozložit pomocí oddílů, které obsahují různé typy sloupců a rozložení, jako jsou například sloupce s plnou šířkou, jeden sloupec, dva sloupce, tři sloupce, jeden – třetí levý a jeden třetinový sloupec. Obecné pravidlo pro obrázky očekávané pro vyplnění sloupce je tak, že jsou nejméně stejně široké jako sloupec, do kterého jsou umístěna. Například obrázek ve webové části obrázek v jednom sloupci by měl být nejméně 1204 pixelů široký. Pokyny pro šířku jednotlivých rozložení sloupců jsou následující:

Rozložení

Šířka v pixelech

Sloupec s plnou šířkou

1920

Jeden sloupec

1204

Dva sloupce

586 na sloupec

Tři sloupce

380 na sloupec

Jeden třetinový sloupec

380 pro levý sloupec; 792 pro pravý sloupec

Jeden třetinový pravý sloupec

792 pro levý sloupec; 380 pro pravý sloupec

Vzhledem k citlivosti stránek se obrázky ve sloupcích s plnou šířkou vždycky zobrazují na plné šířce obrazovky s automatickou výškou založenou na velikosti obrazovky.

Výška obrázků umístěných v jiných rozloženích sloupců závisí na poměru stran. Tady jsou pravidla výška/šířka pro 16:9 a 4:3 poměry stran (zaokrouhlené nahoru/dolů na nejbližší obrazový bod). To je užitečné, když chcete uchovat obrázky s šířkou a výškou, která je vhodná pro mobilní zařízení.

POMĚR STRAN

16 × 9

4 × 3

Jeden sloupec

1204 × 677

1204 × 903

Dva sloupce

586 × 330

586 × 439

Tři sloupce

380 × 214

380 × 285

Jeden třetinový sloupec

380 × 446; 792 × 446 pro pravý sloupec

380 × 594; 792 × 594 pro pravý sloupec

Jeden třetinový pravý sloupec

792 × 446; 380 × 446 pro pravý sloupec

792 × 594; 380 × 594 pro pravý sloupec

Rozložení webových částí

Rozložení ve webových částech, která použijete, taky ovlivní, jak se vaše obrázky mění. Následující příklady ukazují různé webové části a jejich rozložení do jednoho sloupce a poměr stran použitých v jednotlivých.

Zvažte tento obrázek, který má původní poměr stran 16:9:

Příklad 16_9 obrázku

Následují příklady obrázku zobrazeného v různých webových částech a rozloženích.

Webová část Obrázek

Následující poměry stran a rozložení vrstev jsou:

  • Dlaždice: výška webové části se přizpůsobí poměru stran 8:3 a obrázky uvnitř webové části se přizpůsobí poměru stran 4:3.

  • Vrstvy: jednotlivá vrstva se změní na poměr stran 8:3 a obrázky uvnitř každého rozsahu vrstev až ke poměru stran poblíž 16:9.

  • V mobilních zařízeních se rozložení karusel používá na 16:9.

Tady je příklad obrázku zobrazeného v rozložení vrstvy (nahoře) a rozložení dlaždic (dole)

Příklad obrázků webových částí obrázek ve vrstvách a rozložení dlaždic

Webová část zvýrazněný obsah

16:9 je poměr stran pro rozložení karuselu, filmového pásu a karet.

Tady je příklad obrázku zobrazeného v rozložení filmový pás (nahoře) a rozložení karet (dole).

Příklady obrázků webové části zvýrazněný obsah

Webová část Obrázek

Obrázky se rozšíří na šířku oddílu obsahujícího webovou část. Pomocí panelu nástrojů Obrázek můžete změnit poměr stran nebo oříznutí, nebo pomocí úchytů pro změnu velikosti obrázek zvětšit nebo zmenšit.

Tady je příklad zobrazení značek oříznutí obrázku (modrých čar) na 4:3

Obrázek znázorňující ořezové značky na 4:3

Webová část galerie obrázků

V různých rozloženích se používají následující poměry stran:

  • Cihlové rozložení respektuje poměr stran všech zobrazených obrázků: 16:9, 1:1, 4:3 atd. 

  • Dlaždice, karty: 4:3

Tady je příklad obrázku zobrazeného v rozložení dlaždice (nahoře) a cihel (dole).

Příklad rozložení dlaždice a cihly pro webovou část galerie obrázků

Webová část příspěvky

V závislosti na rozložení mohou být obrázky ve webové části příspěvky 4:3, 16:9 nebo 21:9. Tady je příklad obrázků v horním příběhu a rozložení karusel.

Příklady obrázků s rozložením příspěvků

Oblast nadpisu stránky

Obrázky vypadají nejlépe, když jsou na šířku nebo 16:9 nebo jsou v poměru stran, a když mají velikost nejméně 1 MB. Také je třeba nastavit kontaktní místo tak, aby zůstala nejdůležitější část obrázku v zobrazení, obzvláště když se obrázek používá ve miniaturách, rozloženích příspěvků a výsledcích hledání.

Příklad (původní obrázek 16:9) s kontaktem nastaveným na reproduktoru.

Příklad obrázku 16:9 v oblasti s nadpisem stránky

Miniatura stránky

Miniatury stránek se zobrazují na místech, jako jsou výsledky hledání, zvýrazněné výsledky obsahu, příspěvky příspěvků a další. Miniatura ve výchozím nastavení pochází z oblasti nadpisu stránky nebo z webové části, která je v prvním pořadí na stránce (například nalevo od rozložení stránky). Můžete přepsat výchozí nastavení a změnit miniaturu stránky. V takovém případě je nejvhodnější použít obrázek s poměrem stran 16:9.

Příklad (původní obrázek 16:9)

Příklad obrázku miniatury stránky ve webové části zvýrazněný obsah

Webová část rychlé odkazy 

Webová část rychlé odkazy má šest různých rozložení. Tady jsou Doporučené poměry stran:

  • Filmový pás, mřížka, tlačítko: 16:9

  • Kompaktní, seznam, dlaždice: 1:1, 4:3

Tady je příklad obrázku zobrazeného v kompaktním rozložení (nahoře) a rozložení filmový pás (dole).

Příklady obrázků v rozložení rychlých odkazů

Tipy: 

Poznámka:  Tato stránka byla přeložena automaticky a může obsahovat gramatické chyby nebo nepřesnosti. Naším cílem je to, aby pro vás byl její obsah užitečný. Mohli byste nám prosím dát vědět, jestli vám informace pomohly? Pokud chcete, můžete se podívat na anglickou verzi článku.

Rozšiřte své dovednosti s Office
Projít školení
Získejte nové funkce jako první
Připojte se k účastníkům programu Office Insiders

Byly tyto informace užitečné?

Děkujeme vám za zpětnou vazbu.

Děkujeme vám za váš názor! Pravděpodobně bude užitečné, když vás spojíme s některým z našich agentů podpory Office.

×