Egy harmonikus weboldal elemei a színek, szövegek, képek. Ahhoz, hogy élvezetes legyen a weboldalunk a látogatók részére, képeket is hozzá kell adnunk. Számos online helyről le tudunk tölteni szabadon felhasználható képeket, ilyen a Pexels vagy a Pixabay is (mindig érdemes megnézni a kép letöltése előtt, hogy külön írnak e annak felhasználási feltételeiről).
Az ilyen oldalakról leltöltött képek nagyon jó minőségűek, a kép mérete 1-15 MB is lehet, ami egy weboldalra történő feltöltésre nem alkalmas a méretéből fakadóan, mert lassúvá teszi az adott weboldal betöltését.
Miért gond ha lassú lesz a betöltés? Mert elveszítheted a weboldalad látogatóinak nagy részét. Itt olvashatsz a 6 másodperces szabályról.
Megoldás: Át kell alakítanunk a képet, mielőtt azt még feltöltenénk a WordPress weboldalunkra.
Hogyan alakítsd át a képet a megfelelő méretre, hogy a WordPress weboldalad ne lassuljon be miatta? Megmutatjuk.
Az átalakításhoz egy ingyenes letölthető képszerkesztő programra lesz szükséged, ez esetben az IrfanView-re. Ez a program sok mindenre képes, de mi inkább arra használjuk, hogy jelentős mértékben csökkentsük a segítségével a képek méretét úgy, hogy az szemmel láthatóan ne veszítsen a minőségéből.
Az IrfanView megnyitása után a következő weboldal fogad. Ha nem tudod, hogy hány bit-es windows-al dolgozol, akkor válaszd a kék kerettel jelölt 32 bit-est. Kattints a 32 bit-el jelölt piros gombra a program letöltéséhez.
Megjegyzés: Ha a cikkeinkben szereplő képekre rákattintasz, akkor azok nagyob méretben is megjelennek.
Letöltés után pedig telepítsd a programot a következő módon:
1. Browse gombra kattintva ki tudod választani a telepítés helyét, majd kattints a Tovább gombra.
2. Kattintsz a Tovább gombra
3. Formátumok kiválasztása: Itt kattitns a Select all gombra majd a Tovább gombra.
4. Kattints a Tovább gombra.
Telepítés után ha a program elindult, nyugodtan bezárhatod.
Kép átalakítása az IrfanView program segítségével
Válaszd ki a számítógépeden az átalakítandó képet. Itt láthatod, hogy a mi esetünkben a kép mérete az átalakítás előtt 1863 KB, ami nagy méret, ezt kell sokkal kisebbre kell redukálnunk, anélkül, hogy a kép nagy mértékben veszítene a minőségéből.
Kattins a képre a jobb egérgombal, válaszd ki, hogy Társítás, majd IrfanView. Ezzel elindul a program a kiválasztott képpel.
Kép > Jobb egérgomb > Társítás > IrfanView
Így néz ki a program, benne a képünkkel. Ezt fogjuk, most nagyon egyszerűen átalakítani.
Egyszerűen nyomjunk egy CTRL + R billentyű kombinációt, ezzel megnyilik a kép méretező beállítás. Itt látjuk a kép eredeti méreteit és egyéb információkat.
A pirossal keretezett részben tudjuk a kép pixel méretét módosítani. Ha blog weboldalunk van, és cikken belüli képnek szeretnénk átalakítani, akkor elég az 1200 -at beírni oda (szélesség), a mellette szereplő magasság szám pedig automatikusan módosulni fog, azt nem kell megváltoztatni.
Minimum képméretek:
Blog cikkek képei: 1200 pixel szélesség
Háttérkép: 1600 pixel szélesség
Ha ezzel megvagyunk, akkor kattintsunk az OK gombra.
Ezzel a képünk mérete 1200 pixel szélességre redukálódott.
Most pedig a képet elmentjuk, ehhez nyomjuk meg a CTRL + S billentyű kombinációt. Itt tudjuk a kép minőségét módosítani a pirossal keretezett részben. Ennek megváltoztatása nagy mértékben járul hozzá a kép méretének csökkentésében, természetesen a minőség kárára. Minél alacsonyabbra számra állítjuk be (balra húzva), annál kisebb lesz a kép mérete (nem a pixel!, hanem a KB), annál rosszabb lesz a minőség is. Ezért javasolt a minimum 82 értéket beállítani a csúszka segítségével.
Íme a végeredmény. Az 1863 KB méretű képből 188 KB méret lett, ami közel a tizede az eredeti kép méretének. Nagy mértékű javulást jelent, hiszen a kisebb méretű képeket gyorsabban meg tudják jeleníteni a web böngészők, nem kell várni a képek betöltésével.
Mekkora a maximum méret, amit még nem rontja le a weboldal betöltési sebességet?
Ez több mindentől függ, mi azt szoktuk, mondani, hogy minél kisebb, annál jobb, de ne legyen 300 KB-nál nagyobb méretű.
Az IrfanView képszerkesztő program segítségével könnyedén csökkenthetőek a képek mérete, amivel a WordPress weboldalunk betöltési sebességét tudjuk növelni.
Ha tetszett a cikk, akkor kövess minket a Facebook oldalunkon is.
Lépésről lépésre felépített, azonnal használható tudásanyag cikkeink segítik a weblapod építését. Érted vagyunk, hogy egyszerűbb és hatékonyabb legyen a weblap építés.
További cikkek
Mi a webdesign és mire jó?
A webdesign felel a honlapunk kinézetérét és hangulatáért, értelmezhetőségéért. Grafikák, színek és betűk nélkül nem lennének szép weblapok. Ma már a weblapunk tervezéskor nem csak arra kell figyelünk, hogy az jól nézzen ki, hanem a...
Így használd a színeket a webdesign tervezéskor
A színek használata a legbonyolultabb feladat a honlapunk kinézetének megtervezésekor. Pl.: a túl sok szín összezavarja a felhasználókat. Fekete-fehér weblapot senki nem szeret nézegetni, ezért hogy élettel töltsük meg, színeket kell használni, de nem mindegy hogy...
Hogyan lesz felhasználóbarát és ezáltal hatékonyabb a honlapod? #1
Egy felhasználóbarát honlap esetén nem csak az esztétika, hanem a jól használhatóság is fontos. Nézd meg az Amazon honlapját. Megállapítható, hogy nem túl „dizájnos” viszont könnyen kezelhető, hamar el tudunk rajta igazodni. A könnyű kezelhetőség mellett a cég üzleti...