Táblázatok használata és a keresőoptimalizálás
A HTML szabvány létrehozásakor nem a grafikai igényesség vezérelte elsősorban a fejlesztőket, ezért az igényes megjelenéshez (melynek egyik ismérve az oldal különböző elemeinek megfelelő, pontos pozícionálása) kezdetben csak egy nem kifejezetten erre kitalált elemmel, a táblázattal történő pozícionállás állt a webfejlesztők rendelkezésére.
Közel sem annyira problémás a Keresőoptimalizálás szempontjából ez a technológia, de más egyéb tényezőket is figyelembevéve a lépcsőzetes Stíluslapok használata ajánlottabb.
Miért rossz a táblázat?
A klasszikus egymásba ágyazott táblázatokkal történő pozícionálás során az egyes elemek vizuális sorrendje nem egyezik meg a HTML forráskódjában található tartalmi részek sorrendjével. Vegyük az alábbi táblázatot, példaként a következmények bemutatására:
| Nagy nemzetközi keresőprogramok | Alternatív keresők | Magyar keresők | ||||||||||||
|
|
|
A keresőoldalak a kulcsszavak elemzéséhez (mint például Kulcsszótávolság meghatározása, Kulcsszavak súlyozása) eltávolítják a HTML tagokat és egyéb kódrészleteket, és alábbiakhoz hasonló módon tárolják el a fenti táblázatot:
Nagy nemzetközi keresőprogramok Alternatív keresők Magyar keresők Google kereső Yahoo! kereső MSN kereső A Google Inc. által üzemeltetett keresőprogram. A Yahoo! kereső! portálhozkapcsolódó keresőszolgáltatás. A Microsoft által kifejlesztett technológia. Gigablast Jó találati listákat szolgáltató kereső, a nagyoknál kevesebb beindexelt oldallal. SZTAKI Kereső Zoohoo.hu Kísérleti stádiumban levő keresőprogram figyelemreméltó technológiákkal, mint pl. a szótövezés. A cseh Jyxo keresőtechnológiát használó keresőprogram.
Ha mindezt Stíluslappal formáztuk volna, akkor az alábbi szöveget tárolták volna el a keresőprogramok (Kövér és dőlt betűvel a különböző szintű Fejezetcímek):
Nagy nemzetközi keresőprogramok Google kereső A Google Inc. által üzemeltetett keresőprogram. Yahoo! kereső A Yahoo! kereső portálhoz kapcsolódó keresőszolgáltatás. MSN kereső A Microsoft által kifejlesztett technológia. Alternatív keresők Gigablast Jó találati listákat szolgáltató kereső, a nagyoknál kevesebb beindexelt oldallal. Magyar keresők SZTAKI Kereső Kísérleti stádiumban levő keresőprogram figyelemreméltó technológiákkal, mint pl. a szótövezés. Zoohoo.hu A cseh Jyxo keresőtechnológiát használó keresőprogram.
Jól látszik, hogy a táblázatokban máshogy következnek a Kulcsszavak, feleslegesen növelve a Kulcsszótávolságot, a fontos címszavak pedig nem szerepelnek kiemelt fontosságú, a Kulcsszavak súlyozásakor figyelembe vett HTML elemekben, mint pl.a Fejezetcímek, illetve a fontos tartalmi részek gyakran távol esnek a HTML kód elejétől. Például a bal oldali oszlopban szoktak lenni a navigációs elemek, melyek megelőzik a középső oszlopban található fő tartalmat. (Létezik erre egy áthidaló megoldás is, melyről ezen az oldalon lehet olvasni.)
Egyéb problémák
A keresőoptimalizálás szempontjain túl még számos más okból rosszabbak a táblázatos layoutok, mint a stíluslapok:
- A fogyatékkal élők a fenti példákhoz hasonló módon szembesülnének az oldal tartalmával: szembetűnő, hogy mennyivel problémásabb a táblázattal pocícionált weboldal böngészése, mint az Akadálymentes weboldalaké.
- A táblázatos layout-ok sokkal kevésbé flexibilisek a CSS-sel összerakott oldalaknál: Például egy Stíluslappal létrehozott képlékeny három oszlopos oldal lebomlik egy oszloposra, hogyha nem elég széles a képernyő, míg egy táblázatos layoutnál vagy nagyon kicsi lesz a lényeget magába foglaló oszlop, vagy vízszintes görgetéssel lesz csak használható az oldal. A kis képernyővel rendelkező mobil eszközökön könnyen olvashatatlanná válhatnak emiatt az oldalak, vagy pedig alternatív (sokszor lebutított) layout-ot kell nyújtani a PDA-k, Palmtopok, Handheld PC-k és mobiltelefonok számára. A CSS-sel készült oldal kompromisszumot jelenthet ebben az esetben a külcsíny rovására, az összes tartalmi elem megtartása mellett.
Miért jó a táblázatos elrendezés?
Egyes esetekben azért lehet mégis hasznos a táblázatos elrendezés, mert így nagyobb az esély arra, hogy minden böngészőben ugyanolyan módon jelenjék meg az oldal. Ez nem azért van, mert a táblázatos layout jobb technológia, hanem a különböző Böngészők Stíluslapkezelési hiányosságai okán sajnos nincsen erre jobb megoldás. Emiatt a Fontos keresők is gyakran használják a táblázatokat oldaluk külalakjának beállítására. Egyik legszebb példa erre a www.google.hu oldal: érdemes megnézni, hogyan van szétdarabolva négy darabba a Google logó, majd egy táblázat celláival összehekkelve.
Hasonló okokból előfordul még, hogy a weboldal layout-jának váza táblázatokkal van összerakva, viszont azon belül a CSS intenzívebb használatával alakul ki az oldal képe. Egyes vélemények szerint az egyébként ritkán használt a táblázatfejléc elemek (TH, table header) majdnem annyira hangsúlyosak a keresők számára, mint a [Fejezetcím]ek.
Összegzés
A táblázatos elrendezésű oldal nem szükségszerűen rossz a keresőkre optimizálás szempontjából, mint ahogyan a tisztán Stíluslapokkal elrendezett oldal sem jelent szükségszerűen előnyt. Többek között a stíluslappal tagolt html oldal szerkezete tisztább, kevesebb a leíró kódot tartalmaz, szabadabban alakítható az egyes tartalmi elemek sorrendje a kódban, ezért egy CSS-el kialakított oldalnak nagyobb esélye van, hogy jobban szerepeljen a Találati rangsorban, mint egy táblázatos weblapnak.
További olvasnivaló
- http://www.hotdesign.com/seybold/hungarian/ – Miért butaság a táblázatos szerkezet: a probléma körülírása és a felkínált megoldás.
- http://weblabor.hu/cikkek/csstablazatnelkuli – A táblázatok nélküli oldalakról, és létrehozásukról lépésről lépésre.
A „Táblázatos layout” című bejegyzést 2005. 04. 20. napján publikáltam, az azóta már bezárt webni.innen.hu oldalon. Ezt az írást és az innen hivatkozott régi tartalmakat a Webni! Archívum oldalán gyűjtöttem össze. Mivel az utolsó módosítás dátuma: 2006. 12. 26., ezért az itt olvasható információk már részben vagy teljes egészében elavultak lehetnek.