Salve a tutti , oggi vedremo come realizzare la nostra prima pagina web , conosceremo la struttura base di una pagina HTML , i principali "tag" , e alcune proprietà dei tag.
-HTML(Hyper Text Markup Language) è un linguaggio detto di "contrassegno"(o di "marcatura") che ci consente di indicare al browser come disporre gli elementi all'interno di una pagina web. Queste indicazioni vengono date attraverso appositi marcatori detti "TAG". Un marcatore è generalmente costituito da un tag di apertura (<tag>) e da un tag di chiusura (</tag>) entro i quali va inserito il testo o il contenuto da formattare (o marcare).
<tag>contenuto</tag>
i due tag differiscono solo dal fatto che in quello di chiusura è presente la slash (/). Inoltre all'interno del tag di apertura è possibile inserire degli attributi che hanno la funzione di dare delle specifiche al contenuto da marcare.
<tag attributo>contenuto</tag>
esistono anche tag che non necessitano del tag di chiusura in quanto non devono marcare un contenuto, ma hanno solo la funzione di indicare la posizione che un oggetto deve assumere all'interno della pagina HTML.
i tag inoltre possono essere usati in contemporanea ad altri in modo da dare ad un contenuto più formattazioni contemporaneamente. ( es. se al testo dobbiamo dare il grassetto e il corsivo).
Una pagina HTML per poter essere visualizzata in un browser deve avere come tag di apertura e chiusura il tag "html" all'interno dei quali possiamo mettere tutto quello che vogliamo far vedere all'utente finale.
<html>contenuto web</html>
immediatamente dopo il tag html troveremo un'altro importantissimo tag, il tag "head".
<html><head></head></html>
all'interno dei tag head vanno inserite tutta una serie di informazioni che non saranno visibili all'utente finale , ma servono al browser e ad altri agenti tipo motori di ricerca per una corretta interpretazione del documento stesso.
L'ultimo tag fondamentale per una pagina html è senza dubbio il tag "body" dentro il quale andrà inserito tutto il contenuto della pagina che sarà poi visualizzato dall'utente finale, è quindi il tag body è considerato il corpo della pagina web.
<html><head></head><body></body></html>
Mettendo i tag nella giusta disposizione e rispettando l'indentatura avremo che una pagina HTML e così costituita:
<html>
<head>
#
#
</head>
<body>
#
#
</body>
</html>
L'unico tag che troviamo all'interno di una pagina web che sia posto prima del tag html è il tag di identificazione
<doctype>
esso fornisce informazioni di tipo generale e non necessita di tag di chiusura. Esso si presenta nella forma seguente:
<! Doctype HTML Public="//w3c//DTD HTML 4.0//IT">
HTML Public: indica il tipo di marcatura (html) e che è pubblico.
w3c: indica che rispetta le direttive proposte dal consorzio
DTD HTML 4.0: indica la versione di html usata nel documento
IT: indica la lingua utilizzata nel documento (EN se fosse in inglese).
All'interno dei tag <head> vanno inseriti altri tag ed in particolar modo due , il primo è il tag "title"
<title>........</title>
all'interno dei quali và inserito il nome da dare alla pagina. (quello visualizzato nella barra blu del browser).
l'altro è il tag "Meta" (non necessita di chiusura): <meta>
questo tag fornisce grazie ai suoi attributi informazioni utili ai motori di ricerca per l'indicizzazione della pagina web nei data-base dei motori di ricerca.
2 sono gli attibuti del tag meta e sono l'attributo "Name" e l'attributo "Content" inoltre all'attributo "Name" si possono assegnare i seguenti valori:
Keywords: parole necessarie per far trovare il nostro sito nel web.
Description: breve descrizione della pagina.
Author: per citare il nome dell'autore della pagina web.
Generator: specifica il nome dell'editor utilizzato per creare la pagina.
Refresh: per far caricare al browser una pagina diversa dalla nostra dopo un tempo stabilito.
- struttura definitiva di una pagina html -
<! Doctype HTML Public="//w3c//DTD HTML 4.0//IT">
<html>
<head>
<title>La mia prima home page</title>
<meta name ="keywords" content="Html,pagine web,home">
<meta name ="description" content="Home page in Html">
<meta name ="generator" content="blocco notes di windows">
<meta name = "author" content="vostro nome">
</head>
<body> scrivo questo testo per mostrarvi cosa si vede a video realizzando questa pagina web. Provate pure.
</body>
</html>
P.S. selezionate questo codice, copiatelo ed andatelo ad incollare in un foglio
vuoto del blocco notes di windows, salvate questa pagina html con il nome: index.html
sul vostro desktop e successivamente cliccatecci su per aprirla.