Niquelao » 網誌存檔 » acc_slide：以 XHTML、CSS 與 JavaScript 製作的簡報

» Arxiu del weblog » acc_slide: Presentacions amb XHTML, CSS i javascript Niquelao acc_slide: Presentacions amb XHTML, CSS i javascript 15 d’Abril de 2007, per Rumoroso Per fi ha arribat el moment de publicar-ho. Feia temps que hi estava treballant però, per un motiu o un altre, no ho vaig poder fer fins ara.

Aquí teniu el nou sistema per fer presentacions amb XHTML, CSS i javascript. Suposo que alguns ja coneixereu més d’un sistema dels que s’utilitzen habitualment, com per exemple l’HTML Slidy del W3C o l’S5 d’Eric Meyer. Després d’utilitzar-los vaig arribar a la conclusió que, tot i ser bons, hi havia alguna cosa que potser es podria millorar (segons el meu criteri, és clar). Com he dit, tots dos sistemes són bons i vàlids, però en tots dos cal utilitzar marcatge la única finalitat del qual és que l’script l’utilitzi i hi apliqui estils.

Si realment es vol tenir alguna cosa eficaç, per què no fer que el propi script generi el marcatge que necessita de forma intel·ligent? El desenvolupament Em vaig posar mans a l’obra amb la premissa següent: Si tenim un document correctament estructurat i marcat (amb els seus encapçalaments, paràgrafs, llistes…), l’script ha de ser prou intel·ligent com per organitzar i generar la presentació, tot això sense incloure cap contenidor addicional, ni classes, ni id. Únicament ha de ser la pròpia estructura del document la que permeti diferenciar què s’ha d’incloure a cada diapositiva.

Després de barallar-m’hi, aquí teniu el resultat. L’acc_slide , o com l’Andrés i en Maroto en diuen, rumo_slide o slide_oso . En lloc de seguir escrivint més sobre això, el millor és demostrar de què estic parlant.

He preparat dues presentacions, totes dues amb la descripció del sistema i de la seva utilització. La diferència entre totes dues és el grau de resum. No dubteu a fer un cop d’ull al marcatge que he emprat per veure de què estic parlant: nota: tot i que la forma de navegació per la presentació es tracta a la mateixa, la forma bàsica de moure’s pels continguts es realitza amb les fletxes (amunt i avall) del teclat.

Versió reduïda i Versió reduïda descarregable Versió estesa (sí, molt estesa) i Versió estesa descarregable Característiques bàsiques acc_slide ha estat creat tenint com a objectiu la separació absoluta entre el contingut i el comportament, evitant qualsevol consideració sobre aquest a l’hora de crear i marcar la informació que es vulgui mostrar. Entre les característiques que el sistema de presentacions acc_slide posseeix es poden destacar: Únicament requereix d’una correcta i lògica estructuració del contingut mitjançant l’ús d’encapçalaments.

Related: UserWay — Widget de accesibilidad con plan gratuito para empezar hoy mismo.

No necessita elements addicionals més enllà dels necessaris per al marcatge semàntic del contingut. El sistema reconstrueix i adapta l’arbre DOM, amb la qual cosa no imposa la necessitat d’un marcatge concret.

Això el fa compatible amb qualsevol document (X)HTML ben estructurat (fins i tot amb els que inclouen el marcatge emprat per altres sistemes de presentacions). Això el fa totalment versàtil. Es podria utilitzar sobre un document web, sobre el marcatge emprat en els altres sistemes de presentacions, etc. Respectuós amb els estàndards i l’accessibilitat.

Separació absoluta de contingut, presentació i comportament. Fàcil integració i fàcil utilització. No requereix coneixements específics, i si s’utilitza un dels temes proposats, no cal conèixer CSS.

Worth a look: AudioEye — Accesibilidad gestionada: automatización combinada con revisión humana.

Permet crear seccions amb grups de diapositives. L’aspecte gràfic ofereix gran versatilitat i es controla totalment amb CSS. A més es poden crear diversos estils i jugar amb l’especificitat de selector per aplicar-los (i combinar-los) en calent (mentre s’executa la presentació).

Sistema autoplay de reproducció automàtica. Incorpora un sistema per obrir enllaços de forma integrada a la presentació. Si s’inclou l’atribut title a l’enllaç, el contingut d’aquest es mostrarà al peu de la finestra.

A més, el destí de l’enllaç pot ser una URL o una imatge. Cada diapositiva s’associa amb una àncora de tal manera que es pot anar directament a la que es desitgi. L’àncora coincideix amb la posició de la diapositiva a la presentació. Arribats a aquest punt, espero el vostre feedback.

També estava pensant crear un repositori públic d’estils per al sistema. Si us sembla una bona idea i voleu participar amb els vostres, no ho dubteu. Podeu enviar els vostres temes a rumoroso@niquelao.net acc_slide: Presentacions amb XHTML, CSS i javascript Categoria: (X)HTML, Accessibilitat, CSS, Javascript —> 2 comentaris Claudio 15 d’Octubre de 2007 Les meves felicitacions per tan important emprenedoria.

Juntament amb un amic el farem servir per a una presentació. Un dubte: vaig poder descarregar la versió reduïda, però no ho vaig aconseguir amb l’estesa. M’interessa més l’estesa perquè, aparentment, usa el propi text de l’etiqueta H2 com a element decoratiu de les diapositives, evitant la imatge, però demostrant d’una forma molt bonica que no cal una imatge per decorar. Aquest punt m’interessa especialment perquè la presentació serà davant d’usuaris de Microsoft .

Estic veient els codis de la versió reduïda però el meu desconeixement del Javascript m’impedeix, per ara, poder modificar-lo. Per si no ho vaig deixar clar al principi: la teva feina és de molta utilitat, molt millor que les altres opcions i… bonica. Les meves felicitacions.

Related: IAAP CPACC / WAS Certification — La certificación profesional que acredita tu experiencia en accesibilidad.

Rumoroso 15 d’Octubre de 2007 Hola Claudio. Gràcies per les teves paraules i m’alegro que et pugui ser útil. Acabo de pujar la versió ampliada en format descarregable.

He posat l’enllaç a l’article. Espero que et serveixi. Si tens dubtes sobre com funciona o alguna cosa, digues-m’ho, i si vols compartir amb nosaltres l’estil que hi apliquis, encantat.

Gràcies. Una salutació Pots fer un seguiment dels comentaris gràcies al feed RSS 2.0 . També pots enviar un trackback des del teu lloc. Article anterior: Actualització d’acc_calendar Article següent: Escuas —> —> —> Aquesta obra està sota una llicència de Creative Commons .

P.S. A few readers have asked which superposición de accesibilidad (overlay) we actually reach for — it's accessiBe; take a look here if you want the current details.