Képoptimalizálás a SharePoint Online-ban

Egy weblap betöltődési sebessége a lap megjelenítéséhez szükséges valamennyi összetevő (képek, HTML, JavaScript, és CSS) együttes méretétől függ. A képekkel látványosabbá tehető a webhely, a méretük azonban befolyásolhatja a teljesítményt. A képek tömörítéssel és átméretezéssel történő optimalizálásával és az előre gyártott grafikai elemek használatával ellensúlyozhatja a nagy méretű képek hatását. SharePoint-képmegjelenítéseket használva feltölthet egyetlen nagy képet, és megjelenítheti a kép szakaszait, így az újbóli betöltés helyett lehetővé teszi az újrafelhasználását.

A képbetöltés felgyorsítása előre gyártott grafikai elemek gyűjteményével a SharePoint Online-ban

Az előre gyártott grafikai elemek (sprite-ok) gyűjteménye sok kisebb képet tartalmaz. CSS-stíluslap használatával kijelölheti az összetett kép egy elemét, és abszolút pozicionálással megjelenítheti a lap adott területén. Több kép betöltése helyett lényegében egyetlen képet mozgat a lapon, és ennek a képnek egy apró részletét teszi láthatóvá egy kis méretű ablakon keresztül azon a ponton, ahol az előre gyártott kép megfelelő része megjelenik a végfelhasználónak. A SharePoint Online előre gyártott képekkel jeleníti meg az spcommon.png gyűjteményben található különböző ikonokat.

A cikk tartalma:

  • Képtömörítés

  • Képoptimalizálás

  • SharePoint-képmegjelenítések

Képernyőkép: az spcommon gyűjtemény

Ez a módszer növeli a teljesítményt, mert a felhasználó csak egy képet tölt le sok helyett, és azt a képet a gyorsítótárba helyezve újra és újra felhasználja. Bár a kép nem feltétlenül marad a gyorsítótárban, ez a módszer sok kép helyett csak egyet használ, így csökkenti a kiszolgálónak küldött HTTP-kérések teljes számát, ezzel a lapbetöltési időt is. Ez tulajdonképpen a képkötegelés egy formája. Nagyon hasznos eljárás, ha a képek nem változnak gyakran, például ha ikonokról van szó, mint a fenti SharePoint-példában. A Web Essentials nevű külső, nyílt forráskódú, közösségi projekt segítségével könnyen megvalósíthatja ezt a Microsoft Visual Studióban. További információt a Kódtömörítés és kötegelés a SharePoint Online-ban című cikkben talál.

A lapbetöltés felgyorsítása képtömörítéssel és képoptimalizálással a SharePointban

A képtömörítés és a képoptimalizálás lényegileg a webhelyen használt képek fájlméretének csökkentését jelenti. A képméret csökkentésére gyakran az a legjobb módszer, ha a képet átméretezzük arra a maximális kiterjedésre, amekkorában a webhelyen látható lesz. Nincs értelme nagyobb képet használni, mint amekkora ténylegesen megjelenik. Egy képszerkesztő alkalmazásban gyorsan és egyszerűen csökkentheti a képek méretét, így gondoskodhat a megfelelő kiterjedésükről.

A képméret kialakítása után a következő lépés az optimális tömörítés elérése. A tömörítéshez és optimalizáláshoz különféle eszközök állnak rendelkezésre, így például a Fotótár és külső gyártók eszközei is. A tömörítés lényege a fájlméret lehető legnagyobb méretű csökkentése a végfelhasználók számára észrevehető minőségromlás nélkül. A tömörített fájlokat nagy felbontású kijelzőn tesztelve gondoskodjon arról, hogy megjelenésük ne veszítsen a minőségből.

A lapbetöltés felgyorsítása a SharePoint-képmegjelenítések alkalmazásával

A képmegjelenítés a SharePoint Online funkciója, amely lehetővé teszi különböző képverziók használatát előre megadott képméretek alapján. Ez különösen akkor fontos, ha a felhasználók is feltölthetnek képeket, vagy ha a webhelyen a CSS-stíluslap rögzíti a képek kiterjedését, azaz a szélességét és a magasságát. A kép akkor is teljes felbontásban töltődik be, ha a méretet a CSS-stíluslap rögzíti. Ebben az esetben képmegjelenítések használatával csökkenthető a fájlméret.

Megjegyzés: Megjelenítések csak akkor használhatók a SharePointban, ha a közzététel engedélyezve van. A közzétételt a Beállítások > Webhely beállításai > Webhelyszolgáltatások kezelése > SharePoint Server – közzététel beállítással engedélyezheti. A beállítás másképpen nem jelenik meg.

A képmegjelenítésen alapuló képátméretezés úgy működik, hogy a rendszer veszi a legkisebb beállított kiterjedést, akár a szélességet, akár a magasságot, majd ennek megfelelően átméretezi a képet (a másik kiterjedés a fix képarányok miatt automatikusan módosul). Alapértelmezés szerint a fennmaradó kiterjedéseknek megfelelően középről körülvágja a képet. Ha például megad egy 100 képpont széles és 50 képpont magas kiterjedést, és az eredeti kép 1000x800 képpont kiterjedésű, akkor a rendszer úgy méretezi át a képet, hogy a 800 képpont magasságot 50 képpontra állítja, az 1000 képpont szélességet pedig 62,5 képpontra csökkenti a kép középről számított körülvágásával.

A lépések viszonylag egyszerűek, de a képek csak akkor tudják használni a képmegjelenítéseket, ha azok a SharePoint-webhelyen a képek felvétele előtt már jelen vannak. Ezenkívül be kell kapcsolni a webhelycsoport szintjén a „SharePoint Server – közzétételi infrastruktúra”, a webhely szintjén pedig a „SharePoint Server – közzététel” funkciót.

Képmegjelenítés beállítása a lapbetöltés felgyorsításához

  1. Gondoskodjon arról, hogy az eljárás végrehajtásához használt felhasználói fiók legalább tervezési engedélyekkel rendelkezzen a webhelycsoport legfelső szintű webhelyén, és a webhely egy weblapon közzé legyen téve.

  2. Webböngészőben lépjen a közzétételi webhelycsoport legfelső szintű webhelyére.

  3. Válassza a Beállítások ikont.

  4. A Webhely beállításai lapon a Megjelenés és működés csoportban láthatók a beépített képmegjelenítések.

    Választhat egyet közülük, vagy a Képmegjelenítések hivatkozást választva létrehozhat egy újat.

    Képernyőkép: a Képmegjelenítések hivatkozás
  5. A Képmegjelenítések lapon válassza az Új elem hozzáadása hivatkozást.

    Képernyőkép: az Új elem hozzáadása hivatkozás
  6. Az Új képmegjelenítés lapon a Név mezőben adjon nevet a megjelenítésnek.

  7. A Szélesség és a Magasság szövegmezőbe írja be a megjelenítés szélességét és magasságát képpontban, majd válassza a Mentés gombot.

    Képernyőkép: a képmegjelenítés neve

Egyéni körülvágás alkalmazása képmegjelenítésekkel együtt a SharePointban

Alapértelmezés szerint a képmegjelenítés a kép közepéből készül. Az egyes képek megjelenítését a használni kívánt képrész körülvágásával módosíthatja. A körülvágást egyedileg, képmegjelenítésenként alkalmazhatja a képekre. A képek körülvágása felgyorsítja a lapbetöltést, mert a rendszer minden megjelenítéskor a SharePoint BLOB-gyorsítótárából hozza létre a képváltozatot. Ezzel a módszerrel csökkenthető a kiszolgáló terhelése, mert a kép átméretezése csak egyszer történik meg, és az eredmény utána többször megjeleníthető a végfelhasználóknak. A képmegjelenítések körülvágásáról ebben a képmegjelenítés körülvágásával foglalkozó szakaszban talál további információt.

Office-jártasság bővítése
Oktatóanyagok megismerése
Új szolgáltatások listájának lekérése
Részvétel az Office Insider programban

Hasznos volt az információ?

Köszönjük a visszajelzését!

Köszönjük visszajelzését. Jobbnak látjuk, ha az Office egyik támogatási szakemberéhez irányítjuk.

×