Esempio di tema d`esame - Università degli studi di Pavia
Transcript
Esempio di tema d`esame - Università degli studi di Pavia
1 Università degli Studi di Pavia – Corso di Laurea Interfacoltà in Comunicazione,Innovazione,Multimedialità Esame di Web Design & Technologies (Marco Porta) Appello del gg/mm/aa Cognome_______________________ Nome_________________ E-mail________________________________ Matricola_______________ (solo per chi ha frequentato STM A/B negli anni passati: A.a. 2009/10 A.a. 2008/09 ≤ A.a. 2007/08 ) Si risponda alle seguenti domande, giustificando sempre le risposte. Il presente foglio deve essere consegnato piegato a metà in modo che questa facciata sia la “copertina”. In caso di mancanza di spazio, si può usare la “brutta” (che va in ogni caso consegnata) ed eventuali fogli aggiuntivi (da chiedere), facendo attenzione a riportare su ognuno di essi i propri dati e i numeri delle domande 1. Per ognuna delle seguenti affermazioni, si dica se è vera o falsa, giustificando la risposta: (4) a. Il servizio Telnet viene usato per il trasferimento di file V F b. L’utilizzo di un firewall rende superfluo il meccanismo della firma digitale V F c. Il protocollo TCP/IP utilizza sempre la commutazione di circuito V F d. L’XHTML è un HTML con molti più tag V F e. Il multicasting è utile nella distribuzione di contenuti multimediali V F f. Un sito dinamico è un sito che contiene animazioni V F g. Gli effetti rollover sono creati con tecnologie lato client V F h. Le applet Java e i programmi CGI sono tecnologie simili V F CIM – Esame di Web Design & Technologies (Marco Porta), appello del ../../…. 2. Dato il seguente codice HTML/CSS, si fornisca una rappresentazione “grafica” qualitativa che si avvicini il più possibile all’aspetto della pagina web risultante (come visualizzata dal browser): (4,5) <html> <head> <title>CIM</title> <style type="text/css"> #intestazione { background-color: lightgreen; height: 70px; } #contenuto { margin-left: 200px; } #menu { width: 190px; background-color: yellow; position: absolute; top: 70px; left: 0px; } </style> </head> <body> <div id="intestazione"><h1>Comunicazione, Innovazione, Multimedialità</h1></div> <div id="contenuto"> <table border="1" cellpadding="15" width="50%" align="center"> <tr> <td colspan="2"> Il Corso di Laurea in <em>Comunicazione, Innovazione, Multimedialità</em> (CIM) è un Corso di Laurea interfacoltà. </td> </tr> <tr> <td><img src="/loghi/logocim.gif" width="100" height="100" alt="Logo CIM" /></td> <td> Si deve scegliere CIM se nella propria vita c'è il desiderio motivato di lavorare nei media nuovi o più tradizionali </td> </tr> </table> </div> <div id="menu"> <ul> <li><a href="descrizioni/cl/eco.html">Economia</a></li> <li><a href="descrizioni/cl/giuri.html">Giurisprudenza</a></li> <li><a href="descrizioni/cl/ing.html">Ingegneria</a></li> <li><a href="descrizioni/cl/let.html">Lettere</a></li> <li><a href="descrizioni/cl/sp.html">Scienze Politiche</a></li> </ul> </div> </body> </html> CIM – Esame di Web Design & Technologies (Marco Porta), appello del ../../…. 3. Si risponda alle seguenti domande: (1,5) a) Dove si trova, rispetto alla directory contenente il file HTML definito al punto 2, il file eco.html? b) Sempre relativamente al file del punto 2, supponendo che l’amministratore del web server abbia definito come directory di root C:\web\www, qual è il percorso (cioè la posizione effettiva) del file logocim.gif sulla macchina? (c:\…) c) Come si definisce l’intestazione di un form di nome mioform, che, usando il metodo get, invia i dati al programma CGI elabora.tcl (con percorso assoluto /cgi-bin/)? a. b. c. 4. Si vuole definire un foglio di stile esterno, di nome st.css, che specifichi che: (1) la pagina deve avere un font di tipo Arial (in alternativa sans-serif), uno sfondo bianco e un margine sui quattro lati pari a una volta e mezza la dimensione di default del font; (2) la classe grassetto per l’elemento <p> deve essere caratterizzata da testo in grassetto (valore bold per la proprietà font-weight). Si indichino (in modo chiaro): (a) il contenuto del CSS e (b) le modifiche da apportare al codice HTML affinché il foglio di stile venga caricato nella pagina [1] e un tag <p> sfrutti le caratteristiche della classe grassetto [2] (2) Contenuto CSS Modifiche file HTML 1 2 5. Dato il seguente flow-chart, si indichi il valore finale delle variabili q, r e x, specificando i valori intermedi che esse assumono. Quale algoritmo viene descritto? (2) x = 32 y=9 q=0 x =x - y q= q +1 No x<0 Sì r=x+y q=? r=? x=? CIM – Esame di Web Design & Technologies (Marco Porta), appello del ../../…. 6. Per la creazione del sito di una facoltà universitaria, si vuole usare l’XML per modellizzare l’entità corso di laurea, a parole così descritta: “Un corso di laurea è caratterizzato da un nome, un tipo (triennale o specialistica) e da un elenco di corsi (insegnamenti). Ogni corso è caratterizzato da un nome, da un anno (1°, 2°, ecc.), da un trimestre (1°, 2°, 3° o 4°), e da un docente. Ogni docente può avere uno o più collaboratori”. Si definiscano dei tag e degli attributi opportuni in grado di caratterizzare l’entità, e si usino poi per rappresentare il corso di laurea triennale in “Scienze Matematico Letterarie”, che include, tra gli altri, i seguenti corsi: “Fondamenti di letteratura algebrica” (del 1° anno, 2° trimestre, con docente “Giovanni Rossi”, che si avvale della collaborazione di “Mario Bianchi”), “Linguistica algoritmica” (del 2° anno, 1° trimestre, con docente “Roberto Verdi”, che si avvale della collaborazione di “Angelo Marrone” e “Luisa Bruni”), “Romanticismo ed equazioni differenziali” (del 3° anno, 4° trimestre, con docente “Marco Gialli”, senza collaboratori). Si applichino direttamente i tag e gli attributi identificati all’esempio, e solo poi, eventualmente, si definisca un DTD (4) CIM – Esame di Web Design & Technologies (Marco Porta), appello del ../../…. 2 Università degli Studi di Pavia – Corso di Laurea Interfacoltà in Comunicazione,Innovazione,Multimedialità Esame di Web Design & Technologies (Marco Porta) Appello del gg/mm/aa Cognome_______________________ Nome_________________ Matricola_______________ Si risponda alle seguenti domande, giustificando sempre le risposte. Il presente foglio deve essere consegnato piegato a metà e inserito nel foglio 1. In caso di mancanza di spazio, si può usare la “brutta” (che va in ogni caso consegnata) ed eventuali fogli aggiuntivi (da chiedere), facendo attenzione a riportare su ognuno di essi i propri dati e i numeri delle domande 7. Dato il seguente codice HTML/JavaScript, si indichi sinteticamente (ma in modo chiaro) il significato di ogni riga contrassegnata da un numero. Si descriva poi brevemente il “comportamento generale” della pagina (3) <html> <head> <title>Una pagina con codice JavaScript</title> <style> body { background: white; } </style> <script type="text/javascript"> 1. col = new Array(3); col[0] = "red"; col[1] = "yellow"; col[2] = "white"; 2. function cs(i) { 3. document.body.style.background = col[i]; if ( i != 2 ) document.f.visualizza.value = col[i]; else document.f.visualizza.value = ""; } </script> </head> 4. <body onload="alert('Benvenuti! Qui si sperimenta JavaScript!')"> <form name="f"> Colore: <input type="text" name="visualizza" readonly size="20" /> </form> <table width="300" height="100"> <tr> <td style="background-color: red" onmouseover="cs(0)"></td> <td style="background-color: yellow" onclick="cs(1)"></td> </tr> </table><br /> <a href="javascript:cs(2)">Reset</a><br /> </body> </html> 1. 2. 3. 4. CIM – Esame di Web Design & Technologies (Marco Porta), appello del ../../…. Comportamento generale della pagina 8. Si vuole utilizzare il seguente form come interfaccia per la conversione da Euro a Lire e viceversa. In pratica, si vuole che quando l’utente inserisce un valore (che si suppone numerico) in uno dei due campi Euro o Lire, e poi clicca “da un’altra parte” (ad esempio, ma non necessariamente, preme il bottone Converti), nell’altro campo appaia il valore corrispondente (si ricordi che 1 Euro = 1936.27 Lire). Si definiscano opportune funzioni JavaScript (da supporre nella sezione HEAD della pagina) che permettano di raggiungere lo scopo, e si completino la parti mancanti (i valori degli attributi onchange) degli input testuali (1,5) ... <form name="convform"> Euro <input type="text" name="euro" size="15" onchange="_________________________" /> Lire <input type="text" name="lire" size="15" onchange="_________________________" /><br /><br /> <input type="button" value="Converti" /> </form> ... 9. In una certa zona di una pagina Web c’è l’immagine di un gatto; dopo 10 secondi esatti dal caricamento della pagina appare l’immagine di un cane (che rimane poi fissa). Cliccando su ciascuna immagine viene aperta una pagina corrispondente. Si dica in modo chiaro, giustificando le risposte, quali “tecnologie”, tra quelle elencate di seguito, possono essere utilizzate per raggiungere lo scopo, da sole o eventualmente in combinazione tra loro (2) HTML CSS Sì No Sì No JavaScript Java Sì No GIF animate Flash CGI Sì No Sì No Sì No Sì No PHP / ASP Sì No CIM – Esame di Web Design & Technologies (Marco Porta), appello del ../../…. 10. Avendo come obiettivo la minimizzazione della dimensione del file ottenuto, si dica, giustificando la risposta, se per l’implementazione dell'animazione descritta di seguito è meglio utilizzare un approccio bitmap, un approccio vettoriale, o non c’è sostanziale differenza tra i due (1,5) Fotografia di un cane che si muove circolarmente (una sola volta) Bit. Vett. Indiff. 11. Qual è la funzione del DNS all’interno di una rete locale? (2) 12. Possono XML e HTML essere messi sullo stesso piano? E’ corretto dire che lo scopo dell’XML è quello di permettere una visualizzazione più sofisticata dei dati? (2) 13. Cosa sono gli application server? Quali sono i loro utilizzi tipici? (2)