Il web design o web design, letteralmente progettazione per il world wide web, è un’espressione inglese utilizzata anche nella lingua italiana per indicare la progettazione tecnica, strutturale e grafi ca di un sito web.

DEFINIZIONI

Web designProgettazione per il world wide web. E’ l’attività di ideazione, progettazione e costruzione di un sito internet desti-nato ad essere fruito con un browser web,testuale o soft ware dedicato alla navigazione. Le fi gure professionali che partecipano ad un’attività di web design sono : l’information architect, colui che progetta l’architettura delle infor-mazioni, l’interface designer, che si occupa di progettare l’interfaccia grafi ca della soluzione web impaginandone i contenuti il web designer che realizza il “ web design “ ossia le pagine web nei formati che i browser web possono leggere. Il webmaster è il gestore e responsabile del funzionamento tecnico del sito web dopo essere stato pubblica-to. La realizzazione di un sito web effi cace nasce dalla fusione di interazioni professionali che volgono tutte verso la stessa prospettiva comunicativa e tecnica. Un sito web deve essere gradevole di facile esplorazione e soprattutto deve avere la forza di comunicare immediatamente il messaggio o la fi nalità per cui è stato concepito.

Information architectectureNella vita quotidiana ogni persona che utilizza i moderni sistemi d’informazione si comporta, a livelli diversi, come un information architect: attribuisce nomi alle cartelle di posta e organizza i propri bookmark. Tuttavia, progettare e applicare precise architetture nel mondo digitale è decisamente più diffi cile. Questo sia perché si devono raggrup-pare ed etichettare informazioni per renderle accessibili agli utenti, sia perché il volume e l’eterogeneità delle infor-mazioni aumenta con il tempo. La realizzazione di architetture informative davvero effi caci richiede competenze specifi che, e la conoscenza e l’applicazione di metodi e strumenti ormai “testati” e consolidati. Web designerIl web designer ha competenze si occupa dell’aspetto visivo ( web design ) di un sito web, valorizzando l’identità del marchio e cercando di coniugare aspetto estetico ad agibilità di navigazione.Il web designer è pratico di conoscenze di stampo grafi co, comuni aldesigner, quali la creatività e la capacità di mediare tra le esigenze del cliente e

quelle dell’utente, e di stampo tecnico, proprie di un webmaster, quali: conoscenza della struttura generale del Web e suo funzionamento. Per lavori complessi e articolati, il web designer collabora con un team di sviluppatori che ha specifi che conoscenze di programmazione e di sviluppo soft ware. Breve storia del web designIl primo web designer è stato Tim Berners-Lee, inventore del World Wide Web e creatore del primo sito internet, pubblicato nell’agosto 1991. Lee è stato anche il primo a combinare la comunicazione internet (email e reti) con gli ipertesti (usati fi no a quel momento solo per navigare tra informazioni registrate su un solo computer oppure su un CD-Rom). Inizalmente, il web design ha utilizzato un semplice linguaggio di markup, l’ HTML, che include alcune opzioni di formattazione e la possibilità di creare collegamenti ipertestuali tra pagine grazie ai links.E’ stata questa caratteristica che ha distinto il web da altri mezzi di comunicazioni.HTML è nato dal linguaggio SGML, e ha iniziato la sua vita come un semplice linguaggio per formattare pagine. Con il tempo e l’uso l’HTML ha perso in parte la sua funzione di linguaggio per la formattazione pulita esemplice, “sporcato” dall’uso troppo insistente di tags come <font> per la formattazione del testo, oppure con l’uti-lizzo di alcuni elementi per funzioni diverse dal loro scopo originario. Mentre internet e il web design progredisce,il linguaggio di markup usato per crearlo, HTML, sta diventando più ordinato e fl essibile, anche grazie aglistandard del W3C. Ad esempio le tabelle, che inizalmente venivano usate come base per creare layouts ben allineati sono state in gran parte sostituite dai DIV con il supporto dei fogli di stile (CSS).L’integrazione di tecnologie come gli script server side (ad esempio PHP, ASP, JSP) e standard del design come CSS stanno rivoluzionando il modo di fare web design. Inizalmente, il web design ha utilizzato un semplicelinguaggio di markup, l’ HTML, che include alcune opzioni di formattazione e la possibilità di crearecollegamenti ipertestuali tra pagine grazie ai links.E’ stata questa caratteristica che ha distinto il web da altri mezzi di comunicazioni. HTML è nato dallinguaggio SGML, e ha iniziato la sua vita come un semplice linguaggio per formattare pagine. Con il tempoe l’uso l’HTML ha perso in parte la sua funzione di linguaggio per la formattazione pulita e semplice, “sporcato”

dall’uso troppo insistente di tags come <font> per la formattazione del testo, oppure con l’utilizzo di alcuni ele-menti per funzioni diverse dal loro scopo originario. Mentre internet e il web design progredisce,il linguaggio di markup usato per crearlo, HTML, sta diventando più ordinato e flessibile, anche grazie aglistandard del W3C.Ad esempio le tabelle, che inizalmente venivano usate come base per creare layouts.

Il Web design

Il Web Indesignè l'arte di creare template e layout per siti o per singole pagine Web che abbiano le caratteristichedi:

essere comunicative;essere grafi camente accattivanti;avere colori, toni ed elementi indicati all'oggetto del sito;essere leggere e veloci da caricare;fare un utilizzo parsimonioso di immagini e concentrare eff etti sui CSS.essere usabili, navigabili accessibili.Tutte queste caratteristiche troveranno un riscontro nel corso della guida.Vediamo adesso cosa si intende, in gergo, per template e layout. In eff etti non esiste grandissima diff erenza,dato che, tradotto in termini di uso più quotidiano, si tratta in entrambi i casi dell'aspetto di un sito e dellerelative pagine che lo compongono.

Web Design :Arte, creatività, innovazione grafi ca e professionalità si fondono per dar vita alla strategia di successo visiva di un sito e/o progetto web, aspetto e contenuto diventano elementi fondamentali di un unico insieme. Realizziamo ilDesign grafi co del sito in modalità totalmente custom, valutando gli aspetti esterni che possano infl uenzarel'aspetto comunicativo di realizzazione: competitor del mercato, fl ussi e processi aziendali, mission e obiettiviprimari dell'azienda interessata.

Fasi di studio della Struttura:- Studio della struttura/risoluzione- Studio della logica di navigazione

Fasi di studio di mercato e dei competitors:- Fase dedicata allo studio del prodotto/servizio e alle sue tipologie (linee e categorie, altre variabili)- Fase dedicata allo studio della concorrenza- Fase dedicata allo studio del target per fasce di eta' e tipologia, e altre variabili

Ideazione della Grafi ca/Design:- Realizzazione di grafi che altamente professionali e custom, in base alle esigenze del cliente e della sua azienda in riferimento ai risultati di comunicazione attesi verso il target di riferimento

Compatibilità :- Soluzioni grafi che e implementative per rendere la soluzione compatibile con i maggiori browsers presenti sul mercato.- Soluzioni compatibili con i vari ambienti (Mac, Windows, ecc...)- Conoscenze approfondite di: adobe photoshop, adobe illustrator, ecc..

Design Applicativo

Progettazione delle logiche applicative, delle strutture di navigazione, delle grafi che delle interfacce, studio egrafi che degli oggetti applicativi (bottoni, liste, ecc...);realizzazione di template o modelli grafi ci per interfaccie od oggetti funzionali:

Ideazione Grafi caDesigner WPF, o altri ...

1 - Ideazione Grafi caE' necessaria in primo luogo un'ideazione grafi ca per l'interfaccia del soft ware (forme, colori, sfumature, etc).che noi realizziamo, voi la visionate, date l'ok, ecc.....questo lavoro "prettamente grafi co" è stato e viene consegnato ed approvato in tempi rapidissimi

2 - Designer WPF, ecc... (templates - modelli)

In secondo luogo è necessario creare degli oggetti (WPF, ecc...) in base all'ideazione grafi ca che siano in grado di interagire sia con l'utente,sia con la parte logico-funzionale del soft ware;

Grafi ca/Design

La Grfi ca detta anche Indesign si divide in:

- Sviluppo del brand, campagne pubblicitarie, strategie di comunicazione, grafi ca & web design, animazioni e soluzioni di grafi ca 3d.

- Studio e progettazione grafi ca, corporate identity (studio del logo, carta intestata, bv, etc...) e corporate publishing (brochure, depliants, volantini, etc...)

- Conoscenze approfondite di: adobe photoshop, adobe illustrator, adobe aft er eff ect, adobe premiere, ecc..

La realizzazione di un sito web

La realizzazione di un sito web è un'operazione che coinvolge e fonde diverse competenze: il prodotto fi nale deve essere gradevole, di facile esplorazione, presentare in maniera chiara i propri contenuti ed essere utilizzabile in sicurezza e con semplicità.Risolvere tutti questi problemi coinvolge, oltre al webmaster, molteplici fi gure professionali.Le fi gure professionali che partecipano alla progettazione variano in funzione della complessità del progetto e del budget ad esso dedicato: l'information architect che raccoglie i requisiti utente e progetta l'architetturadelle informazioni, l'interface designer che progetta l'interfaccia grafi ca, il web designer è una personaesperta nel campo della grafi ca per web che codifi ca ("traduce") la bozza grafi ca in pagine web in formatoHTML / XHTML per i browser web.Dal 2000 circa in poi, grazie a strumenti, linguaggi ed innovazioni sempre più avanzati nel campo delWeb Design e del Graphic design, il titolo di Web designer è più consono ad una fi gura professionale chesi occupa di strutturare un sito nel suo insieme con vari Wireframe e della codifi ca in linguaggi web avanzati di una bozza grafi ca realizzata da un Graphic designer, esperto di grafi ca ma solitamente carente sotto il profi lodei linguaggi avanzati. Quindi, mentre inizialmente la fi gura del Web Designer era un tuttofare, con losvilupparsi del mercato si tende a suddividere il lavoro di creazione di un sito più fasi distinte.Esistono tuttavia numerosi Web designer che sono esperti anche nel campo del Graphic design, mentre è rara la situazione inversa. Progetti più complessi ed evoluti richiedono, oltre alle professionalità già citate,specialisti di marketing per defi nire la strategia comunicativa, esperti di copywriting per redigere o correggere il contenuto,sviluppatori che si occupano di generare applicazioni dinamiche che attingono a database e aggiungonofunzioni interattive alle pagine web.Gli strumenti di lavoro più ampiamente utilizzati sono soft ware qualieditor web e per fogli di stile e pacchetti di elaborazione grafi ca vettoriale e bitmap. Pagine Web interattive edinamiche in questi giorni sono in genere create in PHP.

Adobe InDesign

Adobe InDesign è un programma di produzione editoriale prodotto da Adobe System e rivolto all'editoriaprofessionale. Sviluppato come concorrente di Quark XPress e rilasciato nella sua prima versione nell'agosto del 1999, la sua ultima versione, InDesign CS6, è inclusa nella Adobe Creative Suite 6 che comprende anche Photoshop, Illustrator, Acrobat, Bridge, Version Cue, GoLive e, con l'acquisizione di Macromedia, anche DreamWeaver.InDesign si colloca come successore ed alternativa ad alto profi lo di Pagemaker. Tra le sue caratteristiche principali: il supporto multilingua, la gestione avanzata di caratteri OpenType, la possibilità di gestire eff etti di trasparenza, e la forte integrazione con gli altri prodotti di casa Adobe. In combinazione con data base relazionali e InCopycostituisce il sistema di pubblicazione per riviste, giornali e prodotti editoriali di varia natura.Il formato dei fi le di InDesign è il .indd anche se il programma permette un interscambio di dati tramite unarappresentazione di XML indicata con estensione .inx. Adobe Indesign permette di importare anche i fi le .psd,gestendone i livelli e le trasparenze. L'esportazione in PDF è integrata nel programma e personalizzabile.Nell'ottobre del 2005 è stata rilasciata una versione chiamata InDesign CS2 Server, che permette l'impaginazione in remoto tramite interfaccia web.