Progetto: Il mio primo sito web
Ragazzi, è arrivato il momento di costruire il nostro primo sito web. Sono in giro per il mondo da un paio d’anni e ho molti contenuti da condividere, quindi usiamo le nostre nuove conoscenze di HTML per creare la struttura del sito.
Fai in modo di includere molte immagini, link, elenchi e altri elementi HTML che hai imparato, in modo che la nostra community abbia molto da vedere e da leggere.
Passo dopo passo:
-
Per iniziare, aggiungi la dichiarazione <!DOCTYPE html> come prima riga di codice.
-
Di seguito, inserisci il tag <html>.
-
Sotto il tag <html> di apertura, aggiungi il tag <head>.
-
All’interno dei tag <head> di apertura e di chiusura, scrivi il tag <title>. Il titolo del sito web è “Ly in giro per il Mondo | Guida per i viaggiatori”.
-
Nella riga seguente, aggiungi il tag <body>.
-
Direttamente sotto il tag <body> di apertura, aggiungi un tag titolo <h1> che recita: “Spiaggia, gastronomia e cultura: le 3 destinazioni più visitate al mondo”.
-
Sotto di esso, inserisci un tag <h2> con il testo: “Bali, Indonesia”
-
Sotto di esso, aggiungi un altro tag <h2> con scritto: “Parigi, Francia”
-
Sotto di esso, aggiungi ancora un altro tag <h2> che contenga il testo: “New York, Stati Uniti d’America”
-
Tra il tag <h1> e il primo tag <h2>, inserisci un tag <p> che reciti: “Il mondo è così grande che, quando si tratta di viaggiare, abbiamo bisogno di ispirazione per decidere tra una destinazione o l’altra. Oggi possiamo raggiungere praticamente ogni angolo del pianeta, con un semplice clic. Qui vi consigliamo 3 dei migliori luoghi da visitare al mondo, dove vivrete un’esperienza indimenticabile”.
-
Tra il primo e il secondo tag <h2>, aggiungi un altro paragrafo all’articolo, utilizzando il tag <p>: “L’isola di Bali, in Indonesia, è al primo posto. Perché? Forse per le spiagge di sabbia bianca come Lovina Beach, per il verde intenso della giungla del Parco Nazionale di Bali Ovest, per gli antichi templi (più di 10.000) o per i vari sentieri escursionistici. Noleggiate una moto per girare l’isola: non perdetevi il tempio di Tanah Lot (Tàh nu lot) per vedere il tramonto, perdetevi nelle risaie di Jatiluwih o a Tegallalang, scegliete la spiaggia o il lago, visitate un vulcano o addirittura cogliete l’occasione per sposarvi. Bali è l’isola degli dei!”.
-
Tra il secondo e il terzo tag <h2>, inserisci un altro paragrafo nell’ articolo, utilizzando il tag <p>: “La città delle luci, la città dell’amore, la città della letteratura, offre così tante attrazioni che una vita sola non basta. È l’unica città che possiede due delle dieci principali attrazioni d’Europa: la Torre Eiffel e Notre Dame. Che altro? Puoi seguire un’intera lezione d’arte al Museo del Louvre, passeggiare nei suoi quartieri come il Marais o il Quartiere Latino, gustare la gastronomia in alcuni dei suoi bistrot, passeggiare lungo le rive della Senna o visitare il mondo di Amélie Poulain, Parigi non finisce mai!”.
-
Nel terzo e ultimo tag <h2>, aggiungi un altro paragrafo all’articolo, utilizzando il tag <p>: “Se esiste un’idea universale di città, New York la incarna. L’abbiamo vista così tante volte nei film che quando la si visita per la prima volta sembra di vagare da una scena all’altra. Questa città è sconfinata e ha così tanti volti che ci vorrebbero diverse vite per poter dire di conoscerla bene. Passeggiare per Central Park in autunno o in primavera, andare al MoMA, la culla dell’arte moderna, vedere la Statua della Libertà, i mitici grattacieli come l’Empire State Building, attraversare il ponte di Brooklyn, Little Italy, Coney Island, è solo una piccola parte di tutto ciò che si può fare a New York”.
-
Sopra ogni paragrafo, inserisci un tag <img> con un attributo src corrispondente a ciascuno dei seguenti riferimenti:
-
-
-
-
Bali: https://learnwonderly.com/wp-content/uploads/2022/05/paisaje1.jpeg
-
París: https://learnwonderly.com/wp-content/uploads/2022/05/paisaje2.jpeg
-
New York: https://learnwonderly.com/wp-content/uploads/2022/05/paisaje3.jpeg
-
-
-
-
Ora aggiungi una mia foto, in modo che la community possa conoscermi. Sotto il tag body di apertura, aggiungi un tag <img> con la seguente immagine: https://learnwonderly.com/wp-content/uploads/2022/08/Ly.jpg
-
Adesso, sotto il tag <body>, aggiungi un tag <h3> con la dicitura “Scritto da Ly | 1 giorno fa”.
-
Elenchiamo allora qualche link correlato. Sotto l’ultimo paragrafo, aggiungi un tag <h4> con la dicitura “Contenuti correlati”. Sotto il tag di intestazione, crea un elenco. L’elenco conterrà i seguenti quattro elementi:
-
-
-
-
Visita le 5 meraviglie del mondo.
-
Hotel con una storia da raccontare.
-
Consigli per viaggiatori alle prime armi.
-
Le migliori crociere per quest’estate.
-
-
-
-
Collega la nostra pagina al resto del web! Nel primo paragrafo, trasforma la parola “pianeta” in un link e collegalo al sito: https://www.nationalgeographic.it/viaggi .
-
Assicurati di includere l’attributo target=”_blank” in modo che si apra in una nuova scheda.
-
Vogliamo assicurarci che la community possa condividere la propria esperienza di viaggio. Nella parte inferiore del corpo della pagina web, aggiungi un nuovo <div> e imposta il suo id=”contatti”.
-
All’interno del <div>, crea un nuovo tag <p> e inserisci le seguenti informazioni di contatto: email: ly@wonderx.com
-
All’interno del <div> del contatto, posiziona le etichette <strong> di apertura e di chiusura intorno a “email”.
-
Facciamo in modo che l’immagine del profilo sia un link alla sezione contatti del sito web. Individua il tag del profilo <img> e contornalo con i tag <a> di apertura e di chiusura. Nel tag <a>, imposta href=”#contatti”.
Congratulazioni! Hai costruito le basi di un ottimo sito web di viaggi.