Így szűrd ki az átverő webstúdiókat!

Webstúdiót választani sajnos nem is olyan könnyű dolog. Sok webstúdió magasztalja magát, miközben a munkájuk egy fillért sem ér! Nézzük meg milyen lehetőségeink vannak arra, hogy kiszűrjük a lehúzós, átverős webstúdiókat, és megtaláljuk a nekünk megfelelőt!

Az előző cikkünkben már kitárgyaltuk, mik azok a tipikus lehúzásaik a webstúdióknak, amikor a pénzünkért egy tökéletesen hibás weboldalt, vagy egy olyan honlapot kapunk, amit igazából a netről is letölthettünk volna ingyen. Ha még nem olvastad volna, kérlek tedd meg most!

Mivel más lehetőségünk nincs, az adott webstúdió saját céges weboldalát, és a referenciaként felsorolt honlapokat, webshopokat fogjuk elemezni, leellenőrizni. Hiszen valószínű, hogy mi is olyan weboldalt fogunk kapni, mint a többiek!

Először nézzük meg a talán legtipikusabb kategóriát, amikor egy "egyedileg fejlesztett" weboldal áráért, egy a netről letölthető ingyenes motort kapunk, pl.: WordPress, OpenCart, Joomla. Ezek a legismertebbek, és legkedveltebbek hazánkban.

Ezek kiszűréséhez nem kell mást tennünk, minthogy:

  • nyissuk meg az adott webstúdió weboldalát, vagy egyik másik referencia munkáját
  • egérrel jobb klikk, és a megjelent menüben kattintsunk az Firefoxban "Oldal forrása", Chromeban "Oldal forrásának megtekintése" menüpontra - vagy mind a két böngészőben ugyan az a billentyűparancs: Ctrl+U
  • a megjelenő ablakban láthatjuk az weboldal forrás nézetét

ez például egy WordPress weboldal forráskódjának eleje, ahol jól látható a linkekben a "wp-content" szövegrész
sőt jelen esetben még (a kép alján) a "generátor" neve is látható, hogy WordPress 3.5.1

Hogyha találunk ebben a szekcióban olyan szöveget, hogy "wp-content" az WordPress, ha olyan szót hogy "joomla" vagy "com_virtuemart" (az a Joomla webshop modulja), akkor az Joomla. Az Opencart motorra általában a mappaszerkezetéből szoktam következtetni, tehát itt az src és href tagok értékei így kezdődnek: "catalog/view/theme/".

A legtöbb esetben, mivel ezek a cégek a webprogramozáshoz maximálisan is csak nagyon keveset értenek, már eleve a saját weboldaluk is WordPress motort használ. A legcélravezetőbb ha tényleg eleve a cég honlapjával kezdjük a vizsgálatot.

Jelenlegi nézelődésem közben is sikerült belefutnom egy olyan webstúdióba, aki ki is jelenti, hogy ő Joomla weboldalakat árul, és egy ilyen ingyenes, és könnyedén feltörhető webáruház náluk 130,000Ft-tól indul!! De ha nem is írnák ki, mi már könnyedén ki tudjuk szúrni az ingyenes motort!

Ha ezzel megvagyunk, vizsgáljuk meg a weboldalak minőségét!

Ha már bezártátok volna, kérjétek ki újra a fentebb bemutatott módszerrel a weboldal forráskódját. Azt végigfutva keressük a következő dolgokat, amiket lentebb képekkel is demonstrálok:

  • ne legyen benne style tag, se az oldal tetejében <style> stílusosztályok meghatározása </style>, de olyat se nagyon találjunk benne, hogy pl.: <div style=" egy csomó meghatározás">bla,bla,bal...
  • ne legyen benne, de legalábbis ne sok script tag, de ha van is benne, akkor se sok, és ne szétszórva, vagy a <body> tag felett, vagy közvetlenül alatta, vagy teljesen az oldal alján
  • ne találjunk benne piros színnel megjelölt elemeket, ezeket az elemeket ugyanis hibának veszi valamiért a böngésző, amit ki is ír nekünk, ha rávisszük az egeret (csak Firefox-ban működik)

Az stílus meghatározásokat, és a nagyobb mennyiségű javascript kódokat külön fájlokban kell tárolni. Egyrészt azért, mert a böngészők ezeket a fájlokat letárolják, és csak módosítás esetén kerülnek ismét letöltésre, másrészt pedig azért, mert ennek ez a rendje módja!

Az utolsó eset, az pedig egy hiba. Valamivel összezavarták a böngészőt, vagy valóban duplikálták a body tagot. Minden esetre ez egyáltalán nem jó. Viszonyításképp nézzétek meg ennek (mármint a Pillangó Weboldal) az oldalnak a forráskódját. De megnézhetitek a leg-technic.hu forráskódját is, az is az én weboldalam. Egy forráskódnak így kell kinéznie!

Hogyha még mindig egész rendbe találjuk az adott webstúdió weboldalát, és/vagy referencia munkáit, akkor megnézhetjük a html validator-ral is. Ez leellenőrzi, hogy a html elemek szabályosan vannak-e használva. Ehhez a hivatalos Markup Validation Service weboldalát használhatjuk.

Másoljuk az ellenőrzésre szánt weboldal urljét az "Address"-hez, és kattintsunk a "Check" gombra. Ezt akár 1-2 aloldallal is megcsinálhatjuk.

A lényeg, hogy a hibák száma ne nagyon legyen több 10-20-nál, és persze a figyelmeztetések se. Sajnos néha nem működik tökéletesen, és hibának vesz olyan dolgokat, amik egyébként egyáltalán nem jelentenek gondot. Legfőképp olyan hibákat keressünk, mint:

  • document type does not allow element "a" here - annak a link tagnak semmi keresnivalója sincs ott
  • end tag for "ul" omitted, but OMITTAG NO was specified - itt speciel nem lett lezárva az ul tag (persze ez lehetne p, h1, h2, h3, li...)
  • there is no attribute "xclass" - ilyen tulajdonság pedig nem létezik (ha olyan lenne, hogy data-valami, az nem hiba, csak annak veszi)
  • duplicate specification of attribute "class" - kétszer van meghatározva a "class" tulajdonsága az elemnek
  • required attribute "type" not specified - nincs meghatározva a script tag típusa

Mint már mondtam, sajnos néha olyat is hibának vesz, amit nem kellene. Én ide csak olyan hibákat emeltem ki, amik egyértelműen abból fakadnak, hogy hibásan lett megszerkesztve a weboldal html szerkezete.

Egy másik nagyon fontos részét is könnyedén ellenőrizhetjük a weboldalnak, ez pedig nem más mint az url-ek. Kattintgassunk a vizsgált weboldal különböző menüpontjaira, és figyeljük az url-eket. A lényeg, hogy az url-ek csak az angol abc kisbetűiből álljanak, azon felül pedig csak számokat, kötőjelet és aláhúzást tartalmazzanak. Sőt, ha az adott oldalt nem a felhasználók szerkeszthetik fel (mint például a hirdetéseket a felhasználók adják fel), akkor lehetőleg azonosító számot se tartalmazzon az url.

Jó url-ek:

  • /hirek/kozeledik-a-sarkvidek-raadasul-lego-elemekbol
  • /blog/116/lego-10243-parizsi-etterem (a blogokat a tagok írják, így a biztonság kedvéért inkább beleraktam az url-be az blog azonosító számát)
  • /oldalak/adatvedelem-szabalyzat

Rossz url-ek:

  • /noi-papucsok/0/josef-seibel-női-bőr-papucs-c8418/kezdolap=1
  • /index.php?site=regisztracio&barat=ACEGaborACE

Szerintem ezen nincs is mit magyarázni, mindenki számára jól látható az url-ek közti különbség. Még arra figyeljünk, hogy az url-ek utaljanak a weboldal felépítésére, pl.: blogok: /blog - ha megnézünk egy blogot: /blog/ezt-a-blogot-olvasod-most.

Abban az esetben, ha mi nem sajnáljuk a pénzt leendő weboldalunkra, ezért egy vérprofi webstúdiót keresünk, akkor az alábbiaknak járjunk még utána:

Ellenőrizzük le, hogy a belinkelt CSS és JavaScript fájlok le vannak-e tömörítve (ezeket a forráskód tetején kell hogy megtaláljátok). Nem kell mást tenni, csak kattintsatok az egyébként linkként megjelölt hivatkozásokra. Ha ott nem egy több száz vagy esetleg ezer soros "versikét" találtok, hanem egy egysoros szöveget, aminek sosem lesz vége, akkor az a fájl le van tömörítve.

A tömörítéssel általában 20-30% kerül megspórolásra. Az pedig nem mindegy, hogy amikor valaki majd megnyitja a weboldalunkat, akkor mekkora fájlokat kell letöltenie a böngészőjének! Főleg ha mobilról nézi a weboldalt, de egyébként is.

Egy másik dolog, ami jól tükrözi egy webstúdió profizmusát, és az általuk készített weboldalak minőségét, az egy képre gyűjtött ikonok. Ez annyit tesz, hogy a weboldalhoz felhasznált rengeteg kis ikon, nyíl, és egyéb kisebb képek nem külön fájlként vannak tárolva, hanem egy nagyobb képen vannak elhelyezve, és persze arról használva.

ez a youtube ikonokat tartalmazó képe
mert a vérprofik így csinálják ;)

Ezt úgy tudjuk leellenőrizni, hogy egérrel jobbklikk az oldalon, és ott válasszuk az "Oldal adatainak megtekintését". A felugró ablakban válasszuk a "Média" fület. És ott nézzük végig a képeket (az első "Címre" való kattintás után mozoghatunk nyilakkal is, úgy gyorsabb lesz). Ha sok olyan képet találunk, amin csak egy-egy ikon szerepel, de nyomát sem leljük egy olyan válogatásnak, ami fentebbi képen is látható, akkor ez lecsó! A példa kedvéért nézd meg ezt a weboldalt (mármint a Pillangó Weboldalt), és lám, találni fogsz egy icons.png nevű képet. (Vigyázzatok a közösségi oldalakról behívott ilyen képekkel - ezek általában az utolsók között jelennek meg.)

És kész is vagyunk

Most biztos sokan arra gondoltok, hogy az eleje, az a WordPress meg a Joomla dolog még oké. Persze, azért azt nézzük meg, nehogy már 150,000-et fizessünk egy olyan weboldalért, amit mi magunk is letölthetünk a netről ingyen. De a többi, főleg a vége, az már szőrszál-hasogatás.

Nem! Ezek bizony nagyon fontos részei egy weboldalnak. Ezen felül nagyon jól tükrözi az adott webstúdió szaktudását, és az elkészített weboldalaik minőségét! Rengeteg weboldal van már a neten, és az, hogy melyik fog a végén életben maradni, csak azon múlik, hogy mennyire jó az adott weboldal. Egyrészt a tartalma, másrészt a szerkezete. Egy olyan csapattól, akik a forráskódos részeknél már elbukik a jelenleg felállított mércén, azoktól ne is akarjunk elvárni egy versenyképes weboldalt!

Igazából az utolsó két dolog sem valami különlegesség, hivatalosan így kellene kinéznie egy weboldalnak. Ha egy cég majd 200ezer forintért szeretne nekünk egy majdnem alap webshopot készíteni, ennél sokkal-sokkal többet kell elvárnunk. Az a lista elég hosszú lenne, de a blogom folyamatos követésével remélem egy helyes kép fog kialakulni bennetek, hogy hogyan is néz ki egy jó weboldal.

Amennyiben sikerült megtalálnunk azt a webstúdiót, amelyik ezen a listán átmegy, akkor már nincs más dolgunk, mint reménykedni. Méghozzá abban, hogy még ott van az a programozó, aki ezeket a minőségi oldalakat készítette. Ha ebben is szerencsénk van, akkor már csak egy dolog van vissza, mondjuk el neki mit szeretnénk, és Ő meg fogja nekünk oldani - remélhetőleg ugyan azzal a precizitással és szakértelemmel, mint az előzőeket.

Szólj hozzá Te is!
0 hozzászólás
PW CMS 1.4.6 · Adatvédelmi irányelvek · Visszajelzés küldése
A weboldal cookie-kat használ. Adatvédelmi irányelvekértem