Divi 4.0 – régóta várt kreatív lehetőségek, egy kattintásnyira

Divi 4.0 – régóta várt kreatív lehetőségek, egy kattintásnyira

Szerző: | okt 17, 2019 | Divi, weboldalkészítés, wordpress, wordpress sablon

Már a délután folyamán láttam egy érdeklődő posztot egy Divi fejlesztőkből álló Facebook csoportban, hogy ki mennyire várja a 4.0-át… Egy vicces kommentnél persze nem is görgettem tovább – “Can’t wait to break my site..:D” – a lényeget megjegyeztem: hamarosan megérkezik a Divi sablon legújabb verziója. És nemcsak egy bug javítás (ahogy az egyébként hétről hétre, sőt napról napra jönni szokott, hála az Elegant Themes szorgos fejlesztői csapatának), hanem egy kompletten új verzió, sok újdonsággal, lehetőséggel, kreatív funkcióval. Legalábbis ezt lehetett remélni. Nézzük, beváltak-e a várakozásaim a “Sablonok frissítése” gomb megnyomása után.

Divi frissítés 4.0-ra

Divi 4.0 – az első benyomások

Természetesen ahogy ennek a rendkívül ígéretes WordPress sablonnak a legújabb változatát mélyebben megismerem, igyekszem majd a cikket frissíteni saját tapasztalataimmal. Egyelőre most az első benyomásokon és a legfontosabb újdonságokon szeretnék végigszaladni. Szóval rányomtam a frissítés gombra, és pikk-pakk, fél perc se telt bele, már a Divi 4.0-val futott a Weboldalkészítés Vállalkozásoknak weboldala.

Mindenekelőtt nézzük meg Nick Roach-nak, a Divi atyjának pár perces bemutató videóját. Sokminden már ebből a videóból egyértelmű lesz. (Egyébként bírom őt, szerény, mégis mindig nagy örömmel mutatja be a Divi új képességeit.)

Oldalgyorsaság, betöltődési idő

Miután frissítettem, egyből megnéztem a gtmetrix.com adatait, és azt találtam, hogy az előző, (nálam 3.29.3-as) verzióhoz képest a 4.0-ás Divi sablonnal átlagosan fél másodpercet gyorsult az oldalam betöltődése, szám szerint 2,9-3,5 másodpercről 2,3-2,4 másodpercre. Mivel többször is mértem, azt hiszem a gyorsabb betöltődés nem a véletlen műve, de persze bizonyítani ezt nehéz.

A weboldal GTmetrix értékei a Divi 4.0. témával, gyors betöltődés Divivel
A weboldal GTmetrix értékei a Divi 4.0. témával

Egyedi fejlécek és egyedi láblécek!

Aki ismeri a Divi témát, tudja, hogy a fejléc és a lábléc mindeddig kissé korlátolt volt testreszabhatóságban. Ha hihetünk a szemünknek (merthogy egyelőre még nem teszteltem, de hamarosan fogom!) akkor ez nagyot változott. Mutatok is pár példát a hivatalos bemutatóoldalról.

Fejléc demó 1  |  Fejléc demó 2  | Lábléc demó 1  |  Lábléc demó 2

Egyedi termékoldal-sablonok, poszt-sablonok…

…melyekkel például ilyen termékoldalakat alkothatunk. De éppenséggel ez is egy érdekes elrendezés. És ami az igazán lényeges ebben, hogy az eddig Page Builder lényegében Theme Builder-ré változott, nemcsak elnevezésében, hanem valóságosan is. Magyarul elég egyszer létrehoznunk egy termékoldal mintát és azt ráhúzhatjuk az oldalon lévő összes termékre. Vagy csak egy bizonyos kategóriára. És még folytathatnám.

Megjelent a Theme Builder menüpont
Megjelent a Theme Builder menüpont

Egyedi kategória oldalak

Ugyanez igaz az kategóriaoldalakra is. Innentől sokkal letisztultabban, egyedibb módon jeleníthetjük meg a kategóriákat, legyen szó termékkategóriákról, vagy a blogban lévő bejegyzéskategóriákról. Gondolom a címkékre ugyanez érvényes, bár erről nem találtam részleteket. Tehát, el lehet felejteni a régebbi WordPress verziókban és sablonokban szinte kötelező jobboldali oldalsávot a kategóriák esetében. Ez innentől választás kérdése. (Természetesen eddig is meg lehetett oldani, hogy másképp nézzen ki, de ez mostantól egyszerűbb lett.)

Nézzünk pár mintát a kategóriaoldalakra is.

Kategóriaoldal 1  |  Kategóriaoldal 2  |  Kategóriaoldal 3

A Theme Builder

Nálam üres. Lol.

üres Theme Builder a Divi 4.0.-ban

Először azt hittem, gyorsan rá is jöttem a hiba okára, ugyanis a Divi Support Center (oldalt a Divi-ből nyílik) azt jelezte, hogy bizonyos rendszer értékek nem jók: pl. post_max_size, a memory_limit vagy a max_execution_time.

Ezeket mind át is írtam a tárhelyen a public-html mappában található .htaccess fájlban és utána a Support Center voilá, mindent értéket rendben talált. De ettől még a Theme Builder menüpont nem akart működni. Ürítettem a Cache-t is. Semmi.

Aztán a cikk írása közben eszembe jutott, hogy frissítem a Divi-t egy másik oldalamon is és megnézem hátha ott megjelenik valami. Így is történt és láss csodát: ott nemcsak egy üres oldal fogadott a Theme Builder menüpontra kattintva. Ki is próbáltam az egyedi oldalminták létrehozását és bár nem jutottam a végére, az elképzelés jónak tűnik.

Divi Theme Builder
Divi 4.0. – Theme Builder

A tanulság kendőzetlenül

(Néha tényleg annyira az orrunk előtt van a hiba… Megnéztem a biztonság kedvéért, és jaj, igen. Bizony, a WordPress nem a legfrissebb verzióval futott. Frissítettem, most már ok a Theme Builder betöltése.)

Egyedi 404 oldalak

Aki esetleg nincs képben ezzel, a 404-es oldalak arra valók, hogyha egy nem létező címre (például korábban létező, de azóta megszűnt aloldalra) jutunk egy weboldalon belül, akkor a 404-es hibaüzenetet kapjuk, vagy magyarul kiírva: “A keresett oldal nem található.” Ennek persze az igényesebb weboldalakon egyedi megjelenése van, de a fejlesztőknek nem mindig jut eszébe vagy nem mindig jut rá idő. Magamnak is kiosztok egy ejnyebejnyét, mert előfordul velem is, hogy elmulasztom. Nyilván a legtöbb esetben egy honlapot böngésző felhasználó nem, vagy csak ritkán találkozik vele, azért érdemes megalkotni valami ötletesre. Azt hiszem nemsokára végigmegyek az utóbbi munkákon és létrehozok egy ilyet, ahol esetleg elmaradt…

Szóval ennek a hibaoldalnak a design-ját elvileg most már lehet a Divi-n belül is szerkeszteni, egyszerűen. Persze aki akarta, korábban is meg tudta oldani, még bővítmények is voltak rá, de így most lényegesen egyszerűsödött a helyzet.

Írásom legfontosabb forrása, az Elegant Themes oldalán megjelent Divi 4.0-át bemutató cikk itt érhető el.

Egyedi fejléc létrehozása a Theme Builder-rel

Ahogy ígértem, a cikk folytatódik. Szóval a Theme Builderen belül, az elején meg kell szokni a struktúrát. A baloldali tömb az alapértelmezett sablon, ha ezt megváltoztatjuk, akkor az az egész oldalra kiterjedően megváltoztatja az adott weboldalrészletet (a fejlécet, a törzset, vagy a láblécet).

Ettől jobbra számtalan új oldalsablont létrehozhatunk (Add New Template), melyeket bárhogyan alkalmazhatunk: beállíthatjuk, hogy az új sablon az összes oldalra, csak a főoldalra, vagy csak egy adott aloldalra legyen érvényes. Ha szeretnénk alkalmazhatjuk csak egy-egy adott kategóriaoldalon, vagy címkeoldalon, tehát számtalan variációban. Az összes létező oldal fel van sorolva és ezek közül akár egyenként is kiválaszthatjuk, hogy mely oldalakon jelenjen meg az általunk készített, egyedi fejléc, vagy épp lábléc.

Amikor hozzáadunk egy új fejlécet, azt úgy képzeljük el, mintha nulláról húznánk fel egy Divi oldalt a korábbi Page Builderrel, csak éppen nincs a felső menüsáv sem. Mert azt is mi tervezzük oszloponként, modulonként (van választható Menü modul is.)

Összedobtam egy saját menüt

Végül mutatok valami kézzelfogható eredményt is, hogy látszódjon, mire jó konkrétan az egyedi fejléc készítő (Custom Header). Egy kiegészítő sávot tettem a főoldalam menüjébe, melyen felhívom a látogatók figyelmét egy új ajánlatomra. A személyes WordPress oktatás szolgáltatásomat szeretném kiemelni ily módon, de csak a főoldalon. Most elsőre egy ilyet alkottam, de még csiszolni kell úgy érzem.

És akkor ha már itt tartunk… az ajánlatról pár sorban: egy 2,5-3 órás nagyon tömör, privát weboldalkészítő műhelymunkát kínálok, melyen átadok minden tudást és eszközt ahhoz, hogy valaki vállalkozóként elinduljon és érvényesüljön az online térben. Mindezt egy nagyon kedvező áron.

A Divi kipróbálása, megvásárlása

Ha megtetszett a Divi 4.0 (egyébként már az előzőekkel is rengeteg mindent lehetett…) és kipróbálnád, írj nekem és lehetőséget biztosítok Neked egy teszt aloldalamon! Én majdnem mindegyik weboldalam elkészítéséhez ezt a témát használom, mert jól testreszabható, sok praktikus eszközével sok értékes munkaidő megtakarítható.

Ha pedig meg is vásárolnád, akkor is jó helyen jársz, mert az Elegant Themes partnereként mind az örökös licensz (Lifetime Access) mind az éves licensz (Yearly Access) árából 20% kedvezményt tudok biztosítani. Nekem se és senki másnak ne hagyd, hogy rábeszéljen bármire, amiben nem vagy biztos, inkább kérdezz előtte! Simán elképzelhető, hogy semmi szükséged nincs a Divi-re. De az is lehet, hogy igen. Ha elhatároztad, hogy szeretnéd megvenni a sablont, őszintén úgy gondolom, hogy ez egy kedvező ajánlat. (A kedvezmény a linkre kattintva elérhető). Természetesen ezzel mindenki jól jár: te is, én is és a fejlesztői csapat is.

Betöltési sebesség javítása WordPress-ben

Betöltési sebesség javítása WordPress-ben

Szerző: | okt 12, 2019 | Divi, felhasználói élmény, keresőoptimalizálás, weboldal karbantartás, weboldalkészítés, wordpress

Vendégposzt a betöltési sebesség gyorsításáról, Jobbágy András tollából.

Senki sem szereti a lassú weboldalakat. Az interneten mindenki türelmetlen, még türelmetlenebb, mint az offline világban. A kutatások szerint elég pár pillanatnyi késés, és az átlagos felhasználó már is hajlamos továbblépni a honlapról.

Ennek ellenére nagyon sok honlaptulajdonos nem foglalkozik a betöltési sebességgel. Talán mert remélik, hogy a szuper tartalom és szép webdesign majd kárpótolja a felhasználót. Vagy csak egyszerűen nincsenek tisztában, mennyire fontos kritérium a gyorsaság egy weboldalnál.

Szeretném végigjárni ebben a cikkben, hogy miért életbevágó kérdés minden honlap számára a minél rövidebb betöltési idő. A cikk második felében konkrét tippeket is adok ahhoz, hogyan tudod gyorsítani a WordPress weboldalad. (Ha még csak most ismerkedsz a WordPress világával, ajánlom a honlapkészítés kezdőknek cikkemet.)

A betöltési sebesség és az online marketing

A betöltési sebesség nem csupán felhasználói élmény (UX), hanem kőkeményen online marketing kérdés is. Elsőre talán nem egyértelmű a kapcsolat a kettő között. A kulcs a Google algoritmusának működésében rejlik.

A Google 2010-ben jelentette be, hogy a rangsorolási metódusában fontos szerepet kap a weboldal sebesség is. Egyszerűen azért, mert a gyorsan betöltődő weboldal elégedetté teszi a felhasználókat. A Google pedig elégedett felhasználókat szeretne, hiszen a jövőben is piacvezető akar maradni a keresőmotorok között.

A gyors betöltési sebesség ezért segíthet előrébb jutni a Google keresőjében. Vagyis pozitív hatással van a honlapod online marketingjére is.

Ebből következik, hogy a lassú betöltődés viszont árt a weboldaladnak. Rontja a helyezésedet a keresőben, miközben megfojtja a felhasználói élményt is. Egy lekérésekre lassan reagáló honlapon az emberek kevesebb időt hajlamosak eltölteni, és sokkal magasabb lesz a visszafordulási arány. Ráadásul a hosszas betöltés tönkreteszi a konverziót is.

Egy, a legnagyobb webáruházak teljesítményét vizsgáló 2017-es tanulmány szerint minden 100 milliszekundumos (0,1 másodperc!) késés a betöltési sebességben hét százalékos esést jelenthet a konverziós rátában. Kettő másodperces késés pedig akár a visszafordulási arány 103 százalékos emelkedésével járhat! Elég sokkoló adat itt nálunk, a szégyenletesen lassú webáruházak* országában.
A betöltési sebesség tehát kulcskérdés, ha sikeresek akarunk lenni az e-kereskedelemben, vagy bármilyen más online üzletágban.

Mennyi az ideális betöltési sebesség?

Az ideális betöltési sebesség nagyjából 2-5 másodperc között van, azzal a megkötéssel, hogy a felmérések szerint a felhasználók 40-53 százaléka elhagy egy olyan weboldalt, ami nem töltődik be három másodperc alatt. Két másodperc felett pedig már minden másodperc a visszafordulási arány növekedésével jár. A felhasználók 47 százaléka asztali és számítógépen ráadásul két másodpercnél is rövidebb betöltési időt vár el.

Vagyis, ha nem akarod, hogy a weboldaladat a felhasználók tekintélyes része dühösen hagyja el, próbáld legalább három, de inkább két másodperc körül/alatt tartani a betöltési sebességet.

5 másodperces weboldal betöltődés WordPressen már határeset.

Egy 5 másodperces oldalbetöltődés már határesetnek számít – vannak akik nem várják meg és “lepattannak”.

Honnan tudom, hogy mennyire gyors a honlapom?

Az oldalsebesség mérésére több ingyenes eszköz is létezik. Használhatod például a GTmetrix vagy a Dotcom-monitor tesztjét. Az előbbi jellemzője, hogy rengeteg tippet ad a weboldal sebesség növelésére, az utóbbié pedig, hogy a világ 24 különböző pontjáról futtatja lesz a tesztet, ezért nagyon jó megoldás, ha a nemzetközi piacra szeretnél betörni a weboldaladdal.

Az én személyes kedvencem a Google saját sebesség tesztje (Ez még pontosabban fogalmazva a weboldal “teljesítményét” méri, melynek természetesen fontos része a sebesség is). Egy nullától százig terjedő skálán osztályozza a weboldalakat, és külön eredményt ad meg az asztali és a mobilos nézetre. Érdemes figyelembe venni a teszt javaslatait, mert ha követjük őket, nagyon szép eredményeket lehet elérni egy átlagos WordPress weboldallal is.

Egy tipp a Google sebesség teszt használatához: alapvetően nem az abszolút eredmény a fontos, tehát önmagában nem az, hogy 65, 70 vagy 82 pontot kaptál. De azt azért mindenképpen ajánlom, hogy a fent már részletezett okok miatt igyekezz három másodperc alatt tartani a betöltési időt.

Amire inkább figyelned kell, hogy a versenytársaidhoz képest legyél tartósan jobb a betöltési sebesség terén, mert ez komoly előnyt jelenthet neked a keresőben. Ha a konkurens weblapok 40 pontot kapnak a teszten, a tied szerezzen legalább 55 pontot. Ha hetvenet, akkor a tied legyen 80 felett, és így tovább. És most lássuk, mit tehetsz, hogy szuper gyors legyen a honlapod.

Betöltési sebesség: az alapok

Az első, és legfontosabb, hogy az alapok rendben legyenek, mert megfelelő üzemeltetési környezet nélkül akármit csinálsz, mindig lassú lesz a weboldalad. Mit értek ez alatt?

  • Jó tárhely
  • Jó sablon
  • Rendszeresen karbantartott és frissített eszközök

Kezdjük a tárhellyel. Tele az internet magyar és külföldi szolgáltatók ajánlataival, de egyáltalán nem egyszerű feladat igazán jót választani közülük, pláne ha gyorsat akarunk. Sokszor sajnos csak utólag derül ki, hogy a papíron remek választásnak tűnő szolgáltatás lassú tárhelyet ad.
Általánosságban elmondható, hogy az olcsó (30-40 ezer forint/év alatt) szegmensben nagyon könnyű rossz szolgáltatásba belefutni. Rossz alatt nem azt értem, hogy neked kell foglalkozni a sebesség optimalizációval, hanem azt, hogy bármit is csinálsz, mindig lassú marad a honlapod. A lassú tárhely jele, amikor a Google tesztje tartósan nagyon magas, több másodperces értéket ad meg a szerver válaszidejére (TTFB). Ilyenkor általában a szolgáltatóváltás hoz csak érdemi eredményt.

Amennyiben szeretnél biztosra menni, érdemes drágább szolgáltatást választani, például egy jó managed hosting szolgáltatást, ami leveszi a válladról az összes tárhellyel kapcsolatos terhet. Ha sok-sok ezer látogatód van, vagy ennyire számítasz, válassz virtuális dedikált szervert (VPS). Webáruház esetén keress direkt erre specializálódott tárhelyet.

Viszont ha csak egy átlagos forgalmú (havi 5000 látogató alatt) weboldalad van, és szívesen foglalkozol legalább alapszinten a tárhellyel kapcsolatos tennivalókkal, például a sebesség optimalizációval is, vagy csak nem akarsz havi szinten sok ezer forintot elkölteni tárhelyre, akkor nyugodtan próbálj ki több egyszerű osztott tárhelyet. Lehet, hogy nem elsőre, de előbb-utóbb találni fogsz olyat, ami passzol az igényeidhez.

Ha már van egy jó tárhelyed, szükséged lesz még egy kiváló minőségű WordPress sablonra.
Amennyiben pénzt akarsz keresni a honlapoddal, vagy egyszerűen csak nem akarsz kockáztatni, mindenképpen válassz prémium (fizetős) sablont.

Személyes tapasztalatom alapján a Divit, a StudioPress termékeit, valamint az Oxygent tudom ajánlani. Mindegyiknél alapvető fejlesztési szempont a gyorsaság, bármelyikkel jó eredményeket lehet elérni a sebesség optimalizálás területén (is).

És végül nem szabad megfeledkezni a rendszeres karbantartás fontosságáról sem. Hiába választottál szuper tárhelyet és kiváló minőségű sablont, hiába döntöttél körültekintően arról, hogy milyen bővítményeket (plugin) telepítesz a honlapodra, ha nem figyelsz a frissítésekre, az egész fabatkát sem fog érni fél-egy év múlva.

A hanyagul, vagy sehogy karbantartott weboldal egy idő után belassul, és működési zavarok jelentkeznek. Végül a honlap szép csendben kileheli a lelkét – általában mindig a legrosszabb pillanatban.

Hat módszer WordPress weboldalak gyorsítására

Ha a fentiek rendben vannak, de továbbra sem vagy megelégedve a weboldalad sebességével, akkor még mindig tudsz mit tenni. Mutatok néhány eszközt / módszert, amivel a személyes tapasztalatom szerint sokat lehet javítani a betöltési sebességen.

1. GZIP tömörítés beállítása

Ez azért lényeges, mert ha tömörítve szolgálja ki a szerver a honlapodat, a felhasználóknak sokkal kisebb adatmennyiséget kell letölteniük, amikor a weboldalra kattintanak. Kisebb adatmennyiség pedig egyenlő a gyorsabb lekéréssel.
Ha a tárhelyed online kezelőfelülete cPanel (ez a leggyakoribb megoldás), akkor a Gzip tömörítést a Szoftver >> Webhely optimalizáció >> Az összes tartalom tömörítése úton keresztül tudod beállítani. A Gzip tömörítést tudja emellett szinte az összes elterjedt cache bővítmény (például a WP Fastest Cache és a W3 Total Cache) is.

2. Legfrissebb PHP verzió beállítása

A PHP egy nagyon népszerű, nyílt forráskódú, szerver oldali webes programnyelv, ezen íródott a WordPress magja is. Nagyon nem mindegy, hogy a PHP melyik verziója fut a tárhelyeden.
Sok hazai tárhelyszolgáltató a már teljesen elavultnak számító 5.6-os verziót használja alapbeállításként. A WordPress viszont már csak a 7-es verziót támogatja, ami sokkal-sokkal gyorsabb, mint a régebbi változatok.
A PHP verziót a cPanelen a Multi PHPManager >> PHP verzió beállítása útvonalon állítható át. Válaszd a lehető legfrissebb verziót, ami jelenleg (2019 őszén) a 7.3-as.

3. Képek optimalizálása

Rengeteg weboldal azért nagyon lassú, mert tele van rakva szép nagy, több megás képekkel, amiket aztán csak vért izzadva tudnak betölteni a böngészők. A megoldás szerencsére egyszerű: tömöríteni kell a képeket.
Ezt megteheted felöltés előtt online eszközökkel, jó tapasztalataim vannak például a JPEG Optimizer, a Compressor.io vagy a Compress PNG webes alkalmazással. (De a TinyPNG is egy régi jó bevált oldal képek tömörítésére.)

TinyPNG, képtömörítés

A TinyPNG oldalon egyszerűen csak a “Fogd és vidd” módszerrel kell a tömörítendő képeket az ablakra húzni.

Feltöltés után is tömörítheted a képeket bővítményekkel. Ilyen plugin például az Imagify, havi 25 MB-ot tömöríthetsz vele ingyenesen.

Tartsd a képek méretét 200 kB alatt.

Elsőre talán nem hiszed, de 200 kB igazából tényleg mindenre untig elég lesz. Sőt, legtöbbször sokkal kisebb méretű képek is bőven élvezhetőek, még nagyobb (pl. 2000 x 1000 pixeles) méretben is.

4. Lusta betöltés alkalmazása

Hatásos és nagyon egyszerű trükk a “lusta betöltés”. A lényege, hogy a weboldal lekérésekor elsőre csak azok a “hajtás feletti” (above the fold) tartalmak töltődnek be, amelyek görgetés nélkül, egyből megjelennek a böngészőben a felhasználó szemei előtt.
A honlap többi, “hajtás alatti” (below the fold) része csupán akkor töltődik le, amikor a felhasználó odagörget. Ezzel csökkenteni lehet az egyidejű HTTP lekérések számát, az eredmény pedig egy gyorsabb honlap lesz.
A lusta betöltést könnyen beállíthatod az úgynevezett Lazy Load bővítményekkel. A kedvencem a képek, videók és iFrame-k késleltetett betöltésére fejlesztett Lazy Load by WP Rocket alkalmazás. Villám gyorsan lehet konfigurálni és nagyon hatékony.

5. Gyorsítótárazás (cache)

A rövid betöltési idő elérésének egyik legfontosabb eszköze a hatékony gyorsítótárazás (cache). A lényege, hogy amikor egy felhasználó a weboldaladra kattint, a böngésző gyorsítótára lementi a honlap statikus, nem változó részeit, így a legközelebbi látogatáskor már csak a változó, dinamikus elemeket kell újból letöltenie. A betöltési sebesség ezáltal sokkal jobb lesz – de csak akkor, ha jól van beállítva a gyorsítótár-házirend.
A leghatékonyabb megoldás, ha a tárhelyhez tartozik szerver oldali cache szolgáltatás. Ezt azonban csak a drágább szolgáltatók tudják. A másik megoldás egy cache bővítmény telepítése.
A cache bővítményeket alapvetően két “iskolába” lehet kategorizálni kezelési bonyolultság szerint. Léteznek nagyon egyszerűen beállítható és kezelhető pluginok, ilyen az ingyenes  WP Fastest Cache vagy a fizetős WP Rocket. Előnyük, hogy minimális háttértudás szükséges csupán a konfigurálásukhoz, néhány lehetőségből választhatunk, és kész is vagyunk.
Általában kicsit hatékonyabbak az olyan belemenősebb, sokkal több választást felajánló bővítmények, mint az ingyenes W3 Total Cache, vagy a magyar fejlesztésű, fizetős Swift Performance (van ingyenes verziója is). Főleg az előbbinél pepecs munka a helyes konfiguráció megtalálása, de ha sikerül, nagyon szép eredményt lehet elérni vele.

Swift Performance plugin admin nézete

A Swift Performance plugin admin felülete

6. Adatbázis takarítás

A WordPress weboldalak minden tartalmat és beállítást MySQL adatbázis táblákban tárolnak. Az adatbázisban nyomot hagy minden változtatás, bejegyzés módosítás, telepítés és törlés, stb. Olyan ez, mint a por lakásban, rendszeres takarítás nélkül egy idő után mindent belep. A “teleporolt” adatbázis pedig belassul, növeli a betöltési időt.

Az adatbázis kitakarításához egy sor bővítményt használhatsz. A legjobb talán a WP-Optimize. Pofon egyszerű a kezelése, csupán a WordPress admin kezelőfelületen a WP-Optimize >> Database menüpontban rá kell nyomnod a Run all selected optimizations lehetőségre, és megvárni, amíg végigfut a folyamat.

Érdemes ezt pár havonta elvégezni, főleg, ha gyakran adsz hozzá új tartalmat a honlapodhoz, például blogot írsz. Egyet nem szabad elfelejteni: készíts mindig biztonsági mentést az adatbázis karbantartása előtt!

Összegzés

Ha az összes, fent részletezett megoldáson végigmentél, a WordPress honlapod mostanra biztosan sokkal gyorsabb lett, mint eredetileg volt. Gratulálok! Amennyiben kérdésed van, vagy segítségre van szükséged, nyugodtan írj hozzászólást.

Írta: Jobbágy András, a Honlapszaki.hu tulajdonosa és bloggere.

* 2 példa rendkívül gyenge Google PageSpeed Insights értékekre a hazai webáruházak világából: itt  és itt…

Hogyan bánj a fényképekkel egy WordPress weboldalon?

Hogyan bánj a fényképekkel egy WordPress weboldalon?

Szerző: | Már 20, 2019 | képek, wordpress

A következő írás egy vendégcikk Verdes Tamás tollából. Személyesen egy SEO Meetup-on találkoztunk pár hónapja, ő elő is adott a találkozón. Beszédében, írásaiban érződik a segítőkészség és az igényesség. Ebben a cikkben összefoglalja, hogy miért fontos a képek használata WordPress weboldalakon, és hogyan érdemes bánni velük.

A weboldalunkon használt fényképek nagyban befolyásolják honlapunk forgalmát és a felhasználói élményt. Az igényes képkezeléssel különleges, egyedi benyomást tehetsz az olvasódra, és a honlapod keresőoptimalizálásában is előre léphetsz.

Használj képeket!

Aranyszabály, hogy legyenek képek a honlapodon. Sajnos ez nem mindenkinek magától értetődő, ezért fontos hangsúlyozni. A fényképeket is közlő blogok, honlapok minden teszten jobban teljesítenek, az olvasók is több időt töltenek rajtuk. Mi, emberek, szeretjük a képeket, és önkéntelenül rájuk pillantunk. A képek komplex jelentést közvetítenek, leegyszerűsítik és megfoghatóvá teszik a dolgokat, és érzelmeket is közvetítenek. Ugyanez érvényes a Google Cégem profilokra, melyeknek a képek szintén fontos alkotóelemei. Röviden: használj képeket!

Használj egyedi képeket!

Egyedi képek használatával kiemelkedhetsz a tömegből. Mert stock-fotókat mindenki le tud tölteni, de egyedi képeket már nem mindenki tud készíteni. Pedig egyszerű. Íme néhány módszer, amihez nem kell profi fotóművésznek lenni:
• készíthetsz saját képeket a mobiloddal vagy a fényképezőgépeddel, majd ezeket beteheted a bejegyzéseidhez;
• letölthetsz stockfotókat, és ezekre tehetsz egyedi kézjegyet, aláírást, szöveget;
• használhatod minden képhez ugyanazt a szűrőt, ezzel egységessé téve a képeidet;
• rajzolhatsz, festhetsz te magad is, ha van rá időd és kedved.

A lényeg az, hogy minden képen legyen ott a kézjegyed: egy aláírás, egy jel, akármi, ami egyértelműen rád és a weboldaladra utal. És mindenképpen legyen rajta a márkaneved és a weboldalad URL-címe!
A képek szerkesztéséhez nem kell fizetős eszközöket vásárolnod. Filtereket, feliratokat, és további rengeteg szerkesztést el tudsz végezni online képszerkesztő programokkal (Canva, Befunky, Crello stb.). Ezek legtöbbje ingyenes, és egy átlagos céges blog számára szinte korlátlan lehetőségeket kínál. Lehetővé teszik számodra, hogy egyedi képeket hozz létre.

figyelemfelkeltő képek használata Lehet akár antipatikus is a kép. De ha van benne valami egyéni, emlékezni fognak rád.

Az egyedi képek hatalmas előnye, hogy a Google képkeresője meg fogja találni őket. Ellentétben a stockfotókkal. Mert azokról tudja, hogy ugyanaz a fénykép több ezer weboldalon bukkan fel. Ezért semmi értelme találatot csinálni belőlük, mert az olvasónak sem jelentenek semmit.

egy arc Nem egy ismeretlen cégtől, hanem egy embertől fogunk vásárolni. (A képen látható személy csak egy példa, nem ismerem.)

Az egyedi képek legfontosabbika a cég vagy vállalkozás munkatársainak arcképe. Senki nem akar egy arctalan céggel szerződni. Tulajdonképpen teljesen mindegy, hogy ki szeret és ki nem szeret fényképet közzétenni a honlapján (sokan nem szeretnek). De aki az interneten vállalkozik, annak tudomásul kell vennie: ha nem mutatja meg az arcát, kevesebb ügyfele lesz.

Használj érthető, olvasható, látható képeket!

A képeknek ugyanúgy olvashatónak kell lenniük, mint a szövegeknek. Ez korántsem magától értetődő. A legfontosabb, hogy a képi látvány igazodjon a szöveges tartalomhoz. Ha kertépítő cég weboldaláról van szó, akkor kert vagy fű legyen a képen. Ha ügyvéd weboldalról van szó, akkor legyen benne valami, ami az ügyvédi tevékenységre utal.

Az egyszerűség verhetetlen. Az egyszerűség verhetetlen.

Sokan tartanak attól, hogy a közhelysség csapdájába esnek – például, hogy ügyvédi irodájukat Justicia istennő szobrával illusztrálják. És igen, ez egy közhely. De sokkal jobb közhelyesnek lenni, mint érthetetlennek. Személyes tapasztalatom, hogy a közhelyek jobban működnek, mint a túlságosan kreatív, érthetetlen képi megoldások.

Az ökölszbály ennyi: ha 10 ismerősödből 10 meg tudja mondani a címlapképről, hogy miről szól a vállalkozásod, remek képet választottál. Minél többen esnek gondolkodóba, annál rosszabb a kép, és annál nagyobb a veszélye, hogy vevőket fogsz veszíteni.

Keresőoptimalizáld és méretezd a képeket!

A képeket ugyanúgy keresőoptimalizáljuk, mint az írást vagy az egész weboldalt. Ennek több, egyaránt fontos szabálya van.

képek keresőoptimalizálása, fontos teendők lépések, image seo Mindig add meg a szöveges tartalmakat a képhez!

A túlságosan nagy képek lassítják az oldal betöltését, rontják a felhasználói élményt, és hátrafelé csúsztatják a weboldalt a keresőben. Ezért törekedj rá, hogy 200 KB-nál nagyobb fényképet ne tölts fel a honlapodra! Legyen minél kevesebb KB a kép, és persze maradjon éles, élvezhető. Képek átméretezéséhez rengeteg eszköz közül választhatsz.
Ha a képet 200 KB közelébe tömörítetted, további teendőid is vannak.

• A fájl neve legyen beszédes. DSC73548.jpg helyett budapest-hidjai.jpg. A névben csak kisbetűket, kötőjelet és ékezet nélküli betűket használj! Ezzzel érthetővé teszed a file-t a Google számára. És garantálod, hogy az ékezetes karakterek ne akadályozzák a képek betöltését a régebbi készülékeken.
• A képekhez, ha egy mód van rá, adj feliratot! Ez a kép alá írt rövid, egymondatos tartalom, ami kiegészíti vagy maragyázza a kép jelentését.
• A képhez adj alternatív szöveget (helyettesítő szövegnek is mondjuk)! Az angol megfelelője az alternativ text vagy alt text. Eredetileg látássérültek számára fejlesztették ki, és a Google komoly SEO-faktorrá avatta. Hiba kihagyni. Az alternatív szövegre írd rá vagy a tartalom kulcsszavát vagy azt, amit a képen látunk!
• Az oldaltérképek tartalmazzák a fényképekre vonatkozó információkat! A korszerű oldaltérképek nem listázzák külön a képeket, de számon tartják, hogy egy-egy tartalomhoz vagy cikkhez hány fénykép társul. Ebből is látszik, hogy a képeknek jelentős SEO-értékük van. Ha a WordPress honlapodon a Yoast SEO bővítményt használod, nyugodt lehetsz. A bővítmény katalógusba rendezi a képeket is.

Képek tesztelése és javítása a Google PageSpeed Insights segítségével

A Google PageSpeed Insights értékelése A Google PageSpeed Insights értékelése

Saját honlapunkon könnyedén ellenőrizhetjük a képek teljesítményét. Ehhez a Google PageSpeed Insights eszközt használjuk.
A képen láthatjuk, hogy a garden-kerteszet.hu weboldal 50%-os értéket kapott a teszten. Ez önmagában nem jelent sem rosszat, sem jót. Érdemes megnéznünk azonban, hogy a sebesség csökkenéséért mennyiben felelősek a képek, és mit tehetünk ennek érdekében.
Három javaslatot ad számunkra a Google eszköze. A képek file-formátumainak módosítását, a képek kódolásának rendberakását és a képek leméretezését.


Javaslatok a Google PageSpeed Insights eszköztől a képekre vonatkozóan Javaslatok a Google PageSpeed Insights eszköztől a képekre vonatkozóan

Ezek közül az elsőt el is felejthetjük. Közel másfél órás kutatás után sem találtam olyan eszközt, ami JPEG 2000, JPEG XR vagy WebP formátumba konvertálta volna a képeket. A fizetős PhotoShop sem rendelkezik ezzel az opcióval. Úgy látszik, ezek a formátumok valóban a következő generációra várnak. (Ha te találtál rá megoldást, kérlek, egy kommentben jelezd nekünk).
A képek megfelelő kódolása azt jelenti, hogy a weboldal akkora képméretet tölt be, amekkora az adott eszközhöz szükséges. Itt nem ez történik. Túlságosan nagy pixelszélességű képeket tettek fel az oldalra, és bizony ezek töltődnek be mobilon is. Ez komoly hiba. Azzal védekezhetünk ellenük, ha prémium minőségű WordPress sablonokat használunk. A többi sablonnal lehet, hogy szerencsénk lesz, lehet, hogy nem.
A képek leméretezése egyszerű és fontos dolog. Egy weboldal vagy egy aloldal nem lehet nagyobb 2 MB-nál. Mert ekkor sok eszközön túl lassan töltődik be, és az olvasó  elkattint, mert azt hiszi, az oldal megszűnt vagy nem üzemel. Ezért kulcskérdés a képek méretének leszorítása. Ne tévesszen meg az, hogy a te gépeden gyorsan jön be az oldal, a Google PageSpeed eszköz nem hazudik. A te böngésződ ugyanis elmentette a képeket a gyorsítótárban, de az első alkalommal érkező látogatódnak nem. És alapvetően neki szól a weboldal. Tehát ha nagyok a képek, azt le kell méretezni.

+1: A WordPress szerkesztőben rejlő új lehetőségek

A WordPress weboldalak alapértelmezett bejegyzés-szerekesztője különösen fontos számunkra. A 2018-tól bevezetett új Gutenberg szerkesztő a szöveges tartalom képi támogatását új szintre emelte. Ma már nem csak arra van lehetőség, hogy képeket és videókat adjunk a cikkünkhöz. A Gutenberg lehetővé teszi, hogy a képek elrendezése révén sajátos képi világot szőjünk a tartalomba anélkül, hogy kódolnunk kellene.
A Gutenberg kép blokkja az alábbi funkciókkal rendelkezik:
• Képek feltöltése teljes szélességben (site-wide képek használata);
• Képek feltöltése a tartalomból kilógó szélességben;
• Képek egymás mellé rendezése galéria funkció használata nélkül
A lehetőségek szemléltetésére érdemes megnézni a StudioPress által létrehozott,  a Gutenbergre optimalizált sablon és bővítmény demó oldalát. A sablon és a bővítmény egyébként ingyenesen letölthető, és atombiztos alapot ad egy weboldalhoz.
Amit itt látsz, az a WordPress piacvezető cégeinek (WP Engine és StudioPress) egyedi fejlesztése. Azért is érdemes megnézni és tesztelni, mert nagyon úgy tűnik, hogy ebbe az irányba akarják tovább fejleszteni a WordPresst. Egy nagyon letisztult, a tartalomra és a képekre fókuszáló vizuális világ körvonalazódik. És ez nem véletlen: minél egyszerűbb egy oldal, minél tisztábban olvasható a szöveg, annál jobban lehet vele pénzt csinálni.

A képek és a weboldal üzleti sikere

Egy weboldal üzleti sikerét a tartalom és a stratégia dönti el. A keresőoptimalizálás sikere sem a képeken és fotókon fog múlni önmagában. Tehát nem kell túldimenzionálni a képekkel való munkát. Inkább írj 10 minőségi, pontosan optimalizált cikket egy-egy suta képpel, mint egyetlen cikket 10 hiperszuper fotóval. De ha már képeket teszel fel, figyelj arra, hogy ne a képek (vagy azok mérete) miatt váljon elérhetetlenné a tartalom. És ha egy mód van rá, kerüld a jellegtelen, gagyi képek használatát. Ha teheted, saját blogod készítése során már az indulástól fogva fordíts gondot a képek kulturált és kreatív használatára!

Ha jelentős mennyiségű tartalmat állítasz elő, a képekre való odafigyelés mindenképpen meg fog térülni. Mert a Google szépen lassan listázni kezdi az egyedi képeidet a képkeresőben. És az olvasók is szépen lassan megismerik, megszokják azt, hogy a te honlapodon egy csak rád jellemző vizuális világ fogadja őket. Ha pedig ez megtörtént, akkor a képekkel – pont annyira, amennyire érdemes – hozzájárultál ahhoz, hogy építsd és ápold a saját márkádat. Ezt a munkát nagyon kevesen végzik el az interneten.

Szerző: Verdes Tamás

Weboldal karbantartás: szükséges?

Weboldal karbantartás: szükséges?

Szerző: | nov 12, 2017 | weboldal karbantartás, wordpress

Weboldal karbantartás: szükséges?

Weboldal karbantartás: minek?

A következő néhány bekezdés részben azoknak szól, akikben egyáltalán felmerül a fenti kérdés és nem tiszta, hogy mi célt szolgál a weboldal karbantartás, részben pedig a “csináld magad” vállalkozóknak, akik szeretnék átlátni, hogy a különféle munkálatokat milyen eszközökkel, hogyan érdemes megoldani. Igyekszem röviden és közérthetően elmagyarázni, miért elengedhetetlen honlapunk karbantartása. 

Belemegyünk a részletekbe is, hogyha saját kezébe venné ezt a feladatot, akkor tudja, milyen eszközöket érdemes használni: megmutatom nekem milyen programok váltak be és milyen beállításokra érdemes odafigyelni. Fontos: én a WordPress motort használom minden weboldalam elkészítéséhez, így írásaimban mindig erről a rendszerről van szó.

Mottó: Egy honlap üzemeltetése hasonlatos egy autó fenntartásához: tehet nagy szolgálatot számunkra, ha kihasználjuk a képességeit. Ám ha csak a “garázsban” pihen, és nem használjuk, lehet egy felesleges luxuskiadás is.

A biztonság

Ez a weboldal karbantartás legerősebb indítéka, mind közül a legfontosabb szempont. A weboldal karbantartás idejének fele lényegében ez. De miért is? Gondoljon csak bele, hetekig-hónapokig dolgozik a weboldalán, (vagy kiszervezte a munkát minimum 100.000 Ft-ért) és aztán egyszercsak hopp, feltörték. A belefektetett munka volt, nincs. És az a helyzet, hogy ez jópárszor megtörtént eset. Hálistennek nem velem. Aztán, ha kíváncsiságból felnéz Youtube-ra, vagy rákeres a Google-ben, láthatja, hogy tucatszámra lehet találni oktatóvideókat, oktatóanyagokat, hogy hogyan törjünk fel weboldalakat. Ezzel csak azért érdemes tisztában lenni, hogy maga a hacker-jelenség is létezik. És talán jó eséllyel nem az Ön weblapja lesz az elsődleges célpontja a hackereknek, de sosem lehet tudni. Ha van rá bármi okuk, akkor mindenféle módot be fognak vetni, hogy feltörjék. Úgyhogy ennek az esélyét kell a weboldal karbantartás során minimalizálni. És szerencsére sok jó megoldás létezik erre.

Felhasználói élmény 

Ez a fogalom az utóbbi években egyre fontosabbá vált. A Google azokat a weboldalakat díjazza melyeken a felhasználók könnyen eligazodnak, megtalálják rajta amit keresnek, egyszóval hasznos számukra. Számos olyan feladat van, amivel mindenképpen foglalkoznunk kell, ha javítani szeretnénk a honlap könnyű, egyszerű böngészhetőségén.

Az egyik legfontosabb tényező a weboldal gyorsasága. Amellett, hogy a honlapunk betöltődési sebessége a Google egyik fontos rangsorolási szempontja, a felhasználóink sem böngészik szívesen az oldalunkat, ha sokat kell várni. A felgyorsult világban egyre kevesebb figyelmet áldoznak az emberek bármire, ezért kulcsfontosságú, hogy gyorsan, hatékonyan tudják használni a weboldalunkat. Fontos emellett, hogy weboldalunk átlátható legyen: ne legyen túlzsúfolva és mindenki találja meg rajta ami keres.

“Szükséges rossz” vagy haszna is van?

A weboldal karbantartást talán egy “szükséges rossznak” gondolják néha a honlaptulajdonosok.

“Fel kéne rakni valamit a honlapra, hogy történjen már valami ott is…”  

– hangzik a már jól ismert frázis, de az érzés mögötte a “muszáj”, nem a lelkesedés. Pedig ha tudnánk, hogy hosszútávon (1-2 év) mekkora előnyt tudunk kovácsolni egy rendszeresen frissített, újdonságokkal teli, naprakész honlappal… Nem lenne kérdés hogy azonnal elkezdjük a munkát. Sokan ugyanis nem gondolnak bele, de például szoros összefüggés van a weboldal frissítése, szerkesztése és a keresőoptimalizálás között is: minél gyakrabban észleli a Google a változásokat a honlapon, a későbbiekben annál jobban odafigyel majd a honlapra és ezáltal egy Google által jónak értékelt tartalom gyorsabban jelenik majd meg az előkelő találati helyeken.

De ami még fontosabb, hogy a rendszeres új tartalmak, egy adott témában, kiemelik a weboldalt a többi “átlagos” honlap közül. Arról nem vagyok meggyőződve, hogy a weboldal változásainak gyakorisága közvetlenül hat az oldal “erősségére”, de nagy valószínűség szerint igen, számít az oldalunk keresőben elfoglalt pozíciójánál az is, hogy mennyire sűrűn változik a weboldal tartalma. Persze, a titkos Google keresőalgoritmus is évente több mint százszor változik, ember legyen a talpán, aki biztosat ki mer jelenteni. Ha a weboldal változásának gyakorisága talán kisebb, a weboldal gyors betöltődési sebessége viszont biztosan nagyobb súllyal nyom a latba. Na de ennél jobban nem megyek bele a keresőoptimalizálás mélységeibe, erről később még bővebben írok.

“Ami nem emelkedik, az süllyed…”

Közhelygyanús a mondás, de az az igazság, hogy nincs ez másképp a weboldalunkkal sem. Nem hiszek a stagnálásban: valami vagy fejlődik vagy lemarad, idejét múlttá válik. És a weboldal karbantartás esetében is: ha nem haladunk a korral és fejlesztünk mindig valamit az oldalon, akkor veszít a viszonylagos értékéből, mert sok más honlapon megcsinálják majd azokat a fejlesztéseket, amit mi nem. És igen, idővel minden honlap elavul.

Szégyellni való honlapok

Magyarországon egy 2017. szeptemberi adat szerint 1.185.087 regisztrált vállalkozás működik. Ebből körülbelül 400.000-nek van honlapja. Önmagában ez is elképesztő, hogy 2017-ben még ennyien nem tartják fontosnak, hogy vállalkozásukkal jelen legyenek az interneten. De amit mondani szeretnék, hogy gyakran a meglévők között is látni weboldalakat, amik nem közvetítenek mást a cégről mint: “átlagosak, középszerűek vagyunk, ne várj sokat tőlünk…”Ha pedig a látszat ezt mutatja, miért lenne más a tartalom? Az ellenkezője is igaz persze: vannak cégek, akiknek a csillogó-villogó modern weboldala mögött egy gyenge tartalom vagy szolgáltatás rejlik. De ez attól még nem jelenti azt, hogy a weboldalunk megjelenésével, tartalmával nem érdemes foglalkozni.

Van az az állapot, amikor már szinte jobban járunk egy új weboldal létrehozásával, mint a meglévőnek az átalakításával. És mennyibe fog kerülni az új honlap? Valószínűleg sokkal többe, mintha rászántunk volna havi 1-2 munkaórát vagy az 7900 Ft karbantartási költséget. (Már ennyiért elérhető nálunk egy weboldal alapszintű karbantartása. Ha érdekel, kattints ide a részletekért!)

Technikai rész

A WordPress frissítése

wordpress frissítése, frissítés elérhető, frissítés most, wordpress screenshot

Miket kell megtenni egy weboldal biztonságához? A WordPress esetében rendszeresen jönnek ki a rendszerfrissítések, melyek elég gyakran biztonsági réseket is betömnek. Ez mindig azt jelenti, hogy “az éppen előző rendszerben” még jó eséllyel volt egy  sebezhető pont. (Ugyan nem mindegyik frissítés biztonsági jellegű, gyakran ez az új verzió megjelenésének fő oka.) Valószínű, hogy a legfrissebb verzióban is van, de az majd csak később fog kiderülni. Ez tehát azt jelenti hogy érdemes rendszeresen frissíteni a WordPresst. Az aktuális WordPress verzió a WordPress hivatalos magyar oldaláról tölthető le, de a karbantartás során elég ha a honlap tetején megkeressük a “Frissítés most” gombot. Fontos: a WordPress frissítése előtt mindig készítsünk egy biztonsági mentést az oldalunkról. Erről nemsokára szó lesz, addig is, jegyezzük meg erre a feladatra az UpdraftsPlus nevű plugint.

A bővítmények frissítése

A honlap működését segítő bővítményekhez (más szóval plugin-ekhez) is rendszeresen megjelennek frissítések, melyeket a Vezérlőpult / Bővítmények fül alatt találhatunk meg. A fülön lévő szám mutatja, hogy hány bővítményhez érhető el jelenleg frissítés. A frissítések előtt érdemes megnézni a frissítés részleteit, ugyanis gyakran semmi jelentősége nincsen a frissebb verziónak, viszont lehet, hogy még nem kompatibilis a jelenlegi WordPress verziónkkal. Az én gyakorlatom az, hogy pár hetet mindig várok a frissítés előtt, hiszen ennyi idő alatt általában ki szoktak derülni az apróbb működési hibák, (bugok). Ezután már nyugodt szívvel nyomok rá az “Automatikus frissítés” gombra.

Ha a frissítéseket rendszeresen megcsináljuk, már egy fontos lépést megtettünk a weboldal biztonsága felé. De van még elég teendő. Menjünk tovább.

Biztonsági bővítmények

Számos plugin létezik, mely a weboldal védelmére szolgál. Ezek közül én a Wordfence-t emelném ki, mert nagyon elégedett vagyok vele. Ugyan nem próbáltam ki minden hasonló ilyen plugint – és biztos, hogy van még sok hasonlóan jó biztonsági bővítmény WordPresshez – úgy vagyok vele, hogy ha valami igazán jól működik, akkor minek próbálgassak másmilyet?

Wordfence

wordfence scan képernyőfotó, képernyőmentés, honlap biztonsági vizsgálat, weboldal biztonság, weboldal karbantartás

A cég “laboratóriumában” naponta frissül a káros kódok, vírusok, helyek nyilvántartása, amiket automatikusan blokkol a rendszer. Automatikusan letiltásra kerülnek azok az IP címek, ahonnan a támadásokat érzékeli a plugin, így megkímél ezzel sok más – a Wordfence hálózatában lévő – honlapot is egy esetleges későbbi támadás kockázatától.

Táblázat mutatja a biztonsági bővítmény felületén belül, hogy kik léptek be sikeresen az oldalra, illetve ami talán érdekesebb, hogy kiknek nem sikerült ugyanez, milyen felhasználónévvel próbálkoztak, percre pontosan mikor történt az eset és hogy milyen IP címről jött a kísérlet. Ezek az adatok sokat segíthetnek egy gyanús felhasználó kiszűrésében.

A Wordfence pluginban az egyik kedvenc funkcióm a “Scan”. Ez lényegében minden lehetséges hibát végignéz az oldalon, de talán a legfontosabb az a felismerő-képessége, hogy az eredeti wordpress könyvtárhoz képest a fájlok módosultak-e. Ha talál ilyet a rendszer, akkor meg is lehet nézni, hol és mi változott. És így bukkanhatunk könnyedén a gyanús kódokra, vírusokra és spamekre is. Már ha vannak… Egy “egészséges” honlapon nem fog találni ilyet a program.

Tapasztaltam párszor, hogy pl. a wp-config.php fájlt gyanúsnak vélte a szkennelő, mert a fájl angol változatát tekintette eredetinek és mivel a honlapom magyar nyelvű volt (tehát néhány sor is magyarul volt a fájlban), a program változást észlelt az angol nyelvű verzióhoz képest. De szerencsére van olyan lehetőség, hogy a későbbiekben hagyja figyelmen kívül ezt a fájlt, így nem figyelmeztet többször feleslegesen.

A Wordfence súlyos hibának veszi azt is, ha nem a legfrissebb WordPress verziót használjuk. Ugye emlékszik? A cikk elején, a WordPress frissítése részben volt szó erről. Persze teljesen rendben van, ha pár hetet várunk a frissítés előtt, sőt talán érdemes is, ezalatt általában a főbb hibák javításra kerülnek. Pl. egy WordPress 4.9.2-es verzió már biztos, hogy megbízhatóbb lesz mint a 4.9.

wordpress frissítés, biztonsági mentés, wordpress weboldal karbantartás

A Wordfence beállításait egy másik cikkben fogom részletesebben bemutatni, ez csak egy ízelítő volt, hogy lássuk, a weboldal biztonságához nagyban hozzátesz egy ilyen plugin.

 

Biztonsági mentések

Ugyan a Wordfence egy rendkívül jól használható biztonsági bővítmény, ettől függetlenül nagyon merész lenne azt állítani, hogy az összes hackertámadás százszázalékosan kivédhető. Éppen ezért, és más okokból is, elengedhetetlen hogy weboldalunkról rendszeresen biztonsági mentést készítsünk. Így ha neadjisten bármi történne a honlapunkkal, a fontos adataink nem tűnnek el, sőt könnyedén vissza tudjuk állítani az eredeti / előző állapotot.

Jópár tárhelyszolgáltató ugyan végez biztonsági mentéseket, de általában csak külön díjért állítanak vissza korábbi állapotokat, ha bármi elromlik. Érdemes tehát ezt a feladatot is a kezünkbe vennünk vagy a sok más teendő mellé kiszervezni egy kedvező havidíjért a weboldal karbantartó számára.

wordpress weboldal karbantartás, updraftsplus biztonsági mentés wordpress oldalon, biztonsági mentések, updraftsplus

A biztonsági mentésekre én az UpdraftsPlus nevű plugint javaslom. Egyik nagy előnye, hogy felhő alapú biztonsági mentéseket lehet vele végezni, tehát nem a számítógépünk tárhelyét foglaljuk el a fájlokkal, hanem a “felhőben” tárolhatjuk az adatokat. Például, a weboldalunk, az UpdraftsPlus segítségével, automatikusan egy Google fiókba (Google Drive szolgáltatás) továbbítja a weboldalunk összes tartalmát, beállítását. Be lehet állítani hogy csak a sablonról / pluginekről / adatbázisról készüljenek biztonsági mentések.

A bővítménnyel beállíthatjuk hogy automatikus biztonsági mentések készüljenek havi, heti, vagy akár napi rendszerességgel, anélkül, hogy hozzányúlnánk. Természetesen valahol az adatokat tárolni kell, és egy bizonyos adatmennyiség felett oda kell figyelnünk, hogy hol van elég rendelkezésre álló tárhelyünk. A google Drive pl. ingyenesen 15 GB adatot enged tárolni. Ezen felül már fizetni kell az extra tárhelyért, bár ez kisebb honlapoknál általában néhány évig biztosan elég.

A weboldal gyorsítása

A weboldal gyorsítása egy külön tudomány, de érdemes olyan szinten értenünk, hogy akárcsak pár másodpercet is le tudjunk faragni a betöltődési időből. A 4-5 másodperc alatt betöltődő oldalak még elfogadhatók (bár az ideális az 1-2-3 mp lenne), az efölöttieket viszont már erősen ajánlott javítani. Gyors megoldásként szolgál a WP-Rocket nevű bővítmény, melyen néhány beállítást elvégezve gyakran 1-2 másodpercet is javul a honlapunk gyorsasága. (Ennek a pluginnak a beállításait egy másik cikkben fogom bemutatni.) Természetesen még sok más teendőnk is van, ha gyorsítani szeretnénk a honlapunkat: az egyik legfontosabb a képeink méretének optimalizálása. Erre egy kiváló online eszköz a tinypng. Igaz, hogy max. 5 mb-os képeket tudunk optimalizálni, de ez általában elég is. A lényeg: a program a képminőség megtartása mellett drasztikusan lecsökkenti a kép méretét. Egy tipikus példa: ha például “bedobok a gépbe” egy 3 mb-os képet, gyakran egy 4-500 kb-os verzió “jön ki”. Szóval általában egy 60-70%-os méretcsökkenést tud produkálni a program, ami pl. 8-10 képnél már sok-sok megabájtot és ezzel együtt másodpercet jelent…

Összefoglalás

Ahogy a bevezető mottóban már említettem, egy honlap üzemeltetése olyan mint egy autó fenntartása. Hozhat sok hasznot is, termelhet sok bevételt a vállalkozás számára, ha használjuk és jól használjuk. De előfordulhat, hogy az év legtöbb napján csak a garázsban áll kihasználatlanul, miközben fizetjük rá az adót ( = a tárhely költséget, domain név díját), a javítási költségeket (a weboldal karbantartás díját), a téli-nyári gumi szetteket (egy új marketingszoftvert vásárolunk a csodát várva…) és még ki tudja mi mindent.

Egy weboldal karbantartásának és üzemeltetésének van költsége: vagy a saját ráfordított időnk (sok-sok munkaóra amíg megtanuljuk mit is csináljunk, utána havi min. 1-2 óra / hó), vagy amennyiért a weboldal karbantartó elvállalja a honlapot. Nálunk a kezdőcsomag már havi 7900 Forinttól elérhető, amibe az elérhetőség mellett a rendszeres frissítések, biztonsági felügyelet és biztonsági mentések foglaltatnak. Aki blogbejegyzést szeretne feltölteni rendszeres időközönként, annak pedig az asszisztens csomag vagy a Haladó csomag való.

Írhatunk honlapunkra évente egy cikket, vagy feltölthetünk évente néhány fotót, videót, netán egy új szolgáltatást… Vagy megtehetjük mindezeket havonta, hetente is. Csak rajtunk múlik, mennyi energiát teszünk bele és így mennyit tudunk kivenni a weboldalunkból.

Természetesen lehet, csak az a célunk a honlappal, hogy egy stílusos “névjegykártyaként” funkcionáljon a neten, minden más feladattól mentesen. Idővel azonban ezeknek a weboldalaknak is idejét múlttá válik a motorja, a kinézete, esetleg a tartalmi elemei is. Érdemes tehát bizonyos időközönként ezeket is megvizsgálni és szükség szerint fejleszteni honlapunkat. Ha rendszeresen foglalkozunk a weboldallal, akkor az naprakész lesz, azt közvetíti, sugározza a nagyvilágba, hogy tulajdonosa komolyan veszi azt, amit csinál, és élen jár az adott területen. Ha pedig rendszeresen új tartalmak is megjelennek az oldalon, akkor pedig mind a Google robot (ez térképezi fel és az eredmények alapján rangosorolja az oldalakat) mind a felhasználók pozitívan értékelik majd az adott céget. (Ezek gyakran teljes munkanapokat is igénybe vehetnek, de érdemes hosszútávon gondolkozni! Vegye kezébe ezeket a feladatokat, higgye el, hogy hosszútávon meg fog térülni.

Végezetül köszönöm, hogy megtisztelt figyelmével és elolvasta gondolataimat. Ajánlom figyelmébe a különböző weboldal karbantartási csomagjainkat. Azok a teendők, melyek feltétlenül szükségesek egy weboldal kiszámítható, biztonságos működéséhez, minden csomagban megtalálhatók, az árkülönbség elsősorban a munkaóráktól, az elérhetőségtől és a néhány extra igénytől függ.

Sok sikert a vállalkozásához, 

Bognár Balázs

 

10 éves az Elegant Themes, a Divi sablon fejlesztője

10 éves az Elegant Themes, a Divi sablon fejlesztője

Szerző: | máj 5, 2017 | Divi, weboldalkészítés, wordpress, wordpress sablon

10 éves az Elegant Themes, a Divi sablon fejlesztője

10 éves születésnapját ünnepli a Divi sablon fejlesztői csapata. Én csak 1 éve követem a fejlődésüket – de az pazar. Ezt az egy évet foglaltam most össze. Még pár napig, 2018. március 21-ig születésnapi kedvezménnyel kínálják fő művűket, a Divit. ( A kedvezmény itt érhető el.)

Az Elegant Themes elmúlt 10 éve

elegant themes - 10 éves a divi sablon fejlesztői csapata (legjobb wordpress sablon)

Az Elegant Themes egy nagyon jó közösséget is épített a Divi köré. Középen Nick Roach, alapító.

Még mielőtt az én kis 1 évemet ünnepelném a Divivel, nézzük csak meg, mit ért el az Elegant Themes 10 év alatt. Bámulatos, hogy milyen úton mentek végig és milyen ügyesen, tudatosan építenek egy valóban JÓ termék köré egy márkát és egy közösséget. Nick kezdő lépése az volt, hogy létrehozott egy Worpress témát. Majd mégegyet és mégegyet. Elindított egy kezdetben lassú, majd egyre gyorsabb folyamatot. Aztán felvett egy alkalmazottat, aztán született a kezei között még néhány téma, aztán jött még pár ezer felhasználó, aztán még pár tucat blogposzt: évről évre megduplázódtak, mind létszámban, mind bevételben. Emellett pedig a lényeg: egyre több értéket és segítséget nyújtottak a webdesign szakmának. Majd elérkezünk 2018-ig, amikor is már majdnem félmillió felhasználója van a Divi témának. (És azokról akkor nem beszéltünk, akik illegálisan használják a szoftvert.) A stílusosan elkészített 10 éves idővonalukat itt lehet megtekinteni. De hogy is jön ez az egész ide? Mi ez az Elegant Themes és mi az a Divi? Ezekről a következő bekezdéseimben írok.

 

WordPress és sablonok

Először is, miért WordPressben építem weboldalaimat? Abban a korban, amikor már lényegében mindenre van egy kész szoftver, teljesen feleslegesnek érzem az alapoktól kezdve lekódolni egy weboldalt. Egyszerűen nincs rá szükség, hogy a nulláról kezdjem.

Hogy mennyire megbízhatóan és jól működik a WordPress (mint weboldal-váz), azt jól mutatja, hogy a világ összes honlapjának ~30%-a ezen a rendszeren fut. Az összes tartalomkezelő rendszer között pedig (CMS = Content Management System) 60% körüli a népszerűsége! Ez nem véletlen. (Az összes WordPress weboldalnak egyébként a 0,4%-a fut magyar nyelven.)

Ugyan vannak akik megkérdőjelezik a WordPress biztonságát, és van némi alapjuk is rá, megfelelő beállításokkal – saját tapasztalatom szerint is – egy erős biztonsági szint megteremthető rajta és megbízhatóan működik. Hogy milyen biztonsággal kapcsolatos kérdéseket érdemes körüljárni, arról a weboldal karbantartást taglaló cikkemben írtam.

A WordPress weboldalak készítése során szinte mindig az első kérdések között szokott szerepelni, hogy “milyen WordPress témát, sablont használjak?” 13-14 évesen, amikor az első honlapomat készítettem – az akkori internetes rádióm adásait töltöttem fel a világhálóra – még nem gondolkoztam ilyen dolgokon: választottam egyet a sok ingyenes – és amúgy normálisan működő, de eléggé korlátolt – WordPress sablon közül.

Aztán később, amikor már komolyabb igényeket kellett megvalósítani, megállt az ingyenes sablonok tudománya. Először az Avadával próbálkoztam, de valamiért nem győzött meg teljesen. Aztán tavaly április környékén mégegyszer alaposan körülnéztem a WordPress témák piacán és az akkor legjobbnak tűnő Divi sablon mellett tettem le a voksom. Hosszútávú befektetésnek szántam, mert akkor már láttam mikre képes: ezekkel minőségi szinteket tudok ugrani más – egyébként főként kódokkal bajlódó – webdesignerekhez képest.

Divi – 1 éve: kissé kiforratlan. Ma: maga a mágia.

Divi funkciói, Divi functions, drap and drop, fogd és vidd wordpress sablon, Divi sablon

A Divi sablonban a “Fogd és vidd!” módszerrel is lehet szerkeszteni. Ez pedig egyszerűvé és gyorssá teszi. Egy kivétel van: ha a tárhelyszolgáltató régimódi és lassú…

Még mielőtt kitérek a részletekre, fontos megemlítenem, hogy a Divi sablonra mutató linkek ajánlói linkek, tehát jutalékot is kapok a Divitől. Viszont ezekkel a linkekkel, a partneri megállapodásom révén, kedvezőbb áron érhető el a Divi sablon. 

Én örökös hozzáférést vettem tavaly (egyébként ugyanilyen ajánlói linken keresztül) és nagyon jó beruházásnak tekintem ma is. 

Természetesen soha nem ajánlanék terméket csak a jutalékért, ez a csapat viszont messzemenően megérdemli. Az anyagi haszontól függetlenül is mindenképpen írtam volna a Diviről, mert nagyon elégedett vagyok vele és sokat jelentett az elindulásomban.

Szóval 1 éve vettem meg a Divi sablont és azóta – ha jól számolom – 9 weboldalt építettem vele. Ezalatt az idő alatt pedig nemcsak magára a termékre, hanem az azt fejlesztő csapat hozzáállására is rálátásom volt. Illúzió lenne azt gondolni, hogy létezik tökéletes szoftver, vagy olyan online termék, mellyel nem merül fel hiba menetközben. Mindig előfordulhatnak apró hibák, lehetetlen tökéleteset fejleszteni elsőre. A Divit sem éreztem tökéletesnek, voltak is néha kisebb zűrök vele, viszont 1 évvel később, ma úgy érzem, hogy maradéktalanul elégedett vagyok. És, ha fel is merülne hiba, akkor számít igazán, hogy kik állnak a termék mögött. Az én tapasztalatom az, hogy bármikor, amikor problémám volt a Divi sablon beállításaival, (az elmúlt egy év alatt körülbelül háromszor-négyszer volt olyan, hogy valamire nem találtam azonnali megoldást a Google módszerrel), azonnal a segítségemre volt az Ügyfélszolgálatuk.

Divi 3.0 – bemutatja az ET vezetője, Nick Roach

 

“Divi nation”

Amiben szintén egyediek, hogy egy szuper közösségé alakítják a sablon felhasználóit, Divi nation megnevezéssel. Remek márkaépítési megoldás. Ami pedig szintén feltűnt menetközben, hogy bármelyik problémammegoldó vagy útmutató (tutorial) videójukat is néztem, kellemes hangulatot ébresztettek bennem, jó kedélyűek a tartalomgyárosaik. Ez is egy olyan dolog, ami megkülönbözteti a többi márkától, hogy magát a tanulás folyamatát is élvezetessé varázsolják. Látszik, hogy tudatos elképzelés van mögötte.

Frissítések

Fontos kérdés, hogy fejlesztik-e egyáltalán, fejlődött-e ez a WordPress téma? (Jogos kérdés lehet, hogy például megéri-e az örökös hozzáférés?) Erre egy hatalmas, határozott igen a válaszom. Mára a Divi sablon a WordPress weboldalaknak egy egyszerűen és nagyon sokoldalúan használható, minőségi “díszítőeszköze” lett. Gyakran hetente, kéthetente jönnek ki verziófrissítései a sablonnak, alig lehet követni. Természetesen az egy év alatt nemcsak hibákat toldozgattak-foltozgattak, hanem nagyon sok lényeges újítás volt: színátmenetek beállítása a front-end felületen, sokféle szegély-díszítőelem, beépített választható elrendezések, új szerkesztői nézetek, új animációk és még napestig lehetne sorolni. Beépítették a sablonba az összes Google betűtípust is, mint választható szöveg-, cím- vagy alapértelmezett betűtípust, mely nagyon nagy könnyebbség az arculattervezésnek és a weboldal kivitelezésének az összehangolásában. Az Ügyféllel végignézhetjük a Google oldalán, hogy az elképzelt betűtípusokból mi egyezik az ő elképzeléseivel és gyorsan, hatékonyan haladhat tovább a munka. Korábban erre is néha külön WordPress bővítményt kellett használni.

A Divi sablon funkciói, lehetőségei

Sokan írtak már a sablonról itthon is, külföldön is, Youtube-on is számtalan értékelés született a Diviről, de a legjobban szerintem továbbra is a saját weboldalukon van összefoglalva, mi mindenre képes e rendkívül kreatív weboldal-formaöntő. Amik ott le vannak írva, meg tudom erősíteni, hogy nem túlzások, és én is ennyire szupernek érzem eme a WordPress témát. A Divi sablon funkcióit bemutató oldal megtekintése. 

Egy weboldal sablontól ma már elvárható, hogy a legtöbb létező felhasználói igényt kielégítse. Az, hogy a Weboldalkészítés Vállalkozásoknak által készített weboldalak ma már a Divivel készülnek, az jól jelzi az eszköz képességeit. A legtöbb esetben nem szükséges kódsorokat sem írni és az elképzelt, megtervezett arculat szinte minden eleme megalkotható a WordPress + Divi kombinációban. Persze, olykor hozzá kell toldani néhány sornyi CSS-t is, de általában csak elenyésző mértékben. Nagyon fontosnak érzem, hogy önmagában a Divi a kreativitást nem helyettesíti: ahhoz, hogy valaki profi weboldalakat rakjon össze ezzel az eszközzel, alapvető fontosságú, hogy jó esztétikai és stílusérzéke legyen. Máskülönben van egy olyan professzionális sablonunk, aminek a lehetőségeit nem tudjuk jól kihasználni.

divi sablon beállítások, legjobb wordpress sablon, divi beállítások, sablon beállítások, nézet, integráció, divi eszközök, divi funkciók, divi konfigurációk

A Divi sablon általános beállításainak egy szelete. Ezeken kívül még több száz lehetőség vár ránk…

“Fogd és vidd” ajánlat

Amellett, hogy elkészítem Megrendelőim weboldalát, egy prémium WordPress sablont, a Divit is odaadom ajándékba, örökös hozzáférési licensszel, örökös frissítési lehetőséggel.

Aki kezdő vállalkozó és szeretne a cégével az online térben is fejlődést elérni, az nem kerülheti meg, hogy legyen egy jó weboldala. Én ebben segítek, kezdő, vagy szintlépésre vágyó vállalkozásoknak. Az általam készített weboldalakhoz a Divi sablont ajándékba adom. Így ha a vállalkozó közben úgy dönt, hogy bele is tanulna egy-két hónap alatt weboldalának a szerkesztésébe, akkor lényegében megspórolta a Divi sablon árát is, hiszen ezt a szolgáltatásom mellé ingyen odaadom (75.000 Ft értékben).

A weboldalkészítés szolgáltatásom részeként egy 2-3 órás oktatóalkalmat is tartok, melyben véginézzük a WordPress kezeléséhez szükséges alapvető tudást, illetve ízelítőt adok a Divi szerkesztéséből is. Nyilván, ha az ember korábban még nem találkozott WordPress-szel, akkor egy alkalom nem elég arra, hogy teljesen átlássuk az egész honlap működését. Viszont a későbbiekben is tudok ebben segíteni, a személyre szabott oktatási alkalmaimon. Így később már nem lesz szükséges kiszervezni az “itt az írásom, tegyük fel a honlapra” jellegű munkáinkat.

Az Elegant Themes céggel kötött partnerségem révén, a következő linkekkel az eredeti árnál kedvezőbben vásárolható meg a Divi sablon: 20 % kedvezmény az 1 éves licensz árából VAGY 10%-os kedvezmény az örökös tagság árából!

A döntés, weboldalkészítés előtt

  • Ha van elég időnk rá, mindenképpen érdemes kezünkbe venni a munkát és folyamatosan képezve magunkat megtanulni a weboldalszerkesztést. Ma már ez nem olyan ördöngősség mint azt sokan gondolnák. A Divi nagyon leegyszerűsíti a folyamatokat. Ha gyorsan, hatékonyan és minőségi munkát végezve szeretnénk haladni, akkor én az ingyenes WordPress tartalomkezelő rendszer és a fizetős Divi sablon kombinációját javaslom. Ez ma biztosan az egyik legköltséghatékonyabb és legminőségibb megoldás a piacon. Számolnunk kell azzal, hogy munka mellett 1-2 hónapot igénybe fog venni, amíg az ember beletanul. De megéri rászánni az időt. Vagy…
  • Ha pedig az időnkből van kevesebb, de van ráfordítható pénzünk, célszerű a weboldalkészítést lehetőleg olyannak kiszervezni  aki a Divivel készíti a honlapját. Biztos vagyok benne, hogy ez egy hosszútávú garancia arra, hogy évekkel később is szintekkel előrébb járjunk minőségben versenytársainknál. Ebbe azt hiszem megéri időt és/vagy pénzt belefektetni.

Néhány weboldalam, ami a Divi sablonnal készült…

Hogy ne csak a levegőbe beszéljek, itt van néhány weboldal, ami a Divi sablon segítségével készült el a Weboldalkészítés Vállalkozásoknak műhelyben.

  • maga a Weboldalkészítés Vállalkozásoknak honlap, amin a kedves Olvasó jelenleg is idejét tölti
  • az üZENEt együttes weboldala – a zenekar ünnepélyes, romantikus zenét játszik esküvőkön, alkalmakon, fogadásokon
  • az Egészség Kert honlapja – biogazdálkodás Őrbottyánban két lelkes kertész lány irányításával
  • RealExam matek érettségi felkészítő tanfolyam weboldala és jelentkezési folyamata, online fizetéssel
  • Dinnyés Lilla személyre szabott étrend tervező és személyi edző weboldala.

 

Nagyon sokat köszönhetek ennek a sablonnak, rengeteg időt megspórolt és sok örömet szerzett nekem is az alkotói munka folyamán illetve Ügyfeleimnek, akik elégedettek voltak munkámmal. Köszönöm az olvasásra fordított figyelmet! Minden etikus és jó ügyekért dolgozó vállalkozásnak sok sikert kívánok!

Bognár Balázs