Lezione 12 - La tua pagina Web - Preparazione
45 minuti
Panoramica
Domanda del giorno: cosa dobbiamo fare per prepararci a creare le nostre pagine web?
In questa lezione, gli studenti si impegnano nella fase di «preparazione» del processo di risoluzione dei problemi, decidendo quali elementi e stile avrà la loro pagina web. Iniziano esaminando le diverse linee guida HTML, CSS e sulla cittadinanza digitale di cui avranno bisogno per creare le loro pagine web. Quindi descrivono e disegnano le loro pagine, elencando i tag e gli stili che useranno per ottenere l'aspetto e il progetto che hanno deciso. Quindi si spostano online per trovare e scaricare le immagini di cui avranno bisogno per le loro pagine. Successivamente, riflettono su come il loro piano assicurerà che il sito web faccia ciò per cui è stato progettato.
Traguardo di apprendimento
Questa lezione rafforza l'idea che gli studenti dovrebbero progettare e pianificare le proprie pagine prima di iniziare a programmare. Fornisce un processo strutturato per la pianificazione che si collega al processo di risoluzione dei problemi che si svolge durante il corso. Il piano dovrebbe ricollegarsi al foglio di lavoro «Definisci» che gli studenti hanno completato un paio di lezioni prima e fornire loro qualcosa da usare mentre costruiscono le loro pagine nella lezione successiva.
Opportunità di valutazione
- Separa logicamente il contenuto, la struttura e la formattazione di un artefatto digitale
Nella guida alle attività, verifica che lo schizzo di progettazione includa il contenuto e che le colonne di tag e stile nella sezione «Descrivi i tuoi stili» siano riempite con tag HTML a sinistra e descrizioni di stile o CSS a destra.
-
Crea una documentazione che spieghi le decisioni di progettazione di un artefatto
In conclusione, verifica che gli studenti abbiano collegato le loro decisioni di progettazione nella Guida alle attività all'obiettivo del sito web, come indicato nella lezione precedente.
Mappatura delle competenze
AP - Algorithms & Programming
- 2-AP-16 - Incorporate existing code, media, and libraries into original programs, and give attribution.
- 2-AP-19 - Document programs in order to make them easier to follow, test, and debug.
Pianificazione
Obiettivi
Gli alunni saranno in grado di:
- creare una documentazione che spieghi le decisioni di progettazione di un manufatto
- separare in modo logico il contenuto, la struttura e la formattazione di un artefatto digitale
Preparazione
- Stampa per ogni studente una copia della Guida alle attività
- Controlla il forum "Aula insegnanti" per insegnanti verificati per trovare strategie o risorse aggiuntive condivise dagli altri colleghi insegnanti
- Se stai facendo una lezione virtuale, valuta la possibilità di controllare le nostre Modifiche alla lezione virtuale
Collegamenti
Attenzione! Fai una copia di tutti i documenti che intendi condividere con gli alunni.
Per gli insegnanti
- La tua pagina Web - Preparazione - Diapositive (Scarica)
Per gli studenti
- Pagina Web personale - Preparazione - Guida al progetto
Guida didattica
Preparazione (5 minuti)
Discussione: Abbiamo imparato molto su HTML e CSS in questa unità e anche molto su come essere cittadini digitali responsabili. Stiamo per pianificare i dettagli delle nostre pagine web. Dedica qualche minuto a pensare ad alcune delle cose più importanti che dovremmo ricordare durante il progetto in queste categorie:
- Tag HTML e suggerimenti/trucchi per usarli
- Proprietà CSS e suggerimenti/trucchi per utilizzarli
- Come essere responsabili e sicuri online
Discussione: chiedi agli studenti di condividere le loro idee e di mostrarle davanti alla classe.
Obiettivo: questa è un'occasione per gli studenti di ricordare a se stessi (e a voi di verificare) le cose più importanti che hanno imparato nell'unità finora. Sebbene l'attenzione possa variare da classe a classe, la maggior parte delle classi dovrebbe avere alcune cose da dire in ogni categoria. Assicurati di evidenziare le differenze tra struttura (HTML) e stile (CSS) nelle tue conversazioni. Se hai notato ostacoli particolari per i tuoi studenti, questo è un buon posto per assicurarti che siano preparati ad affrontarli.
Domanda del giorno: cosa dobbiamo fare per prepararci a creare le nostre pagine web?
Attività (35 minuti)
Distribuisci: distribuisci i diari degli studenti o la guida alle attività, se gli studenti non li usano. Se disponibili, gli studenti potrebbero voler usare matite colorate o pastelli per disegnare le loro pagine.
Descrivi la tua pagina
Concedi agli studenti qualche minuto per descrivere e abbozzare la loro pagina. Ricorda loro che dovrebbero pensare all'aspetto oltre che al contenuto, ma che non è necessario includere ogni parola della pagina. Possono anche inserire maggiori dettagli sugli stili degli elementi nella sezione successiva.
Descrivi i tuoi stili
Ogni studente dovrebbe scegliere i tag relativi ad alcuni elementi delle proprie pagine e descrivere come appariranno quegli elementi (colore, dimensione, ecc.). Non è necessario che annotino le proprietà CSS esatte, ma dovrebbero esserci informazioni sufficienti per poterle usare per guidarli nella creazione delle loro pagine.
Trova le tue immagini
Transizione consenti agli studenti di andare online per trovare le immagini che desiderano utilizzare per i loro siti. Assicurati che stiano annotando le informazioni sul copyright e che possano dirti da dove proviene l'immagine, in modo che loro (o tu!) possano trovarlo in futuro.
Potresti chiedere a ogni studente di verificare con te il piano della sua pagina web prima di consentirgli di trovare le proprie immagini online. Assicurati che ogni studente abbia abbozzato un sito approssimativo e descritto gli stili per alcuni tag diversi. Lo schizzo e la descrizione dovrebbero mostrare che la pagina sarà sufficiente a dimostrare che hanno acquisito le competenze e le conoscenze richieste dal capitolo.
Conclusione (5 minuti)
Diario di bordo/Compito finale
Domanda del giorno: cosa dobbiamo fare per prepararci a creare le nostre pagine web?
Discussione: ripensa alla parte «Definisci» di questo progetto. Spiega due modi in cui il tuo piano renderà efficace la tua pagina web personale.
Verifica che gli studenti abbiano legato le decisioni di progettazione allo scopo del sito web, come spiegato nella lezione «Siti web per l'espressione».
Raccogli: raccogli i diari o le guide delle attività in cui gli studenti hanno pianificato le loro pagine. Ne avranno bisogno nella prossima lezione.
Questo compito è disponibile previa Licenza Creative Commons (CC BY-NC-SA 4.0).
Se sei interessato ad utilizzare i materiali di Code.org per scopi commerciali, contattaci.
