Florian/SNT
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web : questions et exercices dans des blocs question

Browse Source
This commit is contained in:
admin
2026-10-02 10:15:08 +02:00
parent cb4ac95f50
commit cd73524086
10 changed files with 556 additions and 467 deletions
Download Patch File Download Diff File Expand all files Collapse all files
sequences/web/tp/tp2_experience_utilisateur.md
+87 -87
View File
@@ -34,28 +34,28 @@ Une bonne UX, c'est quand :
| **Rapidite** | Le site charge-t-il vite ? | Pas d'attente excessive, images optimisees |
| **Adaptabilite** | Le site s'affiche-t-il bien sur mobile ? | Design responsive, boutons assez grands |
### Exercice 1.1
!!! question "Exercice 1.1"
Repondez aux questions suivantes :
Repondez aux questions suivantes :
1. Citez un site web que vous trouvez agreable a utiliser. Pourquoi ?
2. Citez un site web que vous trouvez penible a utiliser. Pourquoi ?
3. Parmi les 4 criteres ci-dessus, lequel vous semble le plus important ? Justifiez.
1. Citez un site web que vous trouvez agreable a utiliser. Pourquoi ?
2. Citez un site web que vous trouvez penible a utiliser. Pourquoi ?
3. Parmi les 4 criteres ci-dessus, lequel vous semble le plus important ? Justifiez.
---
## Partie 2 : Analyse de sites web (25 min)
### Consigne
!!! question "Consigne"
Vous allez evaluer **3 sites web** en utilisant la grille d'evaluation ci-dessous. Pour chaque site, attribuez une note de 1 a 5 pour chaque critere.
Vous allez evaluer **3 sites web** en utilisant la grille d'evaluation ci-dessous. Pour chaque site, attribuez une note de 1 a 5 pour chaque critere.
**Echelle de notation :**
- 1 = Tres mauvais
- 2 = Mauvais
- 3 = Moyen
- 4 = Bon
- 5 = Tres bon
**Echelle de notation :**
- 1 = Tres mauvais
- 2 = Mauvais
- 3 = Moyen
- 4 = Bon
- 5 = Tres bon
### Sites a evaluer
@@ -65,45 +65,45 @@ Vous allez evaluer **3 sites web** en utilisant la grille d'evaluation ci-dessou
| 2 | Site du lycee | https://charlotteperriand.etab.ac-lille.fr |
| 3 | Un site de votre choix | (jeu video, sport, musique...) |
### Grille d'evaluation
!!! question "Grille d'evaluation"
Recopiez et completez ce tableau pour **chacun des 3 sites** :
Recopiez et completez ce tableau pour **chacun des 3 sites** :
**Site 1 : Wikipedia**
**Site 1 : Wikipedia**
| Critere | Note /5 | Justification |
|---------|---------|---------------|
| Lisibilite | | |
| Navigation | | |
| Rapidite | | |
| Adaptabilite (testez en redimensionnant la fenetre) | | |
| **Total** | **/20** | |
| Critere | Note /5 | Justification |
|---------|---------|---------------|
| Lisibilite | | |
| Navigation | | |
| Rapidite | | |
| Adaptabilite (testez en redimensionnant la fenetre) | | |
| **Total** | **/20** | |
**Site 2 : Site du lycee**
**Site 2 : Site du lycee**
| Critere | Note /5 | Justification |
|---------|---------|---------------|
| Lisibilite | | |
| Navigation | | |
| Rapidite | | |
| Adaptabilite | | |
| **Total** | **/20** | |
| Critere | Note /5 | Justification |
|---------|---------|---------------|
| Lisibilite | | |
| Navigation | | |
| Rapidite | | |
| Adaptabilite | | |
| **Total** | **/20** | |
**Site 3 : ..................**
**Site 3 : ..................**
| Critere | Note /5 | Justification |
|---------|---------|---------------|
| Lisibilite | | |
| Navigation | | |
| Rapidite | | |
| Adaptabilite | | |
| **Total** | **/20** | |
| Critere | Note /5 | Justification |
|---------|---------|---------------|
| Lisibilite | | |
| Navigation | | |
| Rapidite | | |
| Adaptabilite | | |
| **Total** | **/20** | |
### Questions de synthese
!!! question "Questions de synthese"
4. Quel site a obtenu la meilleure note ? Pourquoi selon vous ?
5. Pour le site le moins bien note, proposez **2 ameliorations concretes**.
6. Pour tester l'adaptabilite mobile, vous avez redimensionne la fenetre. Connaissez-vous une autre methode ? (Indice : outils de developpement du navigateur, touche F12)
4. Quel site a obtenu la meilleure note ? Pourquoi selon vous ?
5. Pour le site le moins bien note, proposez **2 ameliorations concretes**.
6. Pour tester l'adaptabilite mobile, vous avez redimensionne la fenetre. Connaissez-vous une autre methode ? (Indice : outils de developpement du navigateur, touche F12)
---
@@ -157,62 +157,62 @@ Le texte respire, on a envie de lire.
**Regle** : Plus de la moitie du trafic web se fait sur mobile. Un site **doit** s'adapter a toutes les tailles d'ecran.
### Exercice 3.1
!!! question "Exercice 3.1"
Pour chaque situation, indiquez s'il s'agit d'une **bonne** ou **mauvaise** pratique :
Pour chaque situation, indiquez s'il s'agit d'une **bonne** ou **mauvaise** pratique :
| Situation | Bonne / Mauvaise ? |
|-----------|---------------------|
| Un menu de navigation avec 25 liens | |
| Un bouton "Retour en haut" sur une longue page | |
| Du texte gris clair sur fond blanc | |
| Des images qui mettent 10 secondes a charger | |
| Un formulaire qui indique clairement les erreurs en rouge | |
| Un site qui fonctionne uniquement sur ordinateur | |
| Un lien qui change de couleur quand on l'a deja visite | |
| Une page d'accueil avec 3 pop-ups publicitaires | |
| Situation | Bonne / Mauvaise ? |
|-----------|---------------------|
| Un menu de navigation avec 25 liens | |
| Un bouton "Retour en haut" sur une longue page | |
| Du texte gris clair sur fond blanc | |
| Des images qui mettent 10 secondes a charger | |
| Un formulaire qui indique clairement les erreurs en rouge | |
| Un site qui fonctionne uniquement sur ordinateur | |
| Un lien qui change de couleur quand on l'a deja visite | |
| Une page d'accueil avec 3 pop-ups publicitaires | |
---
## Partie 4 : Quiz recapitulatif (10 min)
!!! question "Partie 4 : Quiz recapitulatif (10 min)"
Repondez aux questions suivantes :
Repondez aux questions suivantes :
**Question 1** : Que signifie UX ?
- a) Universal eXchange
- b) User eXperience
- c) Ultra eXpress
- d) Unified eXtension
**Question 1** : Que signifie UX ?
- a) Universal eXchange
- b) User eXperience
- c) Ultra eXpress
- d) Unified eXtension
**Question 2** : Quelle taille de police minimale est recommandee pour le texte d'un site web ?
- a) 8px
- b) 12px
- c) 16px
- d) 24px
**Question 2** : Quelle taille de police minimale est recommandee pour le texte d'un site web ?
- a) 8px
- b) 12px
- c) 16px
- d) 24px
**Question 3** : Pourquoi est-il important qu'un site s'adapte aux mobiles ?
- a) Parce que c'est plus joli
- b) Parce que plus de la moitie du trafic web est sur mobile
- c) Parce que Google l'exige
- d) Ce n'est pas important
**Question 3** : Pourquoi est-il important qu'un site s'adapte aux mobiles ?
- a) Parce que c'est plus joli
- b) Parce que plus de la moitie du trafic web est sur mobile
- c) Parce que Google l'exige
- d) Ce n'est pas important
**Question 4** : Lequel de ces elements ameliore la navigation ?
- a) Supprimer le menu
- b) Ajouter un fil d'Ariane
- c) Mettre tous les liens en noir sans soulignement
- d) Cacher le bouton retour
**Question 4** : Lequel de ces elements ameliore la navigation ?
- a) Supprimer le menu
- b) Ajouter un fil d'Ariane
- c) Mettre tous les liens en noir sans soulignement
- d) Cacher le bouton retour
**Question 5** : Un bon contraste signifie :
- a) Texte et fond de la meme couleur
- b) Texte clair sur fond clair
- c) Texte sombre sur fond clair (ou inversement)
- d) Utiliser uniquement du noir et blanc
**Question 5** : Un bon contraste signifie :
- a) Texte et fond de la meme couleur
- b) Texte clair sur fond clair
- c) Texte sombre sur fond clair (ou inversement)
- d) Utiliser uniquement du noir et blanc
**Question 6** : Quel outil du navigateur permet de simuler un affichage mobile ?
- a) Le gestionnaire de telechargements
- b) Les outils de developpement (F12)
- c) Le mode navigation privee
- d) Le gestionnaire de favoris
**Question 6** : Quel outil du navigateur permet de simuler un affichage mobile ?
- a) Le gestionnaire de telechargements
- b) Les outils de developpement (F12)
- c) Le mode navigation privee
- d) Le gestionnaire de favoris
---