Tartalomkezelés a felsőoktatásban, modern webes technológiákkal

Tartalomkezelés a felsőoktatásban, modern webes technológiákkal Nádai Gábor1, Sós Bence2, Stiller Roland3, Kaczur Sándor4 1, 2, 3 Gábor Dénes Főiskola, 4GDF Informatikai Intézet [email protected], [email protected], [email protected], [email protected] Absztrakt Napjainkban az interneten való megjelenés elengedhetetlen. Nincs ezzel másképpen egy felsőoktatásban résztvevő intézmény sem. A tartalom megfelelő elrendezése, a lényeges információ szem előtt tartása, a szociális hálózatok megfelelő kihasználása, a modern webes technológiák alkalmazása, így például a HTML 5 és a CSS 3 egyaránt fontos, nem csak számítógépeken, hanem mobil eszközökön egyaránt. Azonban jelen pillanatban kevés olyan weblap ismert, mely a web új irányába mutat. A cikk fő témája a Gábor Dénes Főiskola honlapjainak rövid bemutatása, esetleges hiányosságainak, fejlesztési valamint újítási lehetőségeinek tárgyalása. Bemutatásra kerül továbbá egy a felsőoktatási intézmények számára használható tartalomkezelő portálrendszer terve, annak technológiai részletei, a kliens- és szerveroldali tulajdonságokkal, valamint a különféle megoldások összehasonlításával. Különféle HTML 5, CSS 3 és Java EE megoldások is ismertetésre kerülnek. Egy főiskolának vagy egyetemnek, mint a tudás képviselőjének talán a legfontosabb feladata, hogy egyfajta lámpásként világítsa meg az utat, annak legelején járva, nem pedig a szokásokat lemaradva követve álljon be a sorba.

1. Bevezetés Hosszú utat tett meg a „web”, míg a mostani állapotáig eljutott. A kezdetben az egész világháló egy forradalmian új lehetőségnek számított, mind a hétköznapi felhasználók, mind pedig a fejlesztők számára. Bár az elmúlt évtizedben nem sokat változott az alap, azonban a köré épülő technológia annál inkább. Robbanásszerűen terjedtek el a gyorsabbnál gyorsabb internetkapcsolatot biztosító megoldások, ráadásul a fejlesztők is egyre újabb és gyorsabb megoldásokat igyekeztek bevezetni. Ha szeparálni szeretnénk a világháló korszakait, három részről beszélhetünk. Az első résznek bár elnevezése valójában nincsen, de nevezzük „web 1.0”-nak. Ebben az időszakban kezdte meg terjedését, a kezdetekben kevés számú felhasználóval, lassú és néhol kicsit nehézkes kezelhetőséggel. A felhasználóknak egy teljesen új módszert kellett megtanulni és megszokni, hiszen itt nem az asztali alkalmazások gyorsaságát kaphatták, hanem egy „kattints-és-várj” rendszert, ahol minden interakció után várni kellett a megjelenő eredményre, és ez esetenként több másodperces/perces várakozást is jelenthetett. Természetesen már ekkor is több próbálkozás volt ennek kiküszöbölésére, mint például a Java appletek oldalakba történő beépítése, azonban az akkori internetkapcsolatok és számítógépek fejlettsége nem tette lehetővé ennek maximális kihasználását. Az igazi áttörést nem is a sebesség növekedése, sokkal inkább a köztudatban csak „web 2.0” jelzővel emlegetett korszak [1, 2] kezdete hozta. E korszak bár sokaknak csupán a közösségi szolgáltatások megjelenését, az inkább ember- és közösségközpontú webet jelentette, azonban nem szabad megfeledkezni a dolog technológiai hátteréről, ami legalább ilyen fontos változásokat eredményezett. Megjelentek az úgynevezett „gazdag JavaScript” oldalak, melyek meggyorsították és megkönnyítették a felület kezelhetőségét. Az AJAX technológia megjelenése jelentősen lecsökkentette a kérés és a válasz között eltelt időt [3]. Ez többek között annak köszönhető, hogy nem az egész oldalt kell újra elküldeni a böngészőnek, annak csak egy bizonyos részét, például egy táblázatban található adathalmazt. A web jelenleg ismét nagyobb változás előtt áll. E változás főként a kliensoldali technológia fejlődésében mutatkozik meg [4], és az előbbiek nyomán nevezhetnénk „web 3.0” korszaknak. Jelenleg weblapok megjelenítésére a HTML 4.01-es verziója a legújabb, mely

1999-ben jelent meg a W3 Konzorcium ajánlásaként [5]. Az oldalak többségét a javarészt erre épülő, 2002-ben megjelent XHTML 1.0 ajánlásnak megfelelve igyekeznek kialakítani [6]. A HTML következő verziója, a HTML 5 sokkal több újítást és lehetőséget ígér, hiszen a W3 Konzorcium az évek során összegyűjtött tapasztalatok alapján sokkal pontosabban tudja meghatározni, mire és hogyan van szükség egy weboldalon. Fontos megemlíteni a weboldalak megjelenésének formázására szolgáló CSS technológiát, melynek jelenleg 2-es verzióját használjuk, azonban itt is létezik egy újabb, fejlesztés alatt álló megoldás, a CSS 3. Ennek segítségével sokkal gördülékenyebben kialakítható egy oldal megjelenése (1. ábra), hiszen egy általános CSS 2 stíluslap átlagosan fele akkor terjedelmű az új verzióban [7].

1. ábra: Példa a CSS 2 és CSS 3 összehasonlítása

Rengeteg olyan lehetőség – amely a most használt technológiákkal nehézkes vagy egyszerűen csak hozzáadott munkát igényel – elérhető és egyszerűen használható az új technológiák használatával. Nem feledkezhetünk meg arról sem, hogy e technológiák jelenleg fejlesztés alatt állnak. Jelenleg kevés böngésző van, mely ténylegesen támogatja is azokat, és sajnos ezek sem a legnépszerűbb, legismertebb szoftverek. 2. Követelmények A technológiai áttekintést megfigyelve láthatjuk, hogy a web rengeteg lehetőséget/szolgáltatást nyújt [8]. Napjainkban az „interneten való megjelenés” nem pusztán arról szól, hogy egy adott cégnek van weboldala, néhány mondattal, mutatva hogy létezik. Fontos ezeket a technológiákat kihasználva olyan oldalakat alkotni, amelyek segítik, gyorsítják a felhasználók munkáját. Ez természetesen egy roppant nehéz feladat, mely a jövőbeli látogatók kiválasztásával kezdődik. Kik fogják látogatni az oldalt? Mit fognak ott keresni? Mennyi időt szeretnének ott eltölteni? Erre a három kérdésre megfelelően válaszolva kezdhetjük meg egy weboldal elkészítését. Akárcsak a cégeknek, a felsőoktatási intézményeknek is hasonló a feladatuk. Elengedhetetlen, azonban nem elegendő, hogy egy felsőoktatási intézmény elérhető legyen a világhálón. Ennél

sokkal többre van szükség. Iskolánk, a Gábor Dénes Főiskola weboldalának [9], és a mögötte álló infrastruktúra felújításának/felfrissítésének egy lehetséges tervét igyekeztünk eszerint kialakítani. Egy olyan rendszert szerettünk volna elkészíteni, mely kielégíti minden felhasználó igényét. A főbb célokat a következő szempontok jelölték ki: - a GDF új honlapja feleljen meg a felvételizőknek, akik az iskoláról szeretnék a lehető legtöbb dolgot megtudni; - feleljen meg a jelenlegi hallgatóknak, akik a mindennapi munkájukkal kapcsolatos információkért látogatják az oldalt; - feleljen meg a már végzett hallgatóknak; - feleljen meg a leendő és jelenlegi dolgozóknak; - sok információ legyen szem előtt, de mindeközben kevés is; - legyen könnyedén használható; - legyen hozzáférhető; - leginkább a tartalom egyszerre történő elrejtése és megjelenítése. Jelenleg több mint tizenöt menüpont található a Gábor Dénes Főiskola honlapján, ezek többsége ráadásul több mélységig terjedő menü (2. ábra).

2. ábra: A Gábor Dénes Főiskola jelenlegi honlapja (2010.04.05.)

Tehát sok az információ, ezeket megtalálni viszont adott esetben nehézkes. A probléma megoldására egy olyan menürendszer került kialakításra, amelyben a fő információk szem előtt vannak, és egy, legfeljebb két kattintásra, az oldal újratöltése (szerverhez fordulás) nélkül részletesebben is megtekinthetők (3. ábra).

3. ábra: A Gábor Dénes Főiskola új honlapjának felhasználói felülete

Az oldalt kliensoldalon megjelenítő HTML 5, CSS 3 és XML kódokat a háttérben egy Java Enterprise Edition technológiára épülő alkalmazás állítja elő [10]. A technikai vonatkozások mellett megjegyzésként néhány szó a különféle egyéb szolgáltatások, oldalak használatáról. A „web 2.0” korszakban elterjedt Facebook és Twitter alkalmazások kiváló segítséget nyújthatnak a közösséggel való kommunikációban, kiváltképpen, hogy aki adott esetben nem ismeri az iskola oldalát vagy nem látogatja azt napi szinten, viszont használja valamelyik hasonló szolgáltatást, az hamar, adott esetben első kézből juthat információhoz. Ennek gördülékeny működéséhez és hatékony működtetéséhez természetesen megfelelő üzemeltetés is szükséges. 3. Technológiai áttekintés Ahhoz, hogy megismerjük a modern technikákat, vissza kell tekintenünk a múltba, hogy is folyt (és folyik még ma is) a webfejlesztés. A tervek alapján a weblap fejlesztője vagy jobb esetben a cég sitebuilder-e elkészítette az alap layout-ot, ami bemutatta hogyan fog festeni az oldal, amint működik. Maga a HTML kódolás és a CSS [11, 12] megírása sokszor nem kis fejtörést okozott a készítőnek, ugyanis a mind a mai napig használt elavult böngészőkre is optimalizálni kellett a forráskódot és ez volt talán az egyik legidegesítőbb munka, amivel ő szembesülhetett. A következő lépés a lap darabolása volt attól függően, hogy a rendszer hogyan renderelte ki a dinamikus tartalmakat. Ez lehetett egyszerű file include és a tartalmak bizonyos pontra kiírása, de történhetett akár egy sablonkezelő rendszer beállításával is. Az előbbi módszer alapvetően nem a legjobb megoldás és sokszor biztonsági kockázatokat is hozott magával, utóbbi viszont körültekintően kiválasztott sablonrendszer használatával már kellemesebbnek bizonyult mind kényelem mind a rendszer szépsége szempontjából. Negatívumként említhető, hogy a sablonozó szintaxisát is meg kellett tanulni, ami bár nem

nevezhető bonyolultnak, mégis időbe tellett, főleg több ilyen/hasonló rendszert is kipróbálva. A legrosszabb, hogy a lap tartalma és a megjelenítése minden esetben mereven összekapcsolódik, össze van drótozva. Erre kínál megoldást egy szigorúan XML alapú technológia, ami ezt a negatívumot végre leküzdi. Az XSLT egy deklaratív XML alapú nyelv. Használatával kedvünkre generálhatunk bármilyen dokumentumot egy adott XML file tartalma alapján, ami lehet HTML, egyszerű szöveg, egy Office dokumentum, vagy egy új XML file. Működése egyszerű: a bemenetként kapott rendezett fastruktúrájú XML-t végigjárja az algoritmus, és kiválasztja a dokumentum azon részeit, amelyekkel foglalkoznia kell. Azt, hogy a fa mely részeivel kapcsolatban fog műveleteket végezni, az XSL dokumentumban leírt sablon alapján dönti el. A mintaillesztés, vagyis, hogy az XML fa mely ágára kell alkalmaznia a transzformációt a template-ben rögzített XPath kifejezés alapján fogja eldönteni. Tehát a weblap adatait adó XML állományban definiált XSL állomány alapján szerver- vagy kliensoldalon előáll a végleges honlap a szükséges HTML tartalmakkal együtt. A linkelt XSL dokumentum tartalmazza a HTML lap forrását és azokat a sablonokat, ami alapján a formázott tartalmak a megfelelő helyre kerülnek a végleges weblapon [13]. Ez a módszer bonyolultnak tűnhet a korábbi technológiákhoz képest, viszont használatával talán így a legegyszerűbb kielégíteni azokat a modern igényeket, amelyeket egy modern webalkalmazással szemben támaszthatunk [14]. Fejlesztői szemmel az egyik legfontosabb, hogy a nyers tartalmat adó XML embereknek és programoknak egyaránt könnyen olvasható és feldolgozható, ami a legfontosabb az elosztott rendszerekben. Szintén lényeges szempont, hogy megegyező tartalommal egyszerűbb különböző eszközökre elkészíteni a weblapot. Erre mindenképpen gondolni kell, ugyanis egyre több mobil eszközzel lehetséges netezni és bár többségük tökéletesen megjeleníti a monitorra tervezett oldalakat mégis kényelmesebbé és vonzóbbá tehető termékünk, ha ezekre az eszközökre is fejlesztünk. A felhasználó számára lényegtelen, hogy a böngészőben megjelenített weblap milyen módon állt/áll elő, viszont lényeges, hogy mennyire gyors, szép és használható. Éppen ezért lassan áttérhetünk a HTML 5-ös verziójára, ami jelentős vérfrissítést jelent a kiöregedett HTML 4 és az XHTML-hez képest. Az utóbbi évek table-less layout-jai alapján leszűrt tapasztalatok alapján bevezetésre kerülnek új elemek, ami nem csak a sitebuilder-ek munkáját könnyíti meg, hanem a keresőoptimalizálásban is segítenek. Ilyen új tag például a

és a