Optimalizace obrázků pro SharePoint Online

Rychlost načítání webové stránky závisí na kombinované velikosti všech komponent nutných k rendrování obrázku včetně obrázků, HTML, JavaScriptu a CSS. Obrázky představují skvělý způsob, jak vytvořit přitažlivější web, ale jejich snímky můžou mít dopad na výkon. Díky optimalizaci snímků pomocí komprese a změny velikosti a s použitím sprajtů můžete dopad velikosti velmi velkých obrázků vyrovnat. Když použijete verze obrázků (někdy označované taky jako rendry) na SharePointu, můžete nahrát jeden velký obrázek a zobrazit části tohoto obrázku, díky kterým bude možné opětovné použití (místo opakovaného nahrávání).

Použití sprajtů k zrychlení načítání obrázků na SharePointu online

Obrázkový sprajt (sprite) obsahuje mnoho menších obrázků. Pomocí šablon stylů CSS vyberete část složeného obrázku, která se má zobrazit na určité části stránky s absolutním umístěním. V podstatě přesouváte po stránce jeden obrázek (místo abyste načítali víc obrázků) a zviditelníte malou část daného obrázku pomocí okénka, kde se požadovaná část obrázkového sprajtu zobrazí koncovému uživateli. SharePoint Online používá k zobrazení svých různých ikon sprajty ve sprajtovém obrázku spcommon.png.

Jaké informace tady najdete

  • Komprese obrázku

  • Optimalizace obrázku

  • Verze obrázků na SharePointu

Snímek obrazovky spcommon

Může se tak zvýšit výkon, protože stáhnete místo několika obrázků jenom jeden a pak ho z mezipaměti opakovaně použijete. I když obrázek nezůstane v mezipaměti, snižuje tato metoda díky tomu, že máte místo několika obrázků jenom jeden, celkový počet žádostí HTTP na server. Tím se zkrátí doba načítání stránek. Je to skutečně forma sdružování obrázků. Tato technika je velmi užitečná v případě, že se obrázky příliš často nemění, například ikony – jak ukazuje příklad SharePointu uvedený nahoře. Můžete toho snadno dosáhnout v Microsoft Visual Studiu, když využijete komunitní projekt třetí strany typu open-source Web Essentials. Další informace najdete v článku Minifikace a sdružování v SharePointu Online.

Využití komprese a optimalizace obrázků ke zrychlení načítání stránek na SharePointu

Komprese a optimalizace obrázků znamená zmenšení velikosti souborů obrázků používaných na webu. Nejlepším postupem při zmenšení velikosti obrázku je změnit velikost obrázku na maximální rozměry, které budou uživatelé na webu zobrazovat. Nemá smysl, aby byl obrázek větší, než si ho bude kdokoli prohlížet. Když pomocí editoru obrázků zajistíte, aby měly obrázky správné velikosti, snadno a rychle tak zmenšíte velikost webové stránky.

Až budou mít obrázky správnou velikost, je potřeba udělat další krok – optimalizovat kompresi obrázků. Ke kompresi a optimalizaci můžete použít různé nástroje, jako třeba aplikaci Fotogalerie nebo nástroje třetích stran. Klíčem k efektivní kompresi je co největší zmenšení velikosti souboru bez ztráty kvality, kterou by koncoví uživatelé dokázali poznat. Komprimované soubory je potřeba otestovat na obrazovce s vysokým rozlišením, aby se zjistilo, jestli budou vypadat dobře.

Zrychlení stahování stránek pomocí sharepointových verzí obrázků

Verze obrázků jsou funkce ve službě SharePoint Online, která umožňuje poskytovat různé verze obrázků na základě předdefinovaných rozměrů obrázků. Zvlášť důležité je to v případech, kdy určitý obsah vytvářejí uživatelé nebo rozměry obrázků (šířka a výška) jsou na webu pevně nastavené šablonami stylů CSS. I když je obrázek pevně nastavený šablonou CSS, načte se v plném rozlišení. V takovém případě se dá velikost souboru zmenšit pomocí verzí obrázků.

Poznámka : Verze jsou k dispozici pro SharePoint, jenom když je povolené publikování. Můžete povolit publikování v části Nastavení > Nastavení webu > Spravovat funkce webu > Publikování na serveru SharePoint Server. Možnost se jinak nezobrazí.

Změna velikosti pomocí verzí obrázků funguje tak, že se vezme nejmenší definovaný rozměr (šířka nebo výška) a pak se velikost obrázku změní tak, aby se druhý rozměr automaticky změnil na základě uzamčeného poměru stran. Ve výchozím nastavení se obrázek ořízne ze středu podle zbývajících rozměrů. Pokud třeba definujete verzi o šířce 100px a výšce 50px a původní obrázek má šířku 1000px a výšku 800px, jeho velikost se změní tak, že z rozměru 800px teď bude 50px a rozměr 1000px (teď 62,5px) se ořízne ze středu obrázku.

Postup je poměrně jednoduchý, ale aby mohly obrázky používat verze, musí být verze na sharepointovém webu dřív, než tam přidáte obrázky. Kromě toho musíte mít zapnuté funkce Infrastruktura publikování serveru SharePoint Server (na úrovni kolekce webů) a Publikování na serveru SharePoint Server (na úrovni webu).

Přidání verze obrázku ke zrychlení načítání stránek

  1. Zajistěte, aby uživatelský účet provádějící tento postup měl na webu nejvyšší úrovně v kolekci webů minimálně oprávnění Návrh a aby se web publikoval na webovou stránku.

  2. Ve webovém prohlížeči přejděte na web nejvyšší úrovně z kolekce webů publikování.

  3. Zvolte ikonu Nastavení.

  4. Na stránce Nastavení webu v části Vzhled a chování uvidíte předdefinované verze obrázků.

    Můžete použít výchozí verze obrázků nebo zvolit Verze obrázků a vytvořit novou verzi.

    Snímek obrazovky rendru obrázku
  5. Na stránce Verze obrázků zvolte Přidat novou položku.

    Snímek obrazovky přidání nové položky
  6. Na stránce Nová verze obrázku zadejte do pole Název název nové verze.

  7. Do textových polí Šířka a Výška zadejte šířku a výšku verze v pixelech a zvolte Uložit.

    Snímek obrazovky názvu rendru obrázku

Vlastní oříznutí u verzí obrázků na SharePointu

Verze obrázku se standardně generuje ze středu obrázku. Verzi obrázku můžete pro jednotlivé obrázky upravit tak, aby se ořízla požadovaná část obrázku. Obrázky můžete oříznout jednotlivě, po verzích. Při oříznutí obrázků se zrychlí načítání stránek díky použití mezipaměti blogu SharePointu k vytvoření jednotlivých verzí obrázku. Tímto způsobem se sníží zatížení serveru, protože velikost obrázku se změní jenom jednou a pak může sloužit uživatelům víckrát. Další informace o tom, jak oříznout verzi obrázku, najdete v článku Oříznutí verze obrázku.

Rozšiřte své znalosti a dovednosti
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. Vypadá to, že bude užitečné, když vás spojíme s některým z našich agentů z podpory Office.

×