HTML Tutorial & Guide

July 8

HTML Tutorial & Guide


Imparare HTML è qualcosa che chiunque può fare. Le competenze tecniche di base coinvolti non sono avanzate, in modo da poter imparare a creare pagine web e siti, anche se si sa poco di computer o di programmazione. HTML sta per Hyper Text Markup Language. I documenti HTML contengono elementi come testo, immagini, media e dati, strutturati in modo che i programmi di browser Web in grado di interpretare. Un documento HTML determina il contenuto visualizzato in una pagina Web, "marcato" tra i tag che sono conosciute come "elementi". Come con la maggior parte dei concetti tecnici, il modo più semplice per imparare è quello di utilizzare esempi concreti.

istruzione

1 Creare una pagina HTML di base. Aprire un nuovo file in un programma di editor di testo, come Blocco note, e salvarlo come "firstpage.html" per riflettere il suo scopo e il formato. Inserire il seguente codice e salvare il file:

<Html>

<Title> Mia prima pagina </ title>

<Head>

</ Head>

<Body>

<Div> Ecco la mia prima pagina. </ Div>

</ Body>

</ Html>

Aprire la pagina in un browser Web, come ad esempio Firefox, Internet Explorer, Chrome, Safari o Opera. È possibile aprire un file HTML da allora menù doppio clic su di esso o aprire il browser e trovare utilizzando il "File", "Apri".

2 Guardate la pagina nel browser. Se si guarda alla parte superiore della finestra, si dovrebbe vedere il titolo della pagina, come indicato dal tag "title" nella sezione head. All'interno dell'area principale della finestra del browser, si dovrebbe vedere il testo "Questa è la mia prima pagina." visualizzato. Tutto ciò che si desidera visualizzare all'interno di una pagina dovrebbe essere contenuta all'interno della sezione del corpo. Si può vedere il sorgente HTML di qualsiasi pagina che si sta guardando sul web utilizzando il menu del browser, di solito nella sezione "View".

3 Guardate il vostro file HTML. Torna al tuo editor di testo e guardare le strutture HTML. Gli elementi di base di HTML sono i tag. I tag sono indicati dal "maggiore di" e "minore di" parentesi angolari come segue:

<Div>

Nella maggior parte dei casi, i tag sono inclusi in coppie all'interno HTML, con un elemento delineata da un'apertura e un tag di chiusura come segue:

<Div> contenuti Div qui. </ Div>

Si noti che il tag di chiusura contiene una barra. Tale struttura, con un tag di apertura, un tag di chiusura e alcuni contenuti tra i due, è un elemento HTML.

4 Creare una struttura annidata nella tua pagina. documenti HTML sono descritti come "nested" nella struttura, o aventi una struttura "ad albero". Ciò significa che gli elementi possono essere contenuti uno nell'altro come segue:

<Div> <p> Un paragrafo all'interno di un div. </ P> </ div>

Gli elementi possono contenere più ulteriori elementi come segue:

<Div>

<P> Un paragrafo </ p>

<P> Un altro paragrafo </ p>

</ Div>

Per i documenti HTML per funzionare correttamente, devono essere correttamente annidati. Ad esempio, il seguente è annidato in modo non corretto perché il tag "p" è stata chiusa fuori dal tag "div":

<Div> <p> Un paragrafo all'interno di un div. </ Div> </ p>

5 Aggiungere una immagine alla tua pagina. La maggior parte delle pagine Web contengono elementi multimediali al loro interno. Questi elementi multimediali sono archiviati sul Web e inclusi con un riferimento alla loro posizione all'interno del codice HTML come segue:

<Img alt = "bella foto" />

Ciò include un file immagine con il nome "lovelypicture.jpg", memorizzata all'interno della stessa directory sul server Web come pagina HTML stessa. Se l'immagine viene memorizzata in una sottodirectory e denominato "immagini" la seguente sintassi può essere utilizzato:

<Img alt = "bella foto" />

Il tag "alt" è utilizzato per i casi in cui l'immagine non può essere visto. Prova a mettere un file di immagine nella stessa cartella come pagina HTML e compreso un riferimento ad esso in questo modo. Questa è la pratica di base tra cui supporti esterni all'interno delle pagine.

Consigli e avvertenze

  • È possibile utilizzare il W3C Markup Validation Service ufficiale per controllare il codice HTML per gli errori.
  • Se si includono elementi multimediali che non vengono memorizzati sullo stesso server come le pagine HTML, è necessario utilizzare URL assoluti piuttosto che quelli relativi come nell'esempio.