CORSO WEB DESING
Corso Web Design - Disegno di siti Web con HTML, CSS e Dynamic HTML
Il corso, partendo da zero, illustra le nozioni di base del Web Design. Corredato da due brevi (ma esaustive) guide all'HTML ed ai CSS, nonchè da un'introduzione al linguaggio Javascript, il corso si sviluppa seguendo un percorso prevalentemente pratico volto ad insegnare come costruire un layout (tabellari e tableless), un menu di navigazione (statico e dinamico) ed anche a stilizzare, in modo ottimale, una serie di elementi come i moduli per la raccolta dati, i box, i report dei dati e cosi via. Particolare attenzione, infine, viene dedicata al problema dell'accessibilità dei contenuti, dei menu e dei form HTML.
Sommario del corso Web Design
- Introduzione al Webdesign
- Introduzione al concetto del "disegnare per il Web"
- I linguaggi del Web Design
- Formati e risoluzioni delle immagini per il Web
- Importanza e percezione psicologica dei colori
- Tavolozza dei colori per il Web in esadecimale
- Introduzione ai browser Web
- Accenni sui software di sviluppo per Web Designer
- Breve guida all'HTML - Parte 1
- Premessa
- Regole e creazione un file HTML
- Struttura di un file HTML e gestione delle intestazioni
- Elementi di testo: titoli, paragrafi ed elenchi
- Ritorno a capo nel testo
- Stili in HTML: grassetto, corsivo e sottolineato
- Collegamenti ipertestuali: i link
- Gestione delle immagini
- Le tabelle
- Creazione di un modulo per la raccolta dei dati
- Tutorial: impaginazione di un modulo HTML in una tabella
- Premessa
- Introduzione ai CSS e confronto con le stilizzazioni HTML
- Stili in linea, interni ed esterni
- Regole e sintassi CSS
- Classi ed identificatori univoci
- Stilizzare elementi di base: corpo della pagina
- Stilizzare elementi di base: titoli e paragrafi
- Stilizzare elementi di base: link
- Stilizzare elementi di base: immagini cliccabili
- Il Box Model: stilizzare box e tabelle
- Questioni di compatibilità: fogli di stile condizionali per Explorer
- Stilizzare un modulo HTML con i CSS
- Tutorial: stilizzare coi i CSS un modulo HTML impaginato in una tabella
- Premessa
- Cosa significa "programmare per il Web"
- Il linguaggio Javascript: sintassi ed inserimento del codice
- Variabili e costanti
- Istruzioni di controllo: condizioni e cicli
- Creazione di funzioni personalizzate
- Javascript ed il Web Design: introduzione al DHTML ed al DOM
- Introduzione
- Creare un layout a due colonne con le tabelle, fisso e centrato
- Creare un layout a tre colonne con le tabelle, fisso e centrato
- Creare un layout fluido a due colonne con le tabelle (a tutto schermo)
- Creare un layout fluido a tre colonne con le tabelle (a tutto schermo)
- Introduzione
- Creare un layout tableless fisso a due colonne
- Creare un layout tableless fisso a tre colonne
- Creare un layout tableless fluido a due colonne (a tutto schermo)
- Creare un layout tableless fluido a tre colonne (a tutto schermo)
- Considerazioni finali
- Introduzione
- Creare un menu verticale con un "div" ed effetto rollover
- Creare un menu verticale con un elenco ed effetto rollover
- Creare un menu orizzontale con le tabelle ed effetto rollover
- Creare un menu orizzontale con i "div" con effetto rollover
- Creare un menu orizzontale con un elenco ed effetto rollover
- Semplici "effetti speciali" sui menu
- Menu dinamico verticale in DHTML
- Menu dinamico orizzontale in DHTML
- Creare un "footer menu"
- Introduzione
- Applicare uno sfondo alla pagina o ad un box
- Applicare angoli arrotondati ai box
- Box con effetto ombra
- Box centrato rispetto alla risoluzione della pagina
- Effetti "speciali" per i link
- Personalizzare gli elenchi puntati con delle immagini
- Rollover sulle immagini con i CSS
- Effetto "loading" per le foto molto pesanti
- Rendere leggibile un report di dati alternando i colori delle celle
- Concetti di usabilità ed accessibilità
- Accessibilità di un menu di navigazione
- Accessibilità di un modulo HTML
- Testi ad alta leggibilità per soggetti ipovedenti o ipervedenti
- Considerazioni finali
- Breve guida all'HTML - Parte 2
- Breve guida ai fogli di stile CSS - Parte 1
- Breve guida ai fogli di stile CSS - Parte 2
- Javascript: quello che un Web Designer deve sapere
- Tutorial - Creare layout con le tabelle per un sito Web
- Tutorial - Creare layout tableless per un sito Web (senza tabelle)
- Tutorial - Speciale menu di navigazione - Parte 1
- Tutorial - Speciale menu di navigazione - Parte 2
- Tecniche avanzate, un po' di esempi pratici - Parte 1
- Tecniche avanzate, un po' di esempi pratici - Parte 2
- Design ed accessibilità