Examen

Ecole SITI
Rue des Crayres

BP 1034, 51687 REIMS Cedex 2
tel 03 26 36 80 20
Correction dexamen
Anne universitaire 2012 - 213
Unit denseignement
Code de lUE
NFA074
Intitul
Conception dun site web
Enseignant (s)
A. RENARD
Examen
Session
09/02/2013
Date
1re session
Horaires
13h15-15h15
Dure
2 heures
Consignes particulires
Pour cette preuve, vous avez le droit uniquement vos supports de cours ainsi qu vos documents
personnels. Aucun livre ou autre document nest autoris.
Vous rpondrez aux exercices 1 3 directement sur le sujet que vous devez imprativement rendre
avec votre copie.
Chaque exercice prsente une indication du barme et du temps ncessaire sa rsolution.
Vos codes devront respecter les instructions du cours.
En cas de problme durant lpreuve, joindre le Cnam Champagne-Ardenne au 03 26 36 80 07,
03.26.36.80.10 ou 03.26.36.80.20.
EVA PR01 F05

Version 02
1/6
Exercice 1 Questions de cours (15%) :

A. Dfinissez le W3C, son rle et un exemple concret de ce quil peut apporter au dveloppeur.
Le W3C est un consortium qui a pour but de normaliser les technologies lies au web, dont HTML, CSS et
javascript. Do son nom, Word Wide Web Consortium
A titre dexemple concret, le W3C propose un outil de validation (syntaxe, encodage, DOM, ) de page html
B. Listez quels sont les outils ncessaires au dveloppement dun site en HTML CSS Javascript.
Un diteur (avec coloration syntaxique, compltion, auto indentation, ftp )

Des navigateurs (plusieurs, de plusieurs versions, et les plugins pour dvelopper comme web
developper pour Firefox
Un systme de validation de type W3C
Exercice 2 QCM (15%) :

Rpondez directement sur le sujet
1. Quel est le code HTML permettant de crer un lien ?
A. <a>http://ne.pleiad.net </a>
B. <a href="http://ne.pleiad.net">Site du CNAM</a>
C. <a name="http://ne.pleiad.net</a>
D. <a url=" http://ne.pleiad.net">Site du CNAM</a>
2. Lesquelles parmi ces balises sont des balises de dfinition des tableaux ?
A. <thead><body><tr>
B. <table><tr><tt>
C. <table><head><tfoot>
D. <table><tr><td>
3. Les balises et le texte qui ne sont pas visibles directement sur une page HTML (par exemple le titre)
doivent tre places dans :
A. Le corps de la page (Balise body)
B. Len-tte de la page (Balise head)
C. Les tableaux (Balise table)
4. Quelle balise provoque un retour la ligne ?
A. <nl/>
B. <NEWLINE/>
C. <br/>
D. <hr/>
5. Quel est le rle de la balise <titre> ?
A. crire en grand
B. centrer un titre
C. dfinir le titre du document
6. Quelle balise introduit une liste numrote ?
A. <ln>
B. <ol>
C. <listnum>
D. <h1>
7. Quel est le rle de la balise <body> ?
A. criture en plus petit
B. dbut de paragraphe
C. liste puces
D. corps du fichier
NFA074
2/6
09/02/2013
8. Quelle est la couleur reprsente par #ffffff ?

A. blanc
B. noir
C. gris clair
D. gris fonc
9. Parmi les lignes de code HTML suivantes, laquelle permet de dcrire la liste puces ci-dessous ?
Fruits
o Banane
o Fraise
Legumes
A. <ul><li>Fruits</li><ul><li>Banane</li><li>Fraise</li></ul><li>Legumes</li></ul>
B. <ul><li>Fruits<ol><li>Banane</li><li>Fraise</li></ol></li><li>Legumes</li></ul>
C. <ul><li>Fruits<ul><li>Banane</li><li>Fraise</li></ul></li><li>Legumes</li></ul>
D. <ul><li>Fruits<ul><li>Banane</li></ul></li><li>Fraise</li><li>Legumes</li></ul>
Exercice 3 Cration dune page web (25%) :

Afin de raliser la page web ci-dessous :
A. Directement sur le sujet, identifiez et dcrivez les lments (balises) HTML prsents
NFA074
3/6
09/02/2013
B. Ecrivez le code html et les rgles CSS lies du contenu du bloc avec la bordure en pointills.
#blocDroite{width:550px;float:left;border:5px dotted #333333;padding:10px;}

.souligne{text-decoration:underline;}
.important{font-weight:bold}
.etrange{font-style:italic;}
.c1{color:#ff0000;}
.c2{color:#0000ff;}
.c3{color:#00ff00;}
<div id='blocDroite'>
<h1>Mon ...</h1>
<p>J'ai eu la chance... <span class='etrange'>excellent,</span> puis ...</p>
<ul>
<li>Du ... <span class='souligne'>J'adore</span>)</li>
<li>Du ...</li>
<li>De la ...</li>
<li>Une ...</li>
</ul>
<p>Et le tout ... <span class='important'>Champagne !</span></p>
<p>Aprs ...</p>
<div style='text-align:center;'>
<ol>
<li>Mamie ... <span class='c1'>des ...</span></li>
<li>Mamie ...<span class='c2'>des ...</span></li>
<li>Tonton ...<span class='c3'>des ...</span></li>
</ol>
</div>
</div>
NFA074
4/6
09/02/2013
Exercice 5 Javascript (25%) :

En javascript :
Math.random() retourne un nombre alatoire entre 0 et 1
Math.round( floatvalue ) retourne la partie entire du nombre quon lui passe en paramtre
A. Ecrire la fonction aleatoire(n) qui retourne un entier alatoirement entre 0 et n
// fonction pour gnrer un nombre entier alatoire entre 0 et n

function aleatoire(n){
// gnration d'un nombre flottant ( virgule) entre 0 et 1
r = Math.random();
// en le multipliant par n, j'ai donc un nombre flottant ( virgule) entre 0 et n
r = r * n;
// je ne garde que la partie entire
r = Math.round(r);
// je retourne la valeur
return r;
// version en une seule ligne
return Math.round(n*Math.random());
}
B. Ecrire le code javascript qui gnre un entier alatoire de 0 100 puis demande au visiteur de le
deviner. A chacune de ses propositions, une indication trop grand ou trop petit est fournie
linternaute. Une fois la valeur trouve, un message le lui indique ainsi que le nombre dessais.
x = aleatoire(100);// gnration d'un nombre entier de 0 100

count=1;// initialisation du nombre d'essais 1
p = prompt("Proposez un nombre"); // premier essai
while(p!=x){ // on va demander jusqu'a ce que la valeur propose soit la bonne
if(p<x)
alert("Trop petit");
else
alert("Trop grand");
count++;// incrmentation du nombre d'essais 1
p = prompt("Proposez un nombre"); // nouvel essai
}
alert("Trouv en "+count+" essais");
NFA074
5/6
09/02/2013
Exercice 6 Javascript et DOM (20%) :

A. Ecrire la fonction virus() qui va procder une permutation circulaire des url des liens contenus sur
la page en cours.
function virus(){
// rcupration de tous les a du documents
liens = document.getElementsByTagName("a");
// on conserve le valeur de l'attribut href du premier lien pour l'attribuer au dernier en fin de parcours
prem = liens[0].href;
// permutation : attribuer chaque lien le href du suivant (sauf pour le dernier)
for(i=0;i<liens.length-1;i++)
liens[i].href=liens[i+1].href;
// prem est la valeur de l'attribut href du dernier lien
liens[liens.length-1].href = prem;
}
B. Cette fonction est dclenche automatiquement toutes les 20 secondes, ds le chargement de la page.
function doVirus(){
// appeler la fonction virus
virus();
// appeler la fonction doVirus de nouveau dans 20 secondes
setTimeout("doVirus()",20000);
}
<body onload='doVirus()'>
NFA074
6/6
09/02/2013

Examen

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Examen

Încărcat de

Drepturi de autor:

Formate disponibile

Ecole SITI

Rue des Crayres

Conception dun site web

EVA PR01 F05

Exercice 1 Questions de cours (15%) :

Un diteur (avec coloration syntaxique, compltion, auto indentation, ftp )

Exercice 2 QCM (15%) :

8. Quelle est la couleur reprsente par #ffffff ?

Exercice 3 Cration dune page web (25%) :

#blocDroite{width:550px;float:left;border:5px dotted #333333;padding:10px;}

Exercice 5 Javascript (25%) :

// fonction pour gnrer un nombre entier alatoire entre 0 et n

x = aleatoire(100);// gnration d'un nombre entier de 0 100

Exercice 6 Javascript et DOM (20%) :

S-ar putea să vă placă și