Duela aste pare bat UEUk antolatutako Web orrien irisgarritasuna: teoria eta praktika ikastaro interesgarrianizan nintzen, Elhuyar nire lantokikoek bidalita. Han ikasitakoak praktikara eraman nahi izan ditut blog honetan, eta irisgarritasuna erdiesteko lehen pausua den XHTML eta CSS estandarrak betetzeko beharrezko aldaketak egin ditut.

Ikastaroan ikusi dugun legez, bloga irisgarria egitea (hau da, edozein erabiltzailek ezintasunen bat izanik ere, edozein nabigatzailek eta edozein egoeratan atzitu eta ulertu ahal izatea) eta WAI estandarrak betetzea nahikoa lan zaila eta konplikatua izan daiteke. Blog edo web gune bat egiten hasten garenean hasieratik gauza gutxi batzuk kontuan izanik nahiko erraz lor daiteke irisgarria izatea, baina horiek kontuan izan gabe eginda dagoen bat irisgarria egitea... Ez dakit oraindik horretan hasiko naizen.

Hala ere, web gune bat irisgarria izan dadin bete beharreko lehen baldintza (bete beharrekoa baina ez nahikoa), W3C-ren XHTML eta CSS estandarrak betetzea da, eta hauek bai inplementatzea erabaki nuen, gehiena eginda nuelakoan eta hain zaila izango ez zelakoan... Tira, uste baino lan askoz handiagoa eman dit, baina azkenean lortu dut. W3C-k bere webgunean dituen egiaztatzaileak (XHTML egiaztatzailea eta CSS egiaztatzailea) erabili ditut eta horien arabera estandarrak betetzen ditut, beraz blogaren menuaren bukaeran hori ziurtatzen duten W3C-ren logoak jarri ditut.

Uste dut blogaren orri, atal, aukera eta estilo-orri guztiei pasatu dizkiedala egiaztatzaileak, baina ezin inoiz ziur egon... Beraz, zuek ere lagun diezadakezue konprobazioak egiten: blogeko edozein orri edo artikulutan zaudetela eta edozein estilo-orri aukeratuta daukazuela, menuaren bukaerara joan eta nahikoa da W3C-ren logoetan klik egitea automatikoki egiaztatzaileetara joateko. Zuzena ez den orriren bat aurkituko bazenute, abisatu mesedez.

Edonola ere, ikastaroan esan ziguten bezala, ez da nahikoa blogak orain estandarrak betetzearekin, egiten den edozein eguneraketa eta gero estandarra izaten jarraitu behar...

Gaurko eguna "estilo-orririk gabeko web guneen eguna" edo CSS naked day izendatu dute internauta batzuk. Bere helburua da estandarrak zein garrantzitsuak diren erakustea. Web gune batek CSS erabili eta estandarrak ongi betetzen baditu, estilo-orririk gabe ongi irakur daiteke, eta ezgaitasunak (itsutasuna, adibidez) dituen norbaitek ere ongi "irakurriko" du.

Blog honek (Teknosexua edo Minid bezala) bat egiten du ekimen honekin eta estilo-orri guztiak desgaitu ditu. Ez dut sinbolikoki soilik egiten, niri ere blogak estandarrak guztiz betetzen ote dituen egiaztatzeko eta, hala ez bada, konpontzeko balioko dit. Esaidazue zerbait oker ikusten baduzue, mesedez. Bihar dena lehen bezala utziko dut berriro.

Artikulu honetan azalduko dut nola lor daitekeen COREBlog produktuan oinarritutako blog baten (eibar.org-eko blog guztiak hala dira) erabiltzaileak estiloa dinamikoki aldatzea, beste blogger batzuek nahi badute egin ahal dezaten.

CSS estilo-orriak lortu edo diseinatu eta COREBlog-era ekarri

COREBlog-ek CSS estilo-orria behar du blogak itxura polita izateko. CSS estilo-orri propioak sortu nahi badituzu, irakurri hau.

eibar.org-en ostatatutako blogek Jeff Hicks-ek egindako hobekuntza bat dute, zeinari esker MovableType 2 blogak egiteko plataformaren CSS orriak erabil daitezkeen. Plataforma hori oso erabilia da, eta beraz estilo-orri mordoa daude eginak berarentzako. Nik MovableStyle.com orritik jaitsi nituen nire orrian ditudanak, eta horrez gain internetetik beste mordoxka bat lortu nuen, "powered by movabletype 2" googleatuz.

Lortutako edo diseinatutako orri horiek gordetzeko COREBlog-en barruan karpeta bat sortzea komeni da, txukuntasunagatik. Nire kasuan css deitu diot. Karpeta horretan CSS orri bakoitzeko DTMLMethod bat sortu behar da, izena style_css + zenbaki bat jarriz bakoitzari (style_css01 lehenari, style_css02 bigarrenari eta abar). DTMLMethod horien izenburua estiloaren izena izango da, eta edukia jaitsitako orria. Estilo-orriek irudiak erabiltzen badituzte, horiek ere sartuko dira karpeta honetan, Image elementu gisa.

Estiloa-aldatzeko aukera

Moduluen karpetan (normalean modules) DTMLMethod berri bat gehituko dugu, eta hau idatziko dugu bertan:

<div class="sidetitle">Itxura aldatu</div>
<div class="side">
<form action="change_style" method="POST">
<select name="new_style">
<dtml-in "css.objectValues('DTML Method')" sort=id>
<option value="<dtml-var "id()[9:]">"<dtml-if "REQUEST.has_key('style')"><dtml-if "id()[9:]==REQUEST['style']"> selected</dtml-if><dtml-else><dtml-if "REQUEST.SESSION.has_key('style')"><dtml-if "id()[9:]==REQUEST.SESSION['style']"> selected</dtml-if></dtml-if></dtml-if>><dtml-var title></option>
</dtml-in>
</select>
<input type="SUBMIT" name="SUBMIT" value="Aldatu">
</form>
</div>

Honek egiten duena da css karpetan dauden style_css izeneko elementu guztien tituluekin aukera-zerrenda bat sortu, defektuz azken aldian aukeratutakoa agertzen delarik markatuta.

Ondoren modules horretako index_htmlan deitu beharko diogu modulu berriari.

Estilo-aldaketa gordetzeko

Gero COREBlog-aren orri nagusian change_style izeneko DTMLMethod bat sortu behar dugu, eta hau idatzi bertan:

<dtml-call "RESPONSE.setCookie('style',new_style,expires='Wed, 19 Feb 2020 14:28:00 GMT')">
<dtml-call "REQUEST.SESSION.set('style',new_style)">
<dtml-call "RESPONSE.redirect(blog_url)">

Honek egiten duena da aukeratutako estiloaren zenbakia erabiltzailearen ordenagailuko cookie baten gorde. Cookie-ak desgaituta dauden kasurako, sesio-aldagai baten gordetzen du (azken honetan ez du aukeratutako estiloa hurrengo sesioan gogoratuko).

COREBlog-i esan aukeratutako estilo-orria erabiltzeko

Blog-eko orri guztiek erabiltzen duten goiburukoan (normalean blog_header) lerro hau jarri behar dugu, dagoena ordeztuz:

<link rel="stylesheet" href="<dtml-var blogurl missing="">/css/style_css<dtml-if "REQUEST.has_key('style')"><dtml-var style><dtml-else><dtml-if "REQUEST.SESSION.has_key('style')"><dtml-var "REQUEST.SESSION['style']"><dtml-else>07</dtml-if></dtml-if>" type="text/css" />

Honek esaten dio nabigatzaileari cookiean edo, ez badago, sesio-aldagaiean gordetako zenbakia duen estilo-orria kargatzeko, eta hauetako bat ere ez badago, defektuzkoa kargatzeko (kasu honetan 07 zenbakiduna).

Eta hau da guztia. On egin!