Repàs · Capítol 1. Com funciona el web
omple, corregeix i mira què et falla
La nota surt de les 72 preguntes de resposta curta. Les preguntes obertes no puntuen, perquè no es poden corregir soles.
La solució només surt on hagis contestat. El que deixis en blanc es queda en blanc: així no et pots donar les respostes sense pensar-hi.
Posa-hi el nom abans de descarregar el PDF: si no, no se sabrà de qui és.
Practica 1.1
a) Digues si fa de client o de servidor en cada situació.
| Situació | Client o servidor |
|---|---|
| El Firefox del teu mòbil que obre una notícia | |
| L'ordinador de l'empresa on està guardada la web del diari | |
El Chrome de l'aula que demana http://localhost |
|
| El WordPress que tens instal·lat al portàtil i que respon aquesta petició | |
| L'aplicació del temps que demana la previsió de demà |
b) Un company diu: «El meu portàtil no pot ser un servidor, perquè és un portàtil». Què li respons?
Guiat 1.2
Separa en parts http://localhost:8080/wp-admin/edit.php?post_type=page. Tens les primeres ja posades.
| Part | Valor |
|---|---|
| Protocol | http |
| Domini | localhost |
| Port | |
| Ruta | |
| Paràmetres | |
| Fragment |
Practica 1.3
Separa en parts aquestes tres URL. Si una part no hi és, escriu «no n'hi ha». Si és el port i no s'escriu, posa el que fa servir per defecte.
| URL | |
|---|---|
| a) | https://www.example.org/botiga/sabates.html?talla=42 |
| b) | http://localhost:8080/wp-login.php |
| c) | https://docs.example.net/css/colors.html#hexadecimal |
(Comprovació del primer: a la URL a) el protocol és https.)
| Part | a) | b) | c) |
|---|---|---|---|
| Protocol | |||
| Domini | |||
| Port | |||
| Ruta | |||
| Paràmetres | |||
| Fragment |
Practica 1.4
a) Què fa el DNS? Explica-ho amb un exemple que no sigui l'agenda del mòbil.
b) Una empresa trasllada la seva web a un servidor nou amb una IP diferent. Els clients han de canviar l'adreça que escriuen? Per què?
Practica 1.5
a) Ordena els set passos. Numera de l'1 al 7.
| Pas | Ordre | |
|---|---|---|
| a | El servidor prepara la resposta | |
| b | El DNS respon amb la IP | |
| c | Escrius l'adreça i prems Enter | |
| d | El navegador pinta la pàgina | |
| e | El navegador envia la petició al servidor | |
| f | El navegador pregunta al DNS la IP del domini | |
| g | El servidor envia el codi d'estat i el HTML |
b) Obres per primera vegada una pàgina que té un HTML, dos fulls d'estil i cinc imatges. Quantes peticions fa el navegador? Fes el compte.
Practica 1.6
Digues quin codi rebràs i de quina família és. Fes servir només els codis de la taula de l'apartat 5.2.
(Comprovació del primer: carregues una pàgina que funciona bé, codi 200, família 2xx.)
| Situació | Codi | Família |
|---|---|---|
| Carregues una pàgina que funciona bé | ||
| Escrius malament el nom d'una pàgina | ||
| El codi PHP del servidor té un error i no pot generar la pàgina | ||
| La web s'ha traslladat per sempre a una altra adreça i el navegador hi va sol | ||
| Intentes entrar a una carpeta del servidor on no tens permís |
Practica 1.7
a) Classifica cada peça en front-end o back-end.
| Peça | Front-end o back-end |
|---|---|
El fitxer estils.css que posa el títol en blau |
|
| El codi PHP que busca les notícies a la base de dades | |
| La base de dades MariaDB amb els usuaris registrats | |
| El HTML que el navegador rep i pinta | |
| El JavaScript que, al navegador, obre el menú quan hi fas clic | |
| La comprovació al servidor que la contrasenya és correcta |
b) Digues si cada web és estàtica o dinàmica.
| Web | Estàtica o dinàmica |
|---|---|
| La carta d'un restaurant que no canvia mai, feta amb HTML i CSS | |
| Una botiga en línia on cada client té la seva cistella | |
| Un blog fet amb WordPress | |
| El teu currículum en HTML publicat a Netlify |
c) Obres una web feta amb PHP i fas Ctrl+U. Per què no hi veus cap línia de PHP?
Guiat 1.8
Mira l'arbre de carpetes
Escriu la ruta relativa. Mira l'arbre de l'apartat 7.1. Tens les dues primeres fetes.
| Des de | Fins a | Ruta |
|---|---|---|
index.html |
img/portada.jpg |
img/portada.jpg |
noticies/esports.html |
img/logo.png |
../img/logo.png |
index.html |
noticies/esports.html |
|
noticies/esports.html |
noticies/img/partit.jpg |
|
noticies/esports.html |
index.html |
Practica 1.9
Mira l'arbre de carpetes
a) Escriu la ruta relativa. Mira l'arbre de l'apartat 7.1.
(Comprovació del primer: des de contacte.html fins a index.html, la ruta és index.html.)
| Des de | Fins a | Ruta |
|---|---|---|
contacte.html |
index.html |
|
contacte.html |
css/estils.css |
|
index.html |
noticies/img/partit.jpg |
|
noticies/esports.html |
contacte.html |
|
noticies/esports.html |
img/portada.jpg |
b) Corregeix aquests noms de fitxer perquè segueixin les regles de l'apartat 7.1.
| Nom mal posat | Nom correcte |
|---|---|
Qui Som.html |
|
Logo.PNG |
|
notícies.html |
|
Fotos Estiu 2026.jpg |
c) A index.html hi ha la imatge img/Logo.png, però el fitxer es diu logo.png. Al teu Windows es veu. Al servidor, no. Quin codi d'estat hi haurà a la pestanya Xarxa per a aquesta imatge, i per què?
A. Vertader o fals
| Frase | V o F | Per què |
|---|---|---|
| Un portàtil pot fer de servidor | ||
https://www.example.com i https://www.example.com:443 són la mateixa adreça |
||
El fragment (#) s'envia al servidor |
||
| Un 404 vol dir que el servidor ha caigut | ||
| Amb Ctrl+U pots veure el codi PHP d'una web | ||
A un servidor Linux, Foto.jpg i foto.jpg són fitxers diferents |
B. Preguntes curtes
1. Quina diferència hi ha entre el client i el servidor?
2. Per a què serveix el DNS?
3. Quina diferència hi ha entre enviar un formulari amb GET i amb POST?
4. Quina diferència hi ha entre una web estàtica i una de dinàmica?
5. Escriu les sis parts d'una URL, en ordre.
C. Problemes
Mira l'arbre de carpetes
Problema 1. Una alumna ha fet la seva web. A noticies/esports.html ha enllaçat el full d'estil així: css/estils.css. La pàgina surt sense colors. Mira l'arbre de l'apartat 7.1. Què ha fet malament, quin codi d'estat veurà a la pestanya Xarxa i quina és la ruta correcta?
Problema 2. Explica a algú que no en sap res què passa des que escriu https://www.example.com i prem Enter fins que veu la pàgina. Fes servir les paraules DNS, IP, servidor i HTML.
Problema 3. Instal·les un WordPress amb Docker i el configures perquè escolti pel port 8080. Escrius http://localhost al navegador i no surt. Què falta a l'adreça i per què?
Problema 4. Entres a la web d'una botiga per comprar i, a la barra de l'adreça, el navegador et diu «no segur». Què vol dir, i hi posaries la targeta o la contrasenya?