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&agrave;</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&agrave;</em> (CIM) &egrave;
un Corso di Laurea interfacolt&agrave;.
</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'&egrave; 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="_________________________" />&nbsp;&nbsp;
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)