Introduzione

Completato

È straordinario quello che è possibile fare sul Web oggi. È possibile creare esperienze Web eseguibili su tutti i dispositivi, includere tutti i tipi di contenuto multimediale ed eseguire calcoli complicati. È anche possibile creare app che sembrano applicazioni native.

Se si è interessati a iniziare subito lo sviluppo Web, esistono moltissime opzioni. Questo modulo illustra i componenti di base di un sito Web e alcuni strumenti che è possibile usare per iniziare a svilupparne uno. Si useranno HTML, CSS e JavaScript insieme per creare un sito Web e gli strumenti di sviluppo nel browser per verificare il risultato.

Con questa conoscenza di base, si avrà a disposizione un contesto migliore per prendere decisioni sullo sviluppo di siti Web in futuro. Si potrà ad esempio scegliere di sviluppare un sito Web usando framework JavaScript oppure creando funzioni JavaScript personalizzate.

Si inizia valutando il risultato che si intente ottenere.

Scenario

Si supponga di essere uno sviluppatore Web e di ricevere l'incarico di attirare una fascia più ampia di clienti nel sito Web aziendale. Per consentire ai clienti di personalizzare la propria esperienza nel sito Web, si decide di aggiungere il supporto per i temi chiaro e scuro. Si crea un piccolo sito di prova per dimostrare il supporto dei temi tramite CSS e si scrive una funzione JavaScript per passare tra un tema e l'altro.

Al termine, il sito Web è simile all'esempio seguente, con il tema scuro applicato:

Screenshot that shows the completed website with its dark theme enabled.

Quali sono gli elementi in una pagina Web?

Il contenuto, lo stile e la logica interattiva sono separati rispettivamente in file HTML, CSS e JavaScript. Un principio di progettazione nella programmazione moderna è la separazione delle problematiche. Tra i vari motivi alla base di questo principio vi sono la semplicità e il riutilizzo. Ad esempio, applicando gli stili agli elementi HTML tramite CSS, è possibile semplificare il codice HTML. Invece di codificare l'aspetto all'interno di ogni elemento, è possibile applicare gli stili CSS a tutti gli elementi di una pagina, indipendentemente dalla complessità della pagina. Inoltre, è possibile collegare più pagine HTML a un singolo file CSS, ottenendo così facilmente un aspetto coerente nell'intero sito Web.