{"id":226986,"date":"2022-09-14T11:11:00","date_gmt":"2022-09-14T08:11:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=226986"},"modified":"2022-11-08T12:59:37","modified_gmt":"2022-11-08T09:59:37","slug":"kuidas-wordpressis-skaleeritud-pilte-teenindada","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/et\/kuidas-wordpressis-skaleeritud-pilte-teenindada\/","title":{"rendered":"Kuidas WordPressis skaleeritud pilte teenindada"},"content":{"rendered":"\n

On ilmne, et fotod on meie elu lahutamatu osa. J\u00e4relikult ei kujuta me ilma piltideta veebisaiti ettegi. Pildid meelitavad<\/strong> k\u00fclastajate vaadet ja aitavad korrastada saidi sisu. Pildid muudavad lehe huvitavaks, teaberikkaks ja parandavad kasutajakogemust.<\/p>\n

Liiga suured pildid m\u00f5jutavad negatiivselt veebisaidi toimivust<\/strong> ja pilte tuleks skaleerida vastavalt aktiivsele teemale. Need on veebisaidi olulised elemendid ja v\u00e4\u00e4rivad, et neid n\u00e4idatakse parimal v\u00f5imalikul viisil. V\u00e4ga oluline on skaleeritud piltide serveerimine WordPressi saidil.<\/p>\n

Skaleeritud piltide suurused kohanduvad \u00f5igeks suuruseks vastavalt HTML-is ja CSS-is m\u00e4\u00e4ratletule. Siiski ei p\u00f6\u00f6ra paljud veebimeistrid sellele olulisele kujundusdetailile t\u00e4helepanu. V\u00f5tke n\u00e4iteks 500 x 500 piksliga pilt 50 x 50 pisipildi jaoks. Veebibrauser peab pildi alla laadima ja selle suurust v\u00e4hendama, et seda saaks k\u00fclastajale kuvada. On selge, et see on ebat\u00f5hus ja aeglustab<\/strong> veebisaiti.<\/p>\n

Erinevus eraldusv\u00f5imes ei ole n\u00e4htav ja seet\u00f5ttu j\u00e4\u00e4b suurte piltide kaal sageli m\u00e4rkamatuks. Enamik inimesi pole isegi teadlikud, et see eraldusv\u00f5ime \u00fclekoormus p\u00f5hjustab probleeme ja probleem j\u00e4etakse lahendamata. Nad j\u00e4tavad probleemi brauseri enda hooleks.<\/p>\n

Miks pakkuda WordPressi saidil skaleeritud pilte?<\/h2>\n

\"Kuidas<\/a><\/p>\n

Skaleeritud piltide esitamise peamine p\u00f5hjus on see, et t\u00e4isk\u00f5rglahutusega pildid aeglustavad<\/strong> veebisaiti ja pikendavad laadimisaegu<\/strong>. Aeglane leht toob kaasa kehva kasutuskogemuse<\/strong> ning selle asemel, et j\u00e4\u00e4da ja tagasi tulla, nad lahkuvad ja j\u00e4\u00e4vad eemale. Kissmetricsi statistika n\u00e4itab, et lehtedel, mille laadimiseks kulub rohkem kui kolm sekundit, on suurem p\u00f5rkem\u00e4\u00e4r<\/strong>.<\/p>\n

Kui pildisuurused on veebisaidil optimeeritud, on laadimisajad l\u00fchemad<\/strong>. Suure t\u00f5en\u00e4osusega j\u00e4\u00e4vad inimesed veebisaidile kauemaks ja<\/strong> naasevad<\/strong> hiljem. See parandab SEO<\/strong> -d ja veebisaidi asetus t\u00f5useb<\/strong>.<\/p>\n

Suured pildid p\u00f5hjustavad erinevaid probleeme<\/h3>\n
    \n
  1. See suurendab pinget brauseri j\u00f5udlusele<\/strong>. Brauser peab t\u00e4itma t\u00e4iendavaid serverip\u00e4ringuid. See ei saa pilti kiiresti n\u00e4idata, kuid selle asemel kulub pildi suuruse muutmiseks aega ja ressursse. Raskete piltidega veebisaitide laadimine v\u00f5tab kauem aega.<\/li>\n
  2. Kui suuri k\u00f5rge eraldusv\u00f5imega pilte kuvatakse veebisaidil v\u00e4ikesena, raiskavad need aega ja laadivad alla andmeid<\/strong>. Seda n\u00e4iteks siis, kui mobiiltelefonist tehtud selfit kasutatakse t\u00f6\u00f6tlemata pisikese Gravatari jaoks.<\/li>\n<\/ol>\n

    Kuidas WordPressi veebisaitidel pilte skaleerida<\/h2>\n

    K\u00e4sitsi<\/h3>\n

    \"Kuidas<\/a><\/p>\n

    Alustuseks anal\u00fc\u00fcsige veebisaidil olevaid pilte, kasutades sellist t\u00f6\u00f6riista nagu GTMetrix.<\/strong> GTMetrix on j\u00f5udlusanal\u00fc\u00fcsi t\u00f6\u00f6riist, mille on v\u00e4lja t\u00f6\u00f6tanud GT.net. See ettev\u00f5te on kuulus kiiruse j\u00e4lgimise ja optimeerimise ning Pingdomi poolest. P\u00e4rast seda, kui GTMetrics veebisaiti anal\u00fc\u00fcsib, loob see aruande. See n\u00e4itab, millised probleemid<\/strong> leiti ja milliseid t\u00e4iustusi<\/strong> see soovitab.<\/p>\n

    Aruande \u00fclevaatamisel p\u00f6\u00f6rake erilist t\u00e4helepanu vahekaardile Struktuur<\/strong>. Sellel vahekaardil kl\u00f5psake nuppu \u00d5ige suurusega pildid. See kuvab vale suurusega piltide loendi.<\/p>\n

    WordPress ei v\u00e4henda v\u00f5imalusel pilte automaatselt, vaid lisab need saidile ilma t\u00f6\u00f6tlemata. Selle probleemi lahendamiseks on kaks v\u00f5imalust.<\/p>\n

    Isegi kui pistikprogrammide kasutamine ei ole soovitud viis, on muid v\u00f5imalusi. Esimene viis piltide skaleerimiseks on nende suurust k\u00e4sitsi reguleerida, kasutades fotoredaktorit, nagu Photoshop<\/strong>. V\u00f5ib tunduda, et see meetod on ebaefektiivne, kuid tegelikult pole see nii.<\/p>\n

    \"Kuidas<\/a><\/p>\n

    Photoshopis on peale pildi k\u00f5rguse ja laiuse reguleerimise rohkem v\u00f5imalusi.<\/strong> Teine asi, mida siin kontrollida, on pildi eraldusv\u00f5ime<\/strong>. Enamasti piisab veebirakenduste jaoks hea vaatamiskogemuse jaoks 72 PPI-st.<\/p>\n

    Teine on piltide skaleerimiseks pistikprogrammi kasutamine.<\/strong> See valik on lihtne ja kiire. WordPressil on selleks oma funktsioon srcset<\/strong>. See t\u00f6\u00f6riist v\u00f5ib teisendada graafikat, n\u00e4iteks pilte, tundlikeks failideks<\/strong>. Reageerivad pildid kohandatakse automaatselt erinevatele seadmetele ja ekraanisuurustele. Allpool on m\u00f5ned muud pistikprogrammid, mis teevad pildisuuruste v\u00e4hendamisel suurep\u00e4rast t\u00f6\u00f6d.<\/p>\n

    Optimole<\/h3>\n

    \"Kuidas<\/a><\/p>\n

    Suurep\u00e4rane t\u00f6\u00f6riist skaleeritud piltide esitamiseks on Optimole<\/strong>. See on WordPressi pistikprogramm, mis suudab erinevate seadmete jaoks piltide suurust muuta. See muudab automaatselt pildi optimaalset suurust, v\u00f5ttes aluseks erinevat t\u00fc\u00fcpi seadmeid. Tulemuseks on kvaliteetsed skaleeritud pildid<\/strong>.<\/p>\n

    Need on m\u00f5ned funktsioonid, mis muudavad Optimole huvitavaks valikuks:<\/p>\n