Struttura del documento HTML Esempio 1 Tag di intestazione I tag

Transcript

Struttura del documento HTML Esempio 1 Tag di intestazione I tag
Struttura del documento HTML
<HTML>
<HEAD>
intestazione
</HEAD>
<BODY>
corpo
INFO WEB – LEZIONE N.3
</BODY>
</HTML>
RAVENNA, 12 MARZO 2008
Intestazione: contiene informazioni che riguardano il modo con cui il
documento deve essere letto e interpretato
Corpo: qui è racchiuso il contenuto vero e proprio del documento
Dott. Giuseppe Contissa
[email protected]
Esempio 1
Tag di intestazione
<HTML>
<HEAD>
<TITLE> Prima lezione</TITLE>
</HEAD>
<BODY>Oggi 12 marzo si fa lezione dalle 9 alle
11</BODY>
</HTML>
I tag META
Il TAG BODY
Sono utilizzati per fornire informazioni sulle pagine agli
utenti o ai motori di ricerca.
I meta tag non forniscono al browser alcun dato di
formattazione della pagina, per cui il loro influsso sul layout
finale è praticamente nullo; sono perciò totalmente invisibili
all'utente se non attraverso la visualizzazione della codice
sorgente in HTML.
Essi servono soprattutto come supporto ai motori di ricerca
per una corretta indicizzazione dei siti e delle pagine.
L’utilizzo dei metatag può essere illegittimo, assumendo i
contorni della concorrenza sleale, della violazione dei
marchi e della confondibilità dei segni distintivi.
All’interno dell’intestazione si utilizzano i TAG:
<TITLE>: titolo del documento (compare nella barra del titolo)
<META>: meta informazioni per i browser e i motori di ricerca.
Esempi:
<META name="keywords" content="parole chiave del sito">
<META name="author" content="Nome Cognome">
<META name="description" content="Descrizione del contenuto del sito">
<META name="generator" content="Frontpage">
<META name="language" content="it-IT"
Tramite gli attributi del tag <BODY>è possibile:
– impostare lo sfondo
– impostare il colore del testo
– impostare il colore dei link
All’interno del tag <BODY>sono solitamente annidati
tutti gli altri tag che vedremo in seguito.
Attributi del tag BODY
Per impostare un colore unitario di sfondo:
Esempio 3
<html>
bgcolor="#nnnnnn" o "nome_colore_in_inglese"
Per impostare un’immagine come sfondo:
Per impostare il colore del testo:
Per impostare il colore dei link:
<HEAD>
<TITLE> Terza lezione</TITLE>
</HEAD>
<BODY BGCOLOR=‘yellow’TEXT=‘red’
LINK=‘blue’
ALINK=‘black’VLINK=‘green’>
Oggi 12 marzo si fa lezione dalle 9
alle 11
</BODY>
background="…\...\...\..." (percorso immagine)
text="#nnnnnn" o "nome_colore_in_inglese"
link="#nnnnnn" o "nome_colore_in_inglese"
vlink="#nnnnnn" o "nome_colore_in_inglese" (visited, cioè visitato)
alink="#nnnnnn" o "nome_colore_in_inglese" (active, cioè cliccato)
I colori in HTML
I colori in HTML si possono esprimere in due modi:
</html>
Il formato RGB
in
formato RGB
indicandone solo il nome
#rrggbb
Percorso assoluto e relativo
Partendo da un file di origine e considerando un file di
destinazione un percorso può essere espresso in modo
dipendente da tale file e parleremo quindi di un percorso
relativo, oppure in modo indipendente dall'origine ma
legato alla più alta cartella del sito, ovvero la root, e
parleremo quindi di percorso assoluto.
In genere la root (radice) del sito corrisponde esattamente
al dominio del sito stesso. Avremo quindi che il dominio
www.miosito.com corrisponderà alla root, mentre la cartella
www.miosito.com/cartella/ corrisponderà alla cartella
/cartella dentro la root.
Si basa sulla combinazione di 3 colori fondamentali:
rosso, verde e blue (red, green, blue)
A ciascuno di questi 3 colori è possibile assegnare
un valore compreso tra 00 e FF, che corrispondono
ai valori decimali compresi tra 0 e 255
Per esempio il rosso corrisponde a #FF0000
Esempio 2: percorso assoluto
<html>
<HEAD>
<TITLE> Prima lezione</TITLE>
</HEAD>
<BODY
BACKGROUND="c:/WINNT/Web/Wallpaper/Ac
qua.jpg">Oggi 12 marzo si fa lezione dalle 9 alle
11 </BODY>
</html>
Esempio 2bis: percorso relativo
<html>
<HEAD>
<TITLE> Prima lezione</TITLE>
</HEAD>
<BODY BACKGROUND='./images/colline.jpg'>Oggi
12 marzo si fa lezione dalle 9 alle 11 </BODY>
</html>