Optimizacija slika u sustavu SharePoint Online

Brzina učitavanja web-stranice ovisi o kombiniranoj veličini svih komponenti potrebnih za prikaz stranice, uključujući slike, HTML, JavaScript i CSS. Slike su odličan način da web-mjesto učinite privlačnijim, ali veličina može utjecati na performanse. Optimizacija slika sažimanjem i promjenom veličine te korištenjem sprajtova (animiranih malih grafičkih znakova) može neutralizirati učinke vrlo velikih slika. Prikazi slika sustava SharePoint omogućuju vam prijenos jedne velike slike i dijelova slike čime se omogućuje ponovno korištenje slike, odnosno nije je potrebno ponovno učitavati.

Korištenje sprajtova radi ubrzavanja učitavanja slike u sustavu SharePoint Online

Sprajt slike sadrži mnogo manjih slika. Pomoću CSS-a možete odabrati dio složene slike radi prikaza određenog dijela stranice s apsolutnim pozicioniranjem. Zapravo pomičete jednu sliku po stranici, a ne učitavate više slika te mali dio slike činite vidljivim kroz mali prozor u kojemu se potrebni dio slike sa sprajtovima prikazuje krajnjem korisniku. SharePoint Online koristi sprajtove za prikaz različitih ikona u sprajtu spcommon.png.

Što je obuhvaćeno ovim člankom

  • sažimanje slike

  • optimizacija slike

  • prikazi slika sustava SharePoint

Snimka zaslona datoteke spcommon

Na taj se način mogu potaknuti performanse jer preuzimate samo jednu sliku, a ne nekoliko te se ona sprema u predmemoriju i ponovno koristi. Čak i ako se slika ne spremi u predmemoriju, korištenjem jedne slike (a ne više njih) smanjuje se ukupni broj HTTP zahtjeva za poslužitelj, čime se smanjuje vrijeme učitavanja stranice. To je zapravo oblik grupiranja slika. Ta je tehnika vrlo korisna ako se slike ne mijenjaju često, na primjer ikone, kao što je prikazano u gore navedenom primjeru sustava SharePoint. Sada možete koristiti Web Essentials, projekt otvorenog koda treće strane u čijem je stvaranju sudjelovala zajednica, da biste to jednostavno postigli u programu Microsoft Visual Studio. Da biste saznali više, pročitajte članak Minifikacija i grupiranje u sustavu SharePoint Online.

Korištenje sažimanja slike i optimizacije radi ubrzavanja učitavanja slika u sustavu SharePoint

Sažimanje slike i optimizacija odnosi se na smanjenje veličine datoteke slika koje koristite na web-mjestu. Najbolja tehnika smanjenja veličine često je promjena veličine slike na maksimalne dimenzije koje će se prikazivati na web-mjestu. Besmisleno je imati sliku veću od one koja će se prikazivati. Provjera odgovarajućih dimenzija slika pomoću uređivača slika brz je i jednostavan način smanjivanja veličine stranice.

Kada slike budu odgovarajuće veličine, sljedeći je korak optimiziranje sažimanja tih slika. Dostupni su raznovrsni alati za sažimanje i optimizaciju, uključujući Galeriju fotografija i alate drugih proizvođača. Ključ sažimanja smanjenje je veličine datoteke što je više moguće bez gubitka vidljive kvalitete za krajnje korisnike. Obavezno testirajte sažete datoteke na zaslonu visoke razlučivosti da biste provjerili izgledaju li i dalje dobro.

Ubrzavanje preuzimanja stranice pomoću prikaza slika sustava SharePoint

Prikazi slika značajka su sustava SharePoint Online koja vam omogućuje pružanje različitih verzija slika na temelju unaprijed definiranih dimenzija slika. To je posebno važno kada se na web-mjestu nalazi slikovni sadržaj koji je korisnik generirao ili kada dimenzije slike, kao što su širina i visina, fiksno određuje CSS na web-mjestu. Sliku u punoj razlučivosti moguće je učitati čak i ako CSS fiksno određuje dimenzije slike. U tom je slučaju veličinu datoteke moguće smanjiti pomoću prikaza slika.

Napomena : Prikazi su dostupni za SharePoint samo kada je objavljivanje omogućeno. Objavljivanje možete omogućiti u odjeljku Postavke > Postavke web-mjesta > Upravljanje značajkama web-mjesta > Objavljivanje sustava SharePoint Server. Mogućnost se inače neće prikazati.

Promjena veličine pomoću prikaza slika funkcionira tako da koristi najmanju dimenziju koju definirate (širinu ili visinu), a zatim promijeni veličinu slike tako da se druga dimenzija automatski promijeni na temelju zaključanog omjera. Po zadanom će obrezati sliku od središta u skladu s preostalim dimenzijama. Ako, na primjer, definirate prikaz slike širine 100 piksela i visine 50 piksela, a izvorna je slika široka 1000 piksela i visoka 800 piksela, veličina će se promijeniti tako da 800 piksela postane 50, a 1000 piksela (sada 62,5 piksela) obrezat će se od središta slika.

Koraci su relativno jednostavni, ali da bi slike koristile prikaze, prikazi moraju biti na web-mjestu sustava SharePoint prije nego što dodate slike. Uz to, značajke Infrastruktura za objavljivanje u sustavu SharePoint Server (Razina zbirke web-mjesta) i Objavljivanje sustava SharePoint Server (Razina web-mjesta) moraju biti uključene.

Dodavanje prikaza slika radi ubrzavanja učitavanja stranica

  1. Provjerite ima li korisnički račun koji izvršava taj postupak dozvole za dizajn na najvišoj razini zbirke web-mjesta te objavljuje li se web-mjesto na web-stranici.

  2. U web-pregledniku idite na web-mjesto najviše razine zbirke web-mjesta za objavljivanje.

  3. Odaberite ikonu Postavke.

  4. Na stranici Postavke web-mjesta u odjeljku Izgled i dojam vidjet ćete ugrađene prikaze slika.

    Možete koristiti spremne prikaze ili odabrati Prikazi slika da biste stvorili novi.

    Snimka zaslona s prikazom prikaza slike
  5. Na stranici Prikaz slika odaberite Dodaj novu stavku.

    Novi okvir Komentari
  6. Na stranici Novi prikaz slike u okvir Naziv unesite naziv prikaza.

  7. U tekstne okvire Širina i Visina unesite širinu i visinu prikaza u pikselima, a zatim odaberite Spremi.

    Sinkronizirana mapa servisa OneDrive za tvrtke u mapi Favoriti u eksploreru datoteka

Prilagođeno obrezivanje s prikazima slika u sustavu SharePoint

Prikaz slike po zadanom se generira od središta slike. Prikaz slike možete prilagoditi za pojedinačne slike obrezivanjem dijela slike koji želite koristiti. Slike možete obrezivati pojedinačno, po prikazu. Obrezivanje slika ubrzava učitavanje stranice pomoću predmemorije bloga sustava SharePoint radi stvaranja verzije slike za svaki prikaz. Na taj se način opterećenje poslužitelja smanjuje jer se veličina slika mijenja samo jedanput, a onda je spremna za korištenje korisnika više puta. Da biste saznali više o obrezivanju prikaza slike, pročitajte članak Obrezivanje slike prikaza.

Proširite svoje vještine
Istražite osposobljavanje

Jesu li vam ove informacije bile korisne?

Hvala vam na povratnim informacijama!

Hvala vam na povratnim informacijama! Čini se da bi vam pomoglo kad bismo vas povezali s nekim od naših agenata podrške za Office.

×