programma del corso web graphic designer

PROGRAMMA DEL CORSO WEB GRAPHIC DESIGNER
Il percorso Web Graphic Designer con Certificazione internazionale Adobe Dreamweaver prepara lo
studente ad acquisire solide conoscenze per la figura professionale del Web Designer. Durante il corso lo
studente potrà apprendere le tematiche inerenti la progettazione di template grafici per tutti i
dispositivi, la loro realizzazione e il montaggio. Le tematiche verranno affrontate con un occhio sempre
attento a quegli aspetti della comunicazione e delle tecnologie che costituiscono un arricchimento
fondamentale per i professionisti della Rete.
Prerequisiti
Nessun prerequisito particolare a parte un buon utilizzo di Internet.
Obiettivi
Realizzare e gestire siti web di piccole e medie dimensioni, avvalendosi degli strumenti e delle metodologie di
analisi più di frequente utilizzati dai professionisti del settore.
MODULO ADOBE PHOTOSHOP CS5
Unità didattica 1 - Grafica bitmap ed introduzione all’utilizzo di photoshop
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
Concetti fondamentali di Photoshop
Immagini bitmap e grafica vettoriale
Dimensioni e risoluzione delle immagini
Unità didattica 2 - Uso degli strumenti
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
Uso delle palette principali
modificare le dimensioni e la risoluzione di un’immagine
metodi modelli di colore e conversioni tra i metodi di colore
uso degli strumenti di selezione
i tracciati di ritaglio
la modalità maschera veloce
Unità didattica 3 - La gestione del colore
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
Colori singoli e quadricromia
modalità colore: CMYK e RGB
creazione e modifica dei colori
Data Rev. 01/08/12
Motivo rev.: prima emissione
REV. N.: 0
ED. N.: 0
Pag. 1 di 5
Azienda con sistema di gestione per la qualità certificata secondo le norme UNI EN ISO 9001:2000
Unità didattica 4 - Creazione e gestione dei testi
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
La palette carattere
Formattazione dei testi
Impaginare un testo
Creare effetti sui testi
Unità didattica 5 - Uso dei livelli
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
I livelli e le loro proprietà
La gestione dei livelli
Modificare i livelli
Le maschere di livello
Gli stili di livello
Unità didattica 6 - La trasparenza
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
Applicare le impostazioni di trasparenza
Modificare l’opacità agli oggetti grafici
Applicare un contorno sfocato
Creazione di un’ombra esterna
MODULO HTML/CSS CON ADOBE DREAMWEAVER CS5
Unità Didattica 1 - Introduzione al web
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
Come funziona il web?
Modello client/server
Differenze tra linguaggi di markup e linguaggi di programmazione
Unità didattica 2 - Elementi di HTML
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
HTML, dalla nascita al HTML5
Editor HTML, Adobe Dreamweaver CS5
Pannelli e barra delle proprietà in Dreamweaver
Struttura di base del HTML, elementi di blocco e inline
Tag principali in HTML: html, head, body ecc..
Creazione di una pagina HTML
Modalità di visualizzazione dei documenti di lavoro in Dreamweaver
Definizione attributi e panoramica attributi principali del HTML
Data Rev. 01/08/12
Motivo rev.: prima emissione
REV. N.: 0
ED. N.: 0
Pag. 2 di 5
Azienda con sistema di gestione per la qualità certificata secondo le norme UNI EN ISO 9001:2000
Caricare i file su un server remoto: il protocollo ftp
Impostare un sito in locale e in remoto con Dreamweaver
Caricare, cancellare e spostare file in remoto e locale
Unità didattica 3 - Inserire contenuti
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
Come creare collegamenti ipertestuali, il tag a (link, ancore e mailto )
Differenze tra collegamenti assoluti e relativi
Inserire le immagini, il tag img
Creazione di liste, i tag ul, ol e li
I formati immagine per il web
Costruzione di una tabella, i tag table, tr,td
Frame e iframe, incorporare una pagina HTML dentro l'altra
Unità didattica 4 - I metadati e l'indicizzazione
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
Definizione metadati
Il Doctype, definizione e utilizzo
Il tag head
Inserire Title, description e keywords nelle pagine
il tag meta
Unità didattica 5 - I CSS e la formattazione delle pagine HTML
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
Introduzione ai CSS e regole principali per la formattazione del testo
Inserire CSS in linea
Classi e id
CSS interni alla pagina (tag style e selettori)
I fogli di stile esterni, vantaggi e limitazioni
Associare un foglio di stile esterno ad una pagina HTML
Le pseudoclassi, in particolare :link, :visited, :hover
Formattare i link tramite le pseudoclassi
Unità didattica 6 - Impaginare in HTML
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
Metodi superati di impaginazione (tabelle, frame)
Il box model (padding, bordi e margini)
Le regole float e clear.
Realizzare un layout tramite css e i tag div
Data Rev. 01/08/12
Motivo rev.: prima emissione
REV. N.: 0
ED. N.: 0
Pag. 3 di 5
Azienda con sistema di gestione per la qualità certificata secondo le norme UNI EN ISO 9001:2000
Unità didattica 7 - Realizzazione e manutenzione di un sito
style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">
Realizzazione di un semplice sito, struttura HTML e veste grafica
Messa online del sito
Creazione di modelli in Dreamweaver e i vantaggi del loro uso
Creazione aree modificabili
Associare i modelli alle pagine HTML
MODULO REALIZZARE TEMPLATE GRAFICI PER DISPOSITIVI MOBILI
Layout a griglia fissa, fluidi e responsive
Analisi del sito: definire il target
Analisi dei contenuti
Scegliere una paletta di colori e i font più adatti
Definire un layout per ogni tipo di dispositivo (smartphone, tablet e desktop)
Lavorare con una griglia: vincoli e vantaggi
Gli stili del Web Design
Pensare un sito moderno: il Flat Design
MODULO HTML/CSS AVANZATO
Scrivere codice semantico
Lavorare con unità di misura relative: percentuali ed em
Conoscere i dispositivi: risoluzione dichiarata ed effettiva
Definire i breakpoint tramite le media query Impaginare tramite una griglia css
Data Rev. 01/08/12
Motivo rev.: prima emissione
REV. N.: 0
ED. N.: 0
Pag. 4 di 5
Azienda con sistema di gestione per la qualità certificata secondo le norme UNI EN ISO 9001:2000
Utilizzare e personalizzare la griglia di Bootstrap
Costruire menù mobile
Transizioni e animazioni con il css3
MODULO ANIMAZIONI CON JQUERY
Cos’è jQuery
Da Javascript a jQuery
Importare jQuery nelle pagine html
I metodi e la sintassi
Manipolare la pagina html
Effetti e animazioni semplici
Animazioni e widget avanzati con jQuery UI
Data Rev. 01/08/12
Motivo rev.: prima emissione
REV. N.: 0
ED. N.: 0
Pag. 5 di 5
Azienda con sistema di gestione per la qualità certificata secondo le norme UNI EN ISO 9001:2000