La tua prima pagina Web
Creare la tua prima pagina Web
E ora è finalmente giunto il momento di saltare nel codice HTML e creare la tua pagina web molto prima!
- Aprite il vostro editor di testo o di programmazione e di creare una nuova pagina.
- Se il vostro editor mette qualche codice di preselezione in là solo cancellare come andremo ad utilizzare il nostro.
- Copy sotto il codice nel vostro documento e salvarlo da qualche parte si riesce a ricordare (se avete installato WAMP nel precedente tutorial è possibile salvare il file nella directory root www sia come index.html o index.php, basta assicurarsi che sia l'unico indice di file in modo che vi verrà visualizzato quando si digitare localhost nel browser).
XHTML 1.0 Strict modello
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>My first web page!</title>
</head>
<body>
<p>Hello there ...</p>
</body>
</html>
Vedendo la tua pagina web
Il nostro codice HTML, non farà altro da sé ed è praticamente solo un file di testo. Per visualizzare la pagina web che descrive stiamo andando ad avere per aprirlo in un browser web.
- Avviare il browser Web e andare su File> Open File e selezionare il file HTML appena creato o digitare localhost nella barra del browser se avete WAMP e messo in esecuzione il file nella directory root www.
Ora dovreste vedere una pagina simile a questa:
La tua prima pagina Web
Analizzando la tua pagina web
Prima lasciate che vi dica che il codice che ti ho dato sopra è come super corretto come si arriva e segue le specifiche W3C xhtml 1.0 alla lettera. Si può tranquillamente utilizzare come un 1.0 XHTML Strict modello per tutte le vostre pagine web futuro.
Doctype
Questa prima linea non è un tag HTML reale, ma comunque è richiesto in ogni documento HTML. Questo doctype cosiddetta dice al browser web che tipo di file che si sta occupando. Nel nostro caso si tratta di un file XHTML 1.0 stretto. Questi doctype sono scolpiti nella pietra e può sempre essere guardato in modo salva te stesso la tortura di imparare da questo cuore.
html elemento
...
</html>
Questo è dove inizia il nostro vero documento HTML. Il <html>...</html> elemento non è tutto ciò che di per sé interessante. Segna solo l'inizio e la fine di tutto il nostro codice HTML. Il xmlns attributo è obbligatorio per i documenti XHTML, gli altri due sono opzionali, ma è buona prassi di includerli.
elemento di testa
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>My first web page!</title>
</head>
Poi segue la <head> del nostro documento HTML. Fatta eccezione per la <title> elemento che appare nella finestra del browser, nessuna delle informazioni testa è visualizzato nella pagina. La testa di solito porta informazioni come il linguaggio, codifica dei caratteri, le informazioni sul copyright, di descrizione della pagina e così via. Il <meta> tag nel nostro codice è facoltativo, ma deve essere incluso in ogni caso come un backup nel caso in cui il server non è di fornire queste informazioni o stai vedendo in linea la pagina.
elemento del corpo
<p>Hello there ...</p>
</body>
Questo è dove le cose iniziano a farsi interessanti. Il <body> elemento contiene tutto il contenuto che verrà visualizzato come una pagina web. In questo caso abbiamo un elemento punto <p> con il testo Ciao là ... Nei capitoli seguenti si arriva a conoscere di più di questi tag HTML si può utilizzare per costruire la vostra pagina web.
Pratica fa il maestro
Il modo migliore per imparare a creare un sito web è il fai-da-te ". Vi suggerisco di provare tutti gli esempi di esercitazione nella tua pagina personale e giocare con il codice per ottenere una migliore comprensione di come funzionano le cose.