Elemzés

Edzőterem - Atmacenter2010-11-06 20:27:53

Ezt megosztom
Az edzőtermek életünk részeivé váltak, sokunknak akár a közösségi élet egyik meghatározó helye is, így érdemes néha arra is figyelmet szentelni, miképp is jelennek meg ezek a helyek a weben.

Hamarosan (november 20-án) lesz egy jóganap az Atmacenter-ben, melyre én is megyek, s a http://atmacenter.hu/ oldalon is tájékozódtam.

Sajnálattal vettem tudomásul, hogy eltérő nézetet kaptam Chrome (jelenleg a leggyakrabban használt böngésző a gépemen), illetve a megszokott Firefox és persze az Internet Explorer alatt.

Vegyük sorra!

Három böngészővel lestem meg az oldalt: Firefox (3.6.12), Chrome (7.0.517.41), IE8.

A menüre érvényes szín a style.css alapján fehér szín lenne, de ez sajnos a Chrome-nak nem jött össze:

.tech #letraMenu li a {
color:#FFFFFF;
}

Miért? Mert egy span elementbe zártak egy div-et, ami a szabványok szerint nem helyes, hiszen inline element nem tartalmazhat block elementet.

 

Firefox 3 menü Chrome 6 menü IE8 menü

Az már szintatktikai hiba, hogy a menüt leíró lista sorait egy-egy elementtel "szakítják" meg (értelmetlen és nem is valid)

Ez volt az első hiba, ami rögtön szembetűnt a lapon.

Mielőtt folytatnám a kód elemzését el kell mondjam, az oldal menüje, a felső és a bal oldali semmilyen komolyabb rendszert nem mutat, azaz egy tapasztalatlanabb ember számára még ez az egyszerű szerkezet is kaotikus tud lenni.

A bal oldali menüt kicsit odadobottnak érzem, nem látok benne igazi rendszert, a felső menüpont viszont indokolatlanul van kiemelt szinten véleményem szerint. A felső menüpont utáni "További cikkek" pedig megtévesztő, nem link, csak egy "cím", fejléc.

Nincs nyitólapra vezető link.

Az oldalon, már a nyitóoldalon többfajta karakterméret is látható, ami sajnos zavaró (ráadásul nem is mindig css style-ból, hanem inline, sőt a számomra elítélendő font tag-gel lett megadva.

Végigböngészve az oldalt pár hiba:

 

  • English menüpont nem angolra vált át, csupán egy rövid, átfogó oldalon mutatja be a céget
  • Galéria oldalon sajnos nem optimalizáltak a képek (manapság nagyon egyszerűen megoldható akár egy sima js alapú galéria is)
  • Hot Yoga menüpontnál hirtelen angol szöveg fogad (nem értem milyen alapon)
  • Blog és Asztrológia menüpontok kifelé mutató oldalak (nem jelzi semmi)
A hírlevél rész sajnos nem nyerte el a tetszésem, kicsit ákom-bákom jellegű (mintha az utolsó pillanatban kellett volna még gyorsan odadobni)
Atma center logóval nincs bajom, max. a helyével de a két központ helyszínét leíró képpel már igen, ennek nem láttam értelmét, miért kép?

 

Folytassuk a forrással:

HTML 4.01 (ez sem halálos bűn, bár ez a szabvány lassan 12 éves)
Táblás szerkezetű design! Hmmm, még ha elfogadom azt, hogy az oldal 2006-ban készült, akkor is erős fenntartásaim vannak azzal kapcsolatban, hogy miért?
A táblázatokkal (s most vissza kellene pörgetni jó pár évet a webfejlesztés frontendjében eltöltött több évet), nem az a baj, hogy vannak. Nem. A táblázatokra szükség van, de nem a külalak megalkotásánál. Az másra való
Sajnos a táblás design és a kissé pongyolán mért cellák miatt a menü szélessége ugrál, egyes aloldalak szélessége torzul, elcsúszik.

 

A forrásban egy eléggé "érdekes" még valamikor az ’90-es évek végéről megmaradt Dreamweaver-es szörnyűség, ami az oldalra betöltendő képek "preload"-ját hivatott megoldani. Sajnos nem vagyok meggyőződve, hogy ez sikeres volt.
Sajnos a style.css eléggé szegényes, nagyon sok a gyors design módosítást lassító inline element, a beszúrt képek (amik design céllal szerepelnek igazából az oldalon)
Picit olyan érzésem van az oldal forrását nézve, mintha egy egyszerű wysiwyg editor lenne a háttérben, amiben összeállítják az egyes aloldalakat, gondolok itt pl. az üres tagekre, a táblázatok inline style-ozására. (bevallom én is egy egyszerű wysiwyggel írom a blogom itt az admin felületen...szóval ez nem feltétlenül hiba!)

 

A címek sajnos nem H elementek, így ezt ismét a hibák listájára kell soroljam. Szóval az oldal forrása nem nyerte el a tetszésem, ennél többet sajnos nem tudok mondani :(

 

Egy apró részt megnéztem még...

Webshop

Bevallom amikor elkezdtem kiválogatni termékeket, egy pillanatig volt egy olyan érzésem, hogy nem fog sikerülni a kosárba dobás...sikerült szerencsére. Session alapú webshopot véltem felfedezni, érdekesség volt számomra, hogy pl. az user névvel jelzett sütit Alex+Porter értéket kapott :)

Összességében

Az oldal színvilága még épp tűrhető, viszont a mai kornak már nem igazán felel meg a kód szerkezete, a menü felépítése sem. Kicsit nehezen lehet megtalálni infókat, keresőnek nyoma sincs, az interaktivitást a facebook-os widget és a blogspot-os link mutat csupán, de ezek nem szerves részei az oldalnak (hírlevelet nem próbáltam ki, szóval erről nem tudok véleményt nyilvánítani)

Erősen ráférne az oldalra egy kis technikai ráncfelvarrás, illetve egy, a színek harmóniájába szerelmesebb webdesigner is köszörülhetne rajta egy kicsit.

Ehhez én is hozzászólok:

  • Írd be a kötőjelek nélkül a következő szöveget az ellenőrzőmezőbe (kisbetű-nagybetű számít!)
  •  
edzoterem

Vissza