-a 01)
Pete presenta il corso
(qualcuno gli paghi un corso di grammatica per favore)

- a02)
Nick presenta sè stesso ed il corso.

-b 01)
Rubbiamo qualche idea (e immagine) da un sito
per creare una pagina

-b 02)
Prepariamo il materiale ed usiamo una furberia per il gif di sfondo

- b03)
Aggiungiamo link al testo (creiamo dei link multicolorati) e diamo
uno sguardo alle proprietà di pagina.

- c01)
Vari modi di inserire elementi testuali.
I primi tag: modifica dell'aspetto del testo
definito come paragrafo od intestazione.
Diversi modi di importare file di testo ed html creati con altri programmi, (mantenedo anche la formatazione)... ...anche con Word.

Una volta esportato da Word in HTML, facciamo qualche
ripulitura del codice HTML da elementi indesiderati in Dreamweaver...e lui ci pensa a tutto
('Clean Up Word HTML')....('Barra di Stato')...('Clean Up HTML')

- c02)
I Caratteri, o font. (serif, graziati, bastoni sanserif)
Definire l'aspetto delle pagine con l'uso di caratteri appropriati.
'Size' dei caratteri....?
Singoli font e classi di caratteri.
Modifica della lista predefinita di caratteri.
Differenza tra le piattaforme Mac & Windows.
Dimensione dei caratteri, la teoria della relatività.

Tabelle ...e tutto quello che
non vi hanno mai svelato su di essi!

- d01)
Usare e selezionare questi versatili contenitori.
Righe, collonne e celle.
Diversi modi di selezionare le tabelle e i loro componenti.
Diversdi modi per creare una tabella.
Finestra dialogo 'Insert Table'...e come evitarla.
Analisi e modifica delle proprietà delle tabelle.

- d02)
Colore di sfondo per una tabella.
Colori delle cornici e compatibilità.
Immagini di sfondo nelle tabelle.
Inserimento di elementi nelle celle e loro disposizione
con le proprietà delle celle.
Allineare il testo nelle celle.
Fondere più celle (merge) e vedere che cosa succede al loro contenuto e al codice HTML...i tag <td colspan>
Inserire un'immagine in una tabella.
Modificare la tabella per adattarla al contenuto...
... non sempre così ovvio e semplice.

- d03)
Complichiamoci la vita: le tabelle nidificate....
... un casino della maddonna.
Perticolarità delle tabelle quando non vogliono 'collaborare'.
Utilizzo di immmagini "invisibili" (trasparenti) per assegnare dimensioni precise alle celle di tabella.....roba da veri webmaster!
Cancellare solo una colonna in una tabella.

- d04)
Ordinare il contenuto di una tabella alfabeticamente
od in ordine di numero... (finestra dialogo 'sort table').
Esportare i dati di una tabella con delimitatori, per un'altro programma/piattaforma.
Modificare i colori delle celle di tabella e delle celle di tabelle nidificate.... altri eventuali mal di testa...ma niente paura...vi sveliamo tutto.
Convertire una tabella in livelli.(astrofisica non per tutti)
Finestra 'Convert Tables to Layers')
Opzioni di conversione di una tabella in livelli.
Modifica della posizione dei livelli.
Conversione inversa: i livelli tornano a
formare una tabella visibile a tutti i browser!
Finestra 'Convert Layers to Tables')
(i Browser sono dei veri figli di buona mamma!!! grazie Bill)

- d05)
Importare tabelle da altri software (Word - Excel) una
funzione che vale tutto il costo di Dreamweaver!
Finestra 'Insert Tabular Data')

Se dopo questo tutorial non conoscete i Frame allora
buttate il vostro computer e andate a lavorare alle Poste!

- e01) Frames generico
Suddividere una pagina in frames e trasformarla in
un frameset... Menu-Frameset - split.
I nuovi oggetti frameset predefiniti...
... .Objects - Frames... Finestra 'Frames'
Caricare diversi documenti da inserire in diverse
aree del frameset... Proprieta 'Frames'
Creazione di frameset complessi.
Controllo e modifica dei frameset con le
varie finestre di Dreamweaver.
Varie impostazioni delle dimensioni dei frames e loro controllo.
Frames relativi, a pixel, o a percentuale....questo è (era) il dilemma.

- e02) Frames generico)
Impostazione di frameset nidificati: la pagina contiene
varie altre pagine che a loro volta ne contengono
altre che a loro volta...Save Frameset.
Differenze fra la suddivisione di una pagina
in molti frames e frameset nidificati.
Inserire collegamenti in un frame.
Target, ovvero dare una destinazione ai collegamenti:
dimmi cosa vuoi caricare e dimmi anche in
che frame vuoi caricarlo.
(e mentre che ci sei, dimmi anche che stai
incominciando a capire i Frame)
Come far funzionare il tutto con link che caricano
altre pagine o frameset in quello appena creato.

- e03) Frames JavaScript 1
Più facile di quanto sembra dato che se ci riesce
Pete, ci riuscirebbe anche il gatto di Nic!
Preparare il frameset con una sbara di navigazione che
carica altre pagine nei altri frame...anche due alla volta.
Occhio su come, cosa e dove salvate i documenti creati automaticamente in un framest... (save all)
Lavorare nel frameset o nei documenti che
esso contiene ma separatamente?

- e04) Frames JavaScript 2
Preparare il diversi documenti che verranno caricati,
dare a loro un colore di sfondo diverso per differenziarli,
e creare un semplice motore di navigazione in JavaScript
che preleva documenti anche da diverse 'irarchie'
di cartelle che li contengono.
Le due parti del nostro JavaScript.
Attenzione di assegnare i nomi corretti dei documenti nel javaScript.. .ciò che Pete non ha fatto... he he he.

- e05) Frames JavaScript 3
Assicuriamoci che i nomi dei frame nelle
palette delle proprietà sono compatibili con il javaScript.
Spiegazione di come questo javaScript funziona.
.....ed ora..... speriamo che funziona....per ora tutto bene.
Creiamo altri link per caricare ancora altri documenti....funzionerà?
Noooo! non funziona più...vediamo perchè con un po
di 'debugging'... Eureka! ora funziona.
Completiamo l'ultimo link di navigazioine ed è fatta.
(meno male visto che il maestro virtuale
stava per avere un'esaurimento nervoso
durante l'esecuzione di questo tutorial)

- e06) Frames - navigazione standard
Associare collegamenti a stringhe di testo nello stesso framest.
Realizzare una barra di navigazione grafica
con tutto di rollOver e scambio immagini.
Finestra 'Insert Navigation Bar')
Associare immagini e collegamenti agli
elementi della barra, impostarne le opzioni.
La Navigation Bar ora contiene dei javaScript creati automaticamente da Dreamweaver...questi si possono
esaminare tramite la finestra 'Behaviours'.
Creare velocemente diversi documenti che utilizzano
la stessa barra di navigazione.

- e07) elementi di navigazione in un frameset predefinito
Definire un frame di base ove far caricare i collegamenti
di una pagina del frameset.
Finestra 'Insert Base' e corregere il
codice HTML di questo.
Inserire un menu a tendina per la scelta rapida dei collegamenti, definirne gli elementi ed i frame di destinazione.
Finestra 'Insert Jump Menu'.
Box dialogo 'List Values'
Modificare le opzioni di un menu a tendina
attraverso le proprietà ed i behaviour.
Limiti dei menu a tendina: due modi diversi di accedere
a tutti i collegamenti di un menu di scelta rapida.
Inseriamo un 'button'.
Usiamo il behaviour 'Jump Menu Go'.
Ridefinire l'aspetto della barra di navigazione.
Finestra 'Modify Navigation Bar'.
Ogni documento può contenere SOLO una barra di 'navigation'.
Aggiungere funzionalità alla barra di navigazione con altri behaviour....Actions -> 'Show-Hide Layers'...'on mouseOver'

- f01)
Inserire dei moduli per richiedere
all'utente di inserire dei dati.
Inseriamo un campo e definiamo le sue proprietà.
Proprietà di elementi dei form.
Aggiungiamo un behaviour 'validate form'...
... o al pulsante o al form.
Settiamo le preferenze della convalida dei dati senza
andare sul server assegnando azioni JavaScript.
Modificare i messaggi di errore (traducendoli in Italiano anche) riservati a chi inserisce i dati a casaccio nei moduli.
'onBlur' - 'onChange'.
Usare la stessa funzione con diversi
eventi per diversi oggetti.

- g01)
Inserire un'immagine in una pagina e definire aree con
diversi link all'interno della stessa immagine usando
la palette delle proprieta... ('hot-spot')
Modificare le proprietà delle aree attive o spostarle.
Utilizzo della barra delle proprietà per controllare
l'immagine o le singole aree attive.

Template e Oggetti Libreria

- h01)
Utilità dei modelli (template).
Creare un template a partire da un html esistente.
'save as template -dwt'
Esame del codice sorgente di un template,
tra aree modificabili ed aree fisse.
Impostare aree modificabili 'editable regions' e
far funzionare il template.

- h02)
Esame delle diverse modalità di generare
nuovi documenti basati sul modello... Finestra 'template'.
Raporto tra i template e la palette delle proprietà.
Modificare i documenti generati, modificare il modello ed aggiornare tutto il sito... Finestra 'update template files'.
Menu file 'New from Template'

- h03)
Gestione di un modello attraverso la finestra dei templates.
"Staccare" un documento da un template in diversi modi.
Menu modify - templates - 'Detach from Template'.

- h04)
Cosa possiamo modificare in un template e cosa possiamo invece modificare in un documento generato a partire da un template.

- h05)
Oggetti di libreria:
Come archiviare elementi di uso frequente
trascinandoli sulla finestra 'Library'.
La finestra della libreria e come lavorarci.
Creare nuovi oggetti, modificarli ed aggiornare
tutte le pagine che li utilizzano.
Palette proprietà 'Library Item'. e file '.lbi'

- i01)
Significato della finestra 'History'.
Ritornare sui propri passi annullando una o più azioni.

- i02)
Ripetere una azione od una serie di azioni grazie
alla finestra della history con il 'replay'
Selezionare azioni successive o meno.
Copiare azioni eseguite da un documento
ed incollarle in un altro.... 'Copy Steps'

- i03)
Macro? Creare nuovi comandi a partire dalla
finestra della history... 'Save as Command'.
Utilizzare il comando aggiuntivo per inserire un nuovo elemento.
Modificare la lista dei comandi disponibili... 'Edit command List'

- i04)
Registrare una sequenza 'start recording' di azioni mentre le eseguiamo per metterla temporaneamente in memoria.
Differenze fra la creazione di nuovi comandi e la semplice registrazione di una sequenza.

- j 01)
Modificare un tag esistente attraverso la comoda interfaccia
del 'Quick Tag Editor', aggiungere un nuovo tag attorno a quello selezionato od inserire nuovo HTML.
Come usare il Quick Tag Editor.
Modifica delle impostazioni predefinite del Quick Tag Editor e
suoi effetti sulla 'history' del documento... 'TagAttributeList'

- k01)
Creare un nuovo stile HTML.
Definire le impostazioni per il nuovo stile... 'Define HTML Style'
Assegnare uno stile ad una selezione.
Utilizzare diversi stili per diversi elementi della pagina.
Come rimuovere i stili HTML.

- k02)
CSS o 'fogli di stile a cascata', definizione e funzionamento.
Realizzare un nuovo foglio di stile...linkato...
...'Link External Style Sheet'... 'New Style'.
Impostare una nuova classe di stili, ri-definire un TAG
esistente od utilizzare il selettore CSS predefinito.
Impostare la definizione degli elementi del
documento con un foglio di stile.
Modifica dell'aspetto di un link testuale
al transito del puntatore del mouse...'hover'
Considerazioni sulla compatibilità degli stili con i diversi browser.

-L01)
Definizione dei livelli... 'layers'...cosa sono?
I diversi tipi di livelli esistenti, i loro 'TAG' e la loro compatibilità.
...(SPAN, DIV, LAYER, ILAYER)
Le principali proprietà dei livelli: 'Layer ID'..., unità di misura per posizione e dimensioni dei livelli ed opzioni di visualizzazione.
... 'Z-Index' ... 'hidden-visible-inherit-default '
Immagine di sfondo dei livelli...
Che succede se un livello contiene un'immagine più grande
del livello stesso?... ('overflow, hidden, scroll, auto')... 'clip'

-L 02)
Ordine di sovrapposizione dei livelli.
La finestra 'Layers'.
Modifica di alcune proprietà dei livelli attraverso la finestra Layers.
Sovrapposizione di livelli contenenti immagini, testo od
animazioni create con Flash....'Indice - Z'

-L 03)
Inserire livelli in una pagina vuota:
crearne uno predefinito, oppure disegnarlo.
Modificare le impostazioni di creazione di un livello predefinito.
Selezione di un livello nella pagina: differenza fra
un livello selezionato ed uno attivo.
Inserimento di elementi in un livello.. testo, immagini od altro.
Modifica di altre proprietà dei livelli... cambiare dimensioni,
ed eliminare il colore di sfondo.
Osservazioni sulla sovrapposizione di livelli contenenti
vari elementi fra i quali animazioni Flash.

- L04)
Nidificare livelli... gerarchia dei livelli, ovvero
un contenitore che ne contiene un altro.
Controllare la 'parentela' dei livelli mediante la finestra Layers.

- L05)
Introduzione alla Timeline... l'animazione dei livelli.
Cosa possiamo animare, e quali browser ci capiranno qualcosa?
Aggiungere oggetti alla Timeline...'add to timeline'.
Inserire fotogrammi chiave (Keyframes).
Cartoni animati per tutti... registrare il percorso di un livello trascinandolo in giro per la pagina.
Inserire Behaviors nella Timeline per far eseguire
automaticamente l'animazione al caricamento della
pagina o per farla riprodurre continuamente.
Cambiare l'indice -Z' dei livelli lungo il tempo.

- L06)
Verifica della compatibilità dei livelli con i Browser
(che bastardi)... 'Check Target Browser'
Creazione di una pagina che descrive in dettaglio la
compatibilità della nostra pagina con i diversi browser.
Possiamo ancora convertire i nostri livelli in una tabella?...
...si, con qualche accorgimento, osserviamo come fare.
Evitiamo la sovrapposizione dei livelli.

- L07)
Cambiare il contenuto di un livello attraverso il DHTML
... (HTML dinamico) senza saper nè leggere nè scrivere. 
Modificare il testo contenuto in un livello al passaggio del
puntatore del mouse su un pulsante...
... behaviour 'Set Text of Layer'.

- L08)
Netscape Resize Fix: come inserire o rimuovere con facilità uno script che sistema un 'bug' di Netscape Navigator e che permette
di creare, senza troppi batticuori, pagine contenenti livelli.
..e poi come rimuovere il NR-Fix.

- L09)
Rivediamo la timeline e i livelli con
dei behaviour particolari.. .'onFrame-Loop-onClick ecc.'

- L10)
Creare un semplice gioco permettendo al'utente
di trascinare in giro un livello...
...behaviour e box dialogo del 'Drag-Layer'.
Definire le impostazioni di trascinamento...
... assegnare un'area di trascinamento ed un
punto di destinazione per il livello trascinato...
...'snap if Within' azionato dal ('on-Load')
L'hai messo al posto giusto?
Come associare una funzione che venga eseguita solo se
l'utente mette il livello dove gli abbiamo chiesto di metterlo.
Finestra di allert... 'popup Message'..e modificarne il codice HTML.
Limitare il movimento del livello trascinato a
scorrimento orizzontale o verticale.

...dopo aver finito questa sezione Nic è stato
ricoverato in una clinica di psichiatria e messo sotto
osservazione nel loro programma "Alieni si nasce o si diventa"...
... attendiamo ancora gli esiti.

- m 01)
Inserire un filmato Flash in una cella di tabella e ridimensionarlo.
Assegnare comportamenti di controllo della animazione
Flash ad elementi presenti nella pagina HTML...
...('Control Shockwave or Flash') .
Azionare un'animazione, fermarla od andare ad
un determinato fotogramma.
Differenze fra la definizione dei fotogrammi in Flash ed
in DHTML, ovvero in Dreamweaver.

Estendere le funzionalità di base di Dreamweaver.

- n01)
Extension Manager, il 'gestore' delle estensioni...
... che cos'è e come trovarlo.
Visitiamo il sito Macromedia Exchange e scarichiamo qualche estensione . ..quello della Nokia per i telefonini.
Scelta delle estensioni da installare,
Novità o ricerca dell'estensione desiderata.

- n02)
Ecco un'estensione utile per i patiti del telefonino,
come scaricarla, installarla ed utilizzarla.
Una volta scaricata l'estensione, usare
l'Extension Manager per installarla.
Un trucchetto per non dover chiudere Dreamweaver e lanciarlo nuovamente dopo aver installato una nuova estensione.
Vogliamo realizzare contenuti da vedere anche
su piccoli display dei telefonini 'wap'?

- n03)
MFX - SlideMenu:
Un'estensione per creare un menu a scorrimento
basato su livelli dinamici già bell'è pronto? Voilà!
Impostazioni del menu a scorrimento.

- o01)
Analisi di un documento creato da Fireworks.
Cenni sull'utilizzo di Fireworks... suddividere un'immagine
con lo 'slicing' in una tabella HTML contenente una
serie di piccole immagini, una applicazione ibrida che
importa molti formati grafici ed esporta in HTML.
Diverse opzioni di esportazione.

- o02)
Il codice HTML generato da Fireworks e come 'ottimizzarlo'.
Immagini invisibili senza doverle creare? Ci sono già!
Definizione delle dimensioni di righe e colonne nelle
tabelle create da Fireworks.
Modificare queste tabelle.
Sostituire un'immagine contenuta in una cella con altro contenuto ed impostarla come immagine di sfondo della cella.
(Un bel trucchetino che non tutti conoscono.)

- o03)
Integrazione di Fireworks con Dreamweaver....
lanciare il programma dalla barra delle proprietà di Dreamweaver.

- p01)
Usare un behaviour per aprire automaticamente
una seconda window del Browser...
... utile per 'catturare' l'attenzione dei naviganti....e spesso
usato sul sito per pubblicità da 'spingere'.

- p02)
Inserire elementi nell'intestazione dell'HTML....
molto importante per la 'visibilità' del vostro capolavoro sul web.
Definire le parole chiave... 'keywords'
Inserire una descrizione per il sito... 'description'.
Assegnare un 'tempo di visualizzazione'...
per il nostro documento... il META 'refresh'.
Utilizzare il refresh per creare un ciclo fra due pagine,
caricate automaticamente dopo un certo tempo.
(Un bel trucchetino...che non tutti aprezzano....
..a parte il fatto che in materia di colori di
bandiere Nic è stato bocciato!)

- p 03)
Link senza underline senza usare i CSS?

- p04a Frames e motori di ricerca - pte 1)
Cosa fanno i 'bot' automatici dei motori di ricerche
e come agevolare a loro il compito di
categorizzare il vostro sito nei loro database.

- p04b Frames e motori di ricerca - pte 2)
E come risolvere il problema dei bot che
non 'visitano' i 'meta-tags' nei frameset.
Andiamo su un motore (Virgilio) per vedere dove e
come 'suggerire' il vostro sito.
Quanto tempo ci mettono ad inserirvi nei loro directory?

- p04c Frames e motori di ricerca - pte 3)
Andiamo anche su Yahoo per vedere la procedura.
Consigli su come 'assistere' i vostri clienti sul
concetto di inserire il loro sito nei motori.

- q01)
Pete vi fa due palle con un suo concetto sul posesso
dei domini e la loro registrazione (è mio è mio è mio!).
... (è pazzo!)
L'inserzione nel 'whois' di Networksolutions anche con
casella postale (C.P.) senza indirizzo fisso o nome del gestore.
Siete un webmaster senza un proprio dominio...?... allora siete solo un mezzo-webmaster. (Idem per parrucchieri e fiorai)
("Mi dissassocio da queste allucinazioni"... (Nic)
Meglio il  .com o il  .it ?
E se non volete che i vostri parenti e amici (e moglie!)
sappiano che siete webmaster di un sito porno?

- q02)
Conclusione sui domini,...
ma probabilmente vi siete già adormentati.
Se cercate un provider per ospitare il vostro sito...
... OCCHIO al testo piccolo nelle loro offerte.
Avere un dominio è il primo passo per smettere di
lavorare per le Poste...he he he.

- r01)
Questa la dovete sentire per credere.

- s01)
Note conclusivi sul corso

Ordinare QUI