La pràctica de Llenguatges i estàndards web. www.elsmeusapunts.es

1. Estudis d’Informàtica, Multimèdia i Telecomunicació
Grau en Multimèdia
Llenguatges i estàndards web
Pràctica

Per a dubtes i aclariments sobre l'enunciat, heu de dirigir-vos al consultor
responsable de la vostra aula.

Tots els arxius de la pràctica han de lliurar-se com un únic arxiu
comprimit, .zip o .rar.

Cal lliurar la solució en un missatge en l'espai Lliurament i registre d'AC.

La data límit de lliurament és el 3 de juny fins a les 24 hores.

No s'acceptarà com a resposta textos copiats literalment del material docent
de l'assignatura. En cas d'usar-se altres fonts, la còpia literal tampoc serà
acceptada i haurà de citar-se la font.
Propietat intel·lectual
Amb freqüència és inevitable, en produir una obra multimèdia, fer ús de recursos
creats per terceres persones. És per tant comprensible fer-ho en el marc d'una
pràctica dels estudis del Grau en Multimèdia, sempre que això es documenti
clarament i no suposi plagi en la pràctica.
Per tant, en presentar una pràctica que faci ús de recursos aliens, haurà de
presentar-se juntament amb ella un document en què es detallin tots ells,
especificant el nom de cada recurs, el seu autor, el lloc en què es va obtenir i el
seu estatus legal: si l'obra està protegida pel copyright o s'acull a alguna altra
llicència d'ús (Creative Commons, llicència GNU GPL...). L'estudiant haurà
d'assegurar-se que la llicència que sigui no impedeix específicament el seu ús en
el marc de la pràctica. En cas de no trobar la informació corresponent haurà
d'assumir-se que l'obra està protegida pel copyright.
A més, hauran d’adjuntar-se els arxius originals quan les obres usades siguin
digitals, i el seu codi font si correspon.
Un altre punt a considerar és que qualsevol pràctica que faci ús de recursos
protegits pel copyright no podrà en cap cas publicar-se a Mosaic, la revista del
Grau en Multimèdia, tret que els propietaris dels drets intel·lectuals donin la seva
autorització explícita.

2. Enunciat
Part 1
Obligatòria per a tots els alumnes
L’equip editorial de la revista electrónica Digithum, una revista impulsada pels Estudis d’Arts i
Humanitats de la Universitat Oberta de Catalunya, ha decidit publicar els seus continguts en
format web.
Com alumnes de l’assignatura de Llenguatges i Estàndards Web, se’ns ha demanat fer el
redisseny de la revista, tot conservant l’estructura dels continguts.
Els elements que s’hauran de tenir en compte serán els següents:





Capçalera: Si observem la portada de la revista, la capçalera del dossier podria
considerar-se com una única imatge. Però com que sabem que, per temes
relacionats amb l’accessibilitat, les imatges que contenen text s’haurien d’evitar,
separarem el nom de la revista de la imatge de fons. A més a més, tindrem en
compte que a la resta de pàgines també s’inclou el nom de la Universitat, l’adreça
web de la revista i el títol de l’article.
Peu de página: El peu de pàgina contindrà el nom, número i ISSN de la revista, el
propòsit d’aquesta, l’autor de l’article (si es dona el cas) i el logotip de la UOC.
Sumari. El sumari del dossier haurà d’enllaçar als diferents articles de la revista.
Navegació: Per una banda, haurem de fer una proposta de navegació mitjançant
molles de pa o breadcrumbs i per l’altra haurem de donar l’opció de moure’ns per les
diferents pàgines del dossier.
El contingut. El contingut de la revista haurà d’estar etiquetat correctament i
respectar tant el nombre de columnes com la disposició de les imatges.
El prototip haurà de tenir les pàgines corresponents a la portada i a l’article d’Avatar =
Pinotxo 2.0 o “la fi de la societat de l’espectacle” (revista_cat.pdf).
Part 2
Obligatòria per als estudiants que no segueixen l’avaluació continuada
Dins el redisseny de la primera part, ens han demanat afegir 2 planes noves a la web:
Plana amb formulari de contacte
Es tracta d’un arxiu HTML acompanyat del seu corresponent CSS, que contingui un
formulari de contacte de la web.
El formulari ha de preguntar a l'usuari les següents dades:


Nom i cognoms (en dos camps diferents). Camp obligatori.
Adreça de correu electrònic. Camp obligatori.

3. 


Raó per la qual vol contactar (amb les opcions: ‘per a rebre més informació’, ‘per a
col·laborar’ i ‘altres’; ha de permetre seleccionar més d’una opció)
Un camp altres a omplir en el cas de que s’hagi escollit aquesta opció al camp
anterior
Forma en què l'usuari va conèixer la web. Ha d'oferir les possibilitats ‘Recomanació
d'un amic’, ‘Publicitat en premsa’, ‘Comentari en un blog’, ‘Publicitat en una xarxa
social’. Ha de permetre seleccionar més d'una opció.
Plana amb el mapa del web
Es tracta d’un arxiu HTML acompanyat del seu corresponent CSS, que contingui un mapa
del web.
Només es demana especificar el primer nivell de l’arbre (corresponent al menú principal de la
revista) i un segon nivell corresponent a l’apartat Arxiu, que trobareu a
http://digithum.uoc.edu/ojs/index.php/digithum/issue/archive). El mapa haurà de ser una llista
d’elements ben construïda, amb el títol corresponent i enllaç. Estèticament s’ha decidit
substituir els punts de la llista per elements decoratius (de lliure elecció, es pot fer servir
qualsevol que encaixi amb el disseny de la revista).
Condicions de lliurament
Orgullosos de la tasca que se’ns ha encomanat, ens hem compromès a:

Seguir els estàndards i a que totes les pàgines validin correctament tant a nivell
d’html com de css.


Presentar el codi indentat i el més “net” possible.
Crear una estructura d’arxius fàcilment replicable.

Enllaçar els links que no siguin interns a les seves destinacions originals.

Elaborar la documentació necessària que ajudi a entrendre el procediment que s’ha
seguit, per tal de poder maquetar la resta de revistes. Primer s’haurà d’explicar
l’estructura del layout, les classes i identificadors que s’han utilitzat. I després caldrà
justificar les entitats que s’han fet servir per maquetar el contingut (a excepció de <p>
i <h1> … <h6>) i els estils que s’han aplicat a la revista.

Lliurar la solució al registre d’AC i publicar la revista a l’espai personal