Come Creare una Semplice Pagina Web Utilizzando il Blocco Note

Questo articolo mostra come poter creare una semplice pagina web, basata su contenuti testuali, usando un computer Windows e il programma "Blocco Note". Per creare il codice della tua pagina web, userai il linguaggio HTML.

Parte 1

Parte 1 di 4:

Creare un Documento HTML

Scarica PDF

1
Accedi al menu "Start" cliccando l'icona
. È caratterizzata dal logo di Windows ed è collocata nell'angolo inferiore sinistro del desktop. In alternativa premi il tasto ⊞ Win della tastiera.
2
Cerca il programma "Blocco note" di Windows. Digita le parole chiave blocco note all'interno del menu "Start". Vedrai apparire un elenco di risultati nella parte superiore del menu.
3
Seleziona l'opzione Blocco note. È caratterizzata da un'icona a forma di blocco per appunti di colore azzurro. Verrà visualizzata l'interfaccia grafica del programma "Blocco note".
4
Accedi al menu File. È posizionato nell'angolo superiore sinistro della finestra del programma. Verrà visualizzato un elenco di opzioni.
5
Scegli la voce Salva con nome…. È uno degli elementi elencati nel menu apparso. Verrà visualizzata la finestra di sistema "Salva con nome".
6
Accedi al menu a discesa "Salva come". È posizionato nella parte inferiore della finestra di dialogo e al suo interno dovrebbe essere presente la stringa di testo "Documenti di testo (*.txt)". Verrà visualizzato un elenco di opzioni.
7
Scegli la voce Tutti i file. È una delle opzioni elencate nel menu. In questo modo avrai la possibilità di salvare il nuovo documento di testo come file HTML.
8
Seleziona la cartella di destinazione. Clicca il nome della cartella dove vuoi che venga memorizzato il file HTML utilizzando la barra laterale sinistra della finestra "Salva con nome".
- Per esempio se vuoi salvarlo direttamente sul desktop del computer, dovrai selezionare la cartella Desktop visibile all'interno della barra laterale sinistra della finestra di salvataggio.
9
Assegna un nome al nuovo documento e aggiungi l'estensione ".html". Clicca il campo di testo "Nome file" e digita il nome che desideri seguito dall'estensione .html.
- Per esempio se vuoi usare il nome "prova", dovrai digitare prova.html all'interno del campo "Nome file".
10
Premi il pulsante Salva. In questo modo il nuovo documento di testo diverrà un file HTML. Adesso puoi passare alla creazione della struttura di base della tua pagina web.
- Se per errore hai chiuso la finestra del programma "Blocco note" o hai la necessità di ritornare a lavorare sul tuo file HTML in un secondo momento, dovrai semplicemente selezionare la relativa icona con il tasto destro del mouse e scegliere l'opzione Modifica dal menu contestuale che apparirà.
Pubblicità

Parte 2

Parte 2 di 4:

Impostare la Struttura di Base della Pagina Web

Scarica PDF

1
Aggiungi i tag che identificano il tipo di linguaggio che userai per creare la pagina web. La prima porzione di codice che dovrai inserire nel documento serve per indicare ai browser internet che utilizzerai il linguaggio HTML per definire la pagina web. Inserisci il seguente codice all'interno del tuo documento usando l'editor "Blocco note":
```
<!DOCTYPE html><html>
```
2
Aggiungi i tag "head". Servono per definire la sezione del documento in cui successivamente andrai a definire il titolo della tua pagina web. Per il momento inserisci solo il tag <head> subito dopo il tag "<html>", premi il tasto Invio due volte per lasciare un po' di spazio vuoto e infine digita il tag di chiusura </head>.
3
Inserisci il titolo della pagina web. Questa informazione va collocata all'interno dei tag HTML "<title></title>" che vanno posti all'interno della sezione "head" definita nel passaggio precedente. Si tratta del testo che verrà visualizzato sulla barra del titolo del browser internet o all'interno della linguetta della scheda in cui è visualizzata la pagina. Per assegnare al tuo sito web il titolo "Il mio primo sito web" dovrai usare questo codice:
```
<title>Il mio primo sito web</title>
```
4
Crea la sezione "body" della pagina. Tutto il codice HTML con cui strutturerai e formatterai i contenuti del tuo sito web dovranno essere inseriti all'interno dei tag "body" e "/body" che vanno collocati sotto al tag "</title>".
```
<body></body>
```
5
Inserisci i tag di chiusura del documento HTML. L'ultimo tag che dovrai inserire nel tuo file è quello di chiusura del tag iniziale "<html>". In questo modo il browser saprà che la pagina web è completa. Inserisci il tag </html> sotto al tag "</body>".
6
Esamina il codice del documento HTML che hai creato finora. Arrivato a questo punto, il contenuto visibile all'interno della finestra del programma "Blocco note" dovrebbe essere simile al seguente:
```
<!DOCTYPE html><html><head><title>Il mio primo sito web</title></head><body></body></html>
```
7
Salva il file HTML. Premi la combinazione di tasti Ctrl+S. A questo punto la struttura del tuo sito web è pronta e puoi iniziare ad aggiungere gli altri elementi grafici, come paragrafi e titoli.
Pubblicità

Parte 3

Parte 3 di 4:

Aggiungere i Contenuti

Scarica PDF

1
Sappi che tutti i contenuti e il codice che serve per strutturarli e formattarli devono essere inseriti all'interno della sezione definita dal tag "body". Tutti gli elementi che caratterizzeranno la tua pagina web (paragrafi, titoli, eccetera) dovranno essere inseriti nel documento HTML dopo il tag "<body>" e prima del tag "</body>".
2
Aggiungi il titolo principale della pagina web che stai creando. Digita il codice <h1></h1> all'interno della sezione "body", quindi inserisci il titolo che desideri all'interno dei tag "<h1></h1>". Per esempio se stai creando una pagina web di benvenuto, che dovrà accogliere tutti gli utenti che visiteranno il tuo sito, aggiungi il titolo "Benvenuto" usando il seguente codice:
```
<h1>Benvenuto</h1>
```
- Per creare dei titoli sempre più piccoli rispetto a quello principale, puoi usare i tag da "<h2></h2>" fino a "<h6></h6>".
3
Aggiungi un paragrafo. Per definire questa sezione di testo devi usare i tag "<p></p>". Tutto il contenuto che definirà il paragrafo in esame dovrà essere inserito all'interno di questi due tag. Il codice HTML relativo al tuo paragrafo dovrebbe risultare simile al seguente:
```
<p>Questo è il mio primo sito web. Grazie per averlo visitato!</p>
```
4
Inserisci una riga di rottura dopo il paragrafo. Se hai la necessità di mettere in evidenza il paragrafo isolandolo dal resto del testo o dal relativo titolo, usa il tag <br>. Devi inserirlo prima o dopo i tag del paragrafo, per esempio per inserire una linea vuota subito dopo il paragrafo dovrai utilizzare il seguente codice:
```
<p>Questo è il mio primo sito web. Grazie per averlo visitato!</p><br><p>Amo le patatine fritte.</p>
```
- Per inserire un'ulteriore riga vuota dopo la prima aggiungi un secondo tag "<br>" subito dopo il primo. In questo modo verrà lasciato uno spazio fra il primo paragrafo e il secondo.
5
Formatta il testo. Puoi modificare lo stile di ogni singola parola del testo (grassetto, corsivo, sottolineato, apice o pedice) che compone un paragrafo o un'altra sezione della pagina:
```
<b>Testo in grassetto</b><i>Testo in corsivo</i><u>Testo sottolineato</u><sup>Testo formattato come apice</sup><sub>Testo formattato come pedice</sub>
```
6
Controlla l'aspetto generale della tua pagina web. Anche se il contenuto della tua pagina web potrebbe essere diverso, la struttura del documento HTML che stai creando dovrebbe simile alla seguente:
```
<!DOCTYPE html><html><head><title>Il mio primo sito web</title></head><body><h1>Benvenuto</h1><p>Questo è il mio sito web. Spero che ti piaccia!</p><p><b>Ecco del testo in grassetto.</b></p><p><i>Questo invece è testo in corsivo.</i></p></body></html>
```
Pubblicità

Parte 4

Parte 4 di 4:

Visualizzare una Pagina Web

Scarica PDF

1
Salva le modifiche che hai apportato al documento HTML che definisce il tuo sito web. Premi la combinazione di tasti Ctrl+S. In questo modo avrai la certezza che all'interno del file HTML sia presente la versione più aggiornata della tua pagina web.
2
Seleziona l'icona del documento HTML con il tasto destro del mouse. Verrà visualizzato il menu contestuale.
3
Scegli l'opzione Apri con. È una delle voci elencate all'interno del menu contestuale apparso. Verrà visualizzato un piccolo menu secondario accanto al primo.
4
Seleziona il browser internet che usi normalmente. Tutti browser internet sono in grado di leggere, interpretare e visualizzare il contenuto di un documento HTML, quindi scegli quello che preferisci dall'elenco di quelli disponibili. Il file HTML verrà aperto all'interno del programma scelto.
5
Controlla l'aspetto della tua pagina web. Se la struttura della pagina e la formattazione del testo ti soddisfano, puoi chiudere la finestra del programma "Blocco note".
- Se hai la necessità di apportare delle modifiche all'aspetto e ai contenuti del tuo sito web, cambia il codice HTML del documento utilizzando l'editor "Blocco note". Ricordati sempre di salvare il file quando hai finito di modificarlo.
Pubblicità