Web Design, creazione sito e animazioni: progettazione e interfaccia grafica del sito

• Briefing (definizione oggetto comunicazione, target, timing, budget)
• Esigenze del cliente – siti statici o dinamici
• Documento di analisi
• Creazione del concept grafico:
  
  • Struttura (header, content, footer, menu principale e secondario, link, area riservata)
  • Contenuti (visual, logo, marchio, pay off, slogan, headline)
  • Creazione del Flow Chart

• Le immagini bitmap e la risoluzione 
• Le immagini vettoriali
• La teoria e i metodi colore (CMYK, RGB, HSB, LAB, i Pantone)

PHOTOSHOP:

• Fotocomposizione: le selezioni le trasformazioni 
• Le regolazioni
• I livelli: i metodi di fusione, gli stili livello
• Uso delle maschere di livello
• Uso dei tracciati e delle forme 
• Esportazione d’immagini adattate per il web in formato gif, jpg o png

• La struttura del sito: creazione del wireframe (Photoshop/Indesign)
• Il mockup grafico (Photoshop/Indesign)
• Cenni al responsive web design 
• Gestione delle immagini e dei colori
• Gestione dei contenuti 
• Creazione del progetto grafico del sito 

Introduzione al web 

• Introduzione al sistema Internet e suo funzionamento
• Breve storia di internet : da ARPANet a HTML del W3C, passaggio a XHTML ed eveluzione in HTML5
• I CSS e i JAVSCRIPT, altri linguaggi di programmazione
• Il ruolo dei browser
• I Provider (spazio web e dominio)
• I Motori di ricerca (indicizzazioni e posizionamenti)
  

HTML CSS e DREAMWEAVER 

• Il linguaggio HTML:
  • i tag e la sua struttura  (Intestazione/codifica, head e meta tag e body)
• I nuovi elementi di struttura e i nuovi tag in HTML 5 (header, footer,nav,section, ecc)
  
  
• DREAMWEAVER: 
  • Interfaccia grafica, impostazioni dello spazio di lavoro, definizione del sito
• I meta TAG:
  • Title, description, keywords, per l’indicizzazione del sito
• Creazione del layout tramite div
• Reset dei valori di default degli elementi Html nei browser
• I selettori CSS 3: classi e le pseudo classi, tag, id e composti
• Il box mode:l dimensioni margini e padding
• Il colore e i nuovi metodi CSS 3 (opacity, RGBa, HSLa)
• Gli sfondi e le nuove possibilità CSS 3 (sfumature, sfondi multipli)
• I bordi ed i nuovi bordi (arrotondati e le ombre)
• I posizionamenti, i margini e i padding
• Posizionamenti assoluti, relativi o fissi e float
• Gestire l’overflow
• L’aspetto dei contenuti tramite gli stili CSS:
• Gli aspetti e la gestione dei testi, delle liste e i WEB Fonts CSS 3
• I Titoli ed i pargrafi
• Gestire le immagini tramite i CSS
• Gestire le tabelle tramite i CSS
• Il menu di navigazione
• Gestione delle liste 
• I collegamenti e gli stili dei collegamenti testuali, hover su div 
• Le transizioni, trasformazioni e animazioni con CSS 3
• Creare una web gallery tramite CSS 3
  

Pubblicazione del sito

• Operare in modalità FTP 
• Accenno alle politiche di S.E.O Search Engine Optimization