Argomenti
- 1 INTRODUZIONE
1.1 Il codice nascosto delle pagine web
1.2 Gli strumenti per scrivere una pagina
1.3 La nostra prima pagina
1.4 Struttura della rete internet
- 2 I PRIMI ELEMENTI DI HTML
2.1 Struttura di una pagina: tag, elementi, attributi
2.2 La dichiarazione DOCTYPE e
la validazione
2.3 Html, head e body, commenti
2.4
Tipi di elementi e annidamento
2.5 Charset e html entities
2.6 Un template di pagina vuota
- 3 ELEMENTI LOGICI
3.1 Elementi logici e di visualizzazione
3.2
Paragrafi (<p>)
3.3 Intestazioni (<h1>,<h2>,<h3>...)
3.4 Altri elementi per il testo
3.5 Link (<a>)
3.6 Immagini (<img>)
3.7 Multimedia (audio e video)
3.8 Grassetto e corsivo (<strong>, <em>, <b>,<i> )
3.9 Liste
3.10 Br e hr
- 4 TABELLE
4.1
Creare una tabella
4.2 Il problema del bordo
4.3 L'attributo width
4.4 Colspan e rowspan
4.5 Tabelle annidate
4.6 Raggruppare le righe: thead,
tbody, tfoot
4.7 Tabelle e accessibilità
- 5 FRAME E MAPPE IMMAGINE
5.1
Frame e frameset
5.2 Frame inline
5.3
Mappe immagine
- 6 FORM
6.1 Uso dei form in HTML
6.2 Form per l'invio dati utente via mail
6.3 Form e tabelle
6.4 L'elemento form
6.5 L'elemento input per l'inserimento dati
6.6 L'elemento input per i pulsanti
6.7 Textarea e select option
6.8 Elaborazione form in
PHP (invio mail)
6.9 Convalida dati inseriti nel form
(javascript)
6.10 Form e accessibilità
- 7 STILI
7.1
Evoluzione HTML ed elementi deprecati
7.2
Attributo style, tag span e div
7.3
Stili per i caratteri (font)
7.4
Stili per i colori
7.5
Stili per l'immagine di sfondo
7.6
Stili per il testo
7.7
Stili per le dimensioni (pagine
liquide e solide)
7.8
Stili per i bordi
7.9
Stili per le liste (ol e ul)
- 8 FOGLI STILE
8.1
Fogli stile incorporati
8.2
Fogli stile esterni
8.3
Sintassi dei fogli stile
8.4
Il selettore di
classe
8.5 Il selettore id
8.6 Selettori
contestuali
8.7 Pseudoclassi
8.8 Pseudoelementi
8.9 Fogli stile CSS (in cascata)
- 9 POSIZIONAMENTO CON GLI STILI
9.1
Il box model di una pagina
9.2
Selettore di id
9.3
Stili dei blocchi: bordi,
dimensioni, padding, margin
9.4
Posizionamento con gli
elementi float
9.5
Posizionamento absolute e
relative
9.6
Z-index
9.7
Centrare orizzontalmente e
verticalmente
9.8 Creare una tabella con i div
- 10 ACCESSIBILITA'
10.1
Accessibilità:
concetti generali
10.2
Tipi di
disabilità e linee guida per accessibilità
10.3
Strumenti online per valutare
l'accessibilità
10.4
Problemi visivi
10.5
Il problema dei colori e del
contrasto
10.6
Altre
problematiche: udito, movimento, cognitive
10.7
Title e attributo lang
10.8
Accessibilità e immagini
10.9
Gli header e i link
10.10
Tabelle e form
- 11 USABILITA'
11.1
Usabilità: definizione generale
11.2
Usabilità e utente
11.3
Visibilità, comandi e feedback
11.4
I principi fondamentali
dell'usabilità
11.5
Esempi negativi
11.6
Usabilità e accessibilità: differenze
11.7
Definire il target
del sito
11.8
Gli errori da evitare
11.9
Progettare il
sistema di navigazione
11.10
Tipologie di link
11.11
Scrivere per
il web
11.12
Affermare il marchio
del sito
11.13
Pagine leggere
11.14
Feedback degli
utenti
11.15
Effettuare un test
- 12 PAGINE WEB DINAMICHE CON I FOGLI STILE
12.1 Pagine
dinamiche
12.2
Menu dinamici con i fogli stile
CSS
12.3 Transizioni con i CSS
12.4 Trasformazioni 2D con i CSS
12.5 Animazioni con i CSS
12.6 I principi del responsive
design
12.7 Breakpoint e media query
12.8 Un semplice esempio di
responsive design
- VIDEO LEZIONI
- Creare un sito su un web hosting remoto
- Gestire un sito web da PC locale a remoto
-
Trasferire file da e verso il remoto con Filezilla
-
Creare tabelle in HTML
-
Creare una pagina html con HTML-KIT
- Stili, stili incorporati e fogli stile CSS
- Fogli stile CSS con HTML-KIT
-
Creare il layout di pagina con gli stili CSS
- Kompozer 1: Creare una pagina HTML
- Kompozer 2: Immagini, link, liste, tabelle
- Kompozer 3: Stili e fogli stile
- Kompozer 4: Pubblicare sul web
Sito realizzato in base al template offerto da
http://www.graphixmania.it