Kako pohitriti spletno stran?

Kako pohitriti spletno stran

Upam, da ste prebrali prvo objavo, zakaj sploh pospešiti spletne strani? Zdaj pa ugotovite, kako se na najpreprostejši način izogniti najpogostejšim in vseprisotnim napakam slabih oblikovalcev spletnih strani ali lastnikov, ki obvladajo najosnovnejše osnove ene od brezplačnih platform za izdelavo spletnih strani, kot je Wordpress, vendar niso strokovnjaki na tem področju. Vsekakor preberi omenjeni tekst, marsikaj ti bo postalo bolj jasno.

Velikost slike in hitrost spletne strani

Ojej, ko bi le vedeli, koliko lahko poveča hitrost spletne strani zaradi velikosti slike! Ena najslabših stvari, ki jih lahko naredite svoji spletni strani, je, da ji daste neoptimizirano podobo!Slika, ki je posneta iz vašega fotoaparata ali prenesena z interneta in ni prilagojena za prikaz na spletnih straneh. Takšne slike so najpogostejše slike za tisk in so povsem druga zgodba kot tista, ki jo potrebujemo za internet. Preprosto povedano – ni ga monitorja, ki bi prikazal toliko, kot je potrebno za tiskanje. Dati sliko v polni ločljivosti, pri 300 DPI, preveliko tako po širini kot po dolžini - je popolnoma nepotrebna stvar. Kot da bi vsak dan pripravljal obroke za deset ljudi, jedla pa bi dva. Tako se ob koncu dneva ali meseca vprašate – zakaj porabimo toliko za živila?! Torej - zakaj porabite toliko časa za promet in nalaganje? Zakaj zmanjšujete hitrost spletnega mesta?

Več o velikosti slike in hitrosti spletne strani

Ali ste vedeli, da lahko svojim spletnim stranem "ukažete", kakšno velikost slike naj naloži za katero napravo? Točno tako. Ni potrebe po mobilnem telefonu za nalaganje 1920 slikovnih pik široke slike, ko so celo iPodi in tablični računalniki dovolj široki pri 768 slikovnih pik? In verjemite mi, včasih na spletnih straneh vidim tudi slike velikosti 3000+ px. Zakaj?! Tako lahko na isti spletni strani z atributom "srcset" ugotovite, katero velikost naložiti v katero napravo. In naš CMS (sistem, ki omogoča spreminjanje vsebine) ter način, kako "popravimo" hitrost vaših spletnih strani, vam to samodejno omogoča!

Format slike in hitrost

Končnica, format ... kaj se skriva za vašim imenom. Format .jpg je še danes najpogosteje uporabljen za fotografije na internetu, a se sploh zavedate, da je napredek tehnologije spremenil tudi to? Formata .webp za fotografije in .webm za videoposnetke imata bistveno boljšo kompresijo (beri: promet, ki ga porabita, hitrost branja in "težo", ki jo zasedata na strežniku) kot klasična formata .jpg in .png ter se ne izgubi kvalitete!!! In ne prihranite le pri hitrosti spletnih strani, ampak tudi pri prometu, ki ga dosežete, torej pri ceni gostovanja spletnih strani ("gostovanje")

datoteke PDF.

Spet pridemo do razlike med tiskom in internetom. Zakaj bi nalagali velike datoteke .pdf, če jih lahko najprej stisnete na velikost, ki zadostuje za potrebe interneta? In če želite, da lahko vaši uporabniki natisnejo vašo datoteko *.pdf, jim lahko preprosto posredujete povezavo do formata za tiskanje.

Vsekakor pa, če dvomite o hitrosti spletnih strani – preverite na https://pagespeed.web.dev/ in verjamem, da bo (žal) upravičila vse vaše dvome! Oglejte si delovanje naših spletnih strani na spodnji sliki:

MI lahko naredimo, da VAŠA spletna mesta poletijo!

dokumenti MS in podobne različice

.doc(x) in podobni dokumenti običajno ne zavzamejo veliko prostora. Kaj pa, če vsebujejo slike? Zgodba se spremeni. Večja kot je slika, večji je vpliv na končno težo. Če niste vedeli, lahko velikost slike enostavno optimizirate tudi v takih dokumentih.

JavaScript in način nalaganja pomembno vplivata na hitrost spletnih strani

Ali ste vedeli, da lahko s stiskanjem datotek JavaScript prihranite do 80 % njihove velikosti? In da z določanjem načina, torej časa, ko se bodo naložile na spletne strani, vedno bolj pridobivate na hitrosti spletnih strani?

Datoteke CSS in hitrost spletne strani

Skratka, datoteke .css določajo, kako so prikazani elementi na vaših spletnih straneh. Barva, velikost, kompozicija, učinki,... Podobno kot v prejšnjem odstavku je neverjetno, koliko lahko prihranite pri nepotrebnih predmetih znotraj .css datotek in pri njihovem stiskanju.

.HTML in hitrost spletne strani

Spet - kompresija!!!

Predpomnilnik, predpomnilnik, pomnilnik, stiskanje - kaj je to?

Drug priročen način za pospešitev spletnih mest je datoteka .htaccess. Tam lahko rečete, da želite npr. stiskanje gzip.

Gostovanje spletnih strani

Seveda je tudi to ključni dejavnik. Katero od teh postavk podpira strežnik, ki gosti vaše spletno mesto? Kakšne so specifikacije vašega strežnika? Tako kot ni pomembno, na katerem (starem, slabem) računalniku poskušate delati in/ali poganjati program, si na enak način lahko predstavljate vpliv spletnega strežnika na hitrost nalaganja spletnih strani vaših uporabnikov.

Video vsebina

Se spomnite poglavja o slikah in strežniškem prometu? Vse to velja tudi za video formate, le da so zakoni večkrat močnejši! Koliko slik gre v en video?! Če že pošiljate video formate na vaš strežnik, jih naredite čim bolj stisnjene. Naj bodo postreženi v čim bolj stisnjenih oblikah. Idealno bi bilo, da jih najprej pošljete na platformo, kot je YouTube ali Vimeo, in jih naložite prek ifameov. Poleg tega, da sploh ne zapravljate svojega prometa z njihovim nalaganjem, lahko z znanjem programiranja poskrbite, da njihovo nalaganje sploh ne vpliva na hitrost nalaganja vaših spletnih strani!

Stiskanje Gzip

Skratka, stiskanje gzip je metoda, s katero omogočite stiskanje datotek, preden so poslane v brskalnike vaših obiskovalcev. Na primer če vaš obiskovalec od začetne strani zahteva pravih 500 kb podatkov, se mu bo naložilo manj kot 100 kb!

Primer, kako omogočiti gzip stiskanje datoteke .htaccess

# ZAČNI STISKANJE GZIP
mod_gzip_on Da
mod_gzip_dechunk Da
mod_gzip_item_include datoteka .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*

# KONEC STISKANJA GZIP

Predpomnjenje prek datoteke .htaccess

To je še ena tehnika, kako pospešiti spletna mesta z uporabo datotek .htaccess. Z njim določite čas poteka vaše vsebine.

Za lažjo predstavo si predstavljajte, da obiskovalec pride na vašo spletno stran ob 9. uri zjutraj in se vrne ob 5. uri popoldne. Namesto da bi dvakrat znova naložil isto stran, bo njegov brskalnik preveril, ali že obstaja predpomnjena različica, ki se bo seveda nalagala veliko hitreje.

Vnesite datoteko .htaccess za hitrejše nalaganje spletne strani:

# BEGIN Iztek glave
ExpiresActive On
ExpiresDefault "access plus 5 seconds"
ExpiresByType image/x-icon "access plus 2592000 seconds"
ExpiresByType image/jpeg "access plus 2592000 seconds"
ExpiresByType image/png "access plus 2592000 seconds"
ExpiresByType image/gif "access plus 2592000 seconds"ExpiresByType application/x-shockwave-flash "access plus
2592000 seconds"
ExpiresByType text/css "access plus 604800 seconds"
ExpiresByType text/javascript "access plus 216000 seconds"
ExpiresByType application/javascript "access plus 216000 seconds"
ExpiresByType application/x-javascript "access plus 216000 seconds"
ExpiresByType text/html "access plus 600 seconds"
ExpiresByType application/xhtml+xml "dostop plus 600 sekund"

# KONEC Poteče glave

"Hotlinking" ali nezakonit prenos vsebine spletne strani

Torej vse, kar svojim obiskovalcem posredujete prek datotek ali vsebine na tem strežniku, porabi vaš promet. Promet, ki ga plačate! Nekateri zelo brezobzirni uporabniki niti nočejo ukrasti vaših gradiv tako, da jih prenesejo na svoj računalnik in naložijo na svoje gostovanje – hitreje jim je, da postavijo neposredno povezavo do vašega gradiva in ga naložijo na svoje spletne strani. Uporabljajo vaš promet, ne njihov!

Tako lahko preprečite nepooblaščen prevzem svojih materialov:

RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://(www.)testurl.com/.*$
[NC]
RewriteRule
.(gif|jpg|jpeg|bmp|zip|rar|mp3|flv|swf|xml|php|png|css|pdf)$ - [F]

E pa moguće je čak i postaviti učitavanje neke svoje slike na njihovim web stranicama umjesto one koju kradljivci žele postaviti na svojim web stranicama :D

I opet, javite nam se bez ikakvih obaveza s vaše strane, javite već sada! Ne gubite vrijeme jer ni vaši posjetitelji ne gube svoje. A dok oni ne gube svoje vrijeme, vi gubite klijente! Bez ikakvih troškova, pogledat ćemo vašu web stranicu, dati vam konkretna rješanja kako ubrzati web stranicu i koji bi troškovi bilo oko toga. A dalje je na vama...