SlideShare ist ein Scribd-Unternehmen logo
1 von 25
Downloaden Sie, um offline zu lesen
Sviluppo di un sito web
                Sviluppo di un sito web



     Introduzione ad aspetti e problematiche da trattare nello sviluppo di un sito web.
                       p       p                                    pp
                              Cenni sulla qualità del prodotto.

CL                                                                                Gennaio 2008
Un processo complesso
     La creazione di un sito web è un processo complesso che 
     coinvolge diverse competenze e professionalità.
            g               p         p

     Di seguito è presentato un modello procedurale che individua le 
     f i i i li i         i i ò ddi id         il
     fasi principali in cui si può suddividere il processo di creazione di 
                                                           di      i    di
     un sito web e le relative figure professionali coinvolte




CL                                                                    Gennaio 2008
Le varie fasi
     Per i nostri scopi sarà utile considerare nel seguito i task 
     dall’1 al 6, essendo i restanti due di natura prettamente tecnica e 
     d ll’ l           d i          i d di                         i
     ci soffermeremo in maniera particolare sui task 1 e 2. 




CL                                                                  Gennaio 2008
Fase 1: Strategie e requisiti




     • Quali sono gli obiettivi da raggiungere con il sito?
     • Qual è il target di utenti?
       Q            g
     • Quali contenuti voglio offrire?                         vincoli
     • Quali servizi voglio offrire?
     • Ci sono particolari vincoli e/o requisiti da soddisfare?
     •(Che tecnologie voglio utilizzare?)
                           contenuti                      requisiti
      obiettivi
                    target
                    t    t              servizi
                                            ii           tecnologie
CL                                                                  Gennaio 2008
Fase 1: Strategie e requisiti 
                       tre obiettivi principali 
                       tre obiettivi principali


                                                   Chi sono? A cosa servo?
                          Identità                    “Ricordati di me”


                                                            Perché proprio io e non
                          Differenziazione                  altri?

     Obiettivi
                            Fidelizzazione                   “Torna da me”
                                                              Torna da me




                                      …

CL                                                                      Gennaio 2008
Fase 2: Web Design
                                        Intro




     In questa fase si definiscono:

        • L’organizzazione dei contenuti/servizi del sito
           ’               d            /        d l

        • La struttura di navigazione
          La struttura di navigazione

        • La “gabbia visiva” (o layout) delle varie pagine
              g              ( y )                  p g




CL                                                           Gennaio 2008
Fase 2: Web Design
                       Organizzazione dei contenuti/servizi
                         g                         /

              L’organizzazione dei contenuti è alla base dei sistemi di navigazione: 
           i portali si navigano in base al sistema organizzativo scelto inizialmente.
           i portali si navigano in base al sistema organizzativo scelto inizialmente

     L’Architettura dell’Informazione si occupa  di progettare la struttura semantica di 
                                     p
     un sito decidendo dove e come posizionare contenuti e servizi, definendone così 
     l’architettura informativa ovvero il modo in cui le informazioni vengono organizzate 
     all’interno del sito.

     Attualmente sul web vengono usati tre schemi di organizzazione:

          1. Gerarchico

          2. A faccette

          3. Cronologico
          3 C     l i

     Il Cronologico è riferito ad un particolare tipo di sito, il blog, e nel seguito verrà 
     tralasciato.
     tralasciato


CL                                                                                        Gennaio 2008
Fase 2: Web Design
        Organizzazione dei contenuti/servizi: Schema Gerarchico
          g                         /

     La struttura gerarchica (o ad albero) si basa su un sistema che si dipana dalla home 
     in macroaree che si dividono a loro volta in aree e sottoaree fino ad arrivare alle 
     in macroaree che si dividono a loro volta in aree e sottoaree fino ad arrivare alle
     singole pagine.
                                              •Semplice da gestire
                                              •Lineare da ideare
                                               Lineare da ideare
                                              •Navigazione più tradizionale Utente più 
                                              sicuro

                                            •Struttura rigida
                                            •Rischio di “seppellire” informazione
                                            •Se il sito è ampio molti click per raggiungere 
                                            informazione

                Compromesso tra ampiezza e profondità dell’albero:
                     p                 p        p
                •Più categorie Minore Profondità  (meno click per raggiungere contenuti, 
                ma rischio di indecisione dell’utente, quale categoria scegliere?)
                •Meno categorie Maggiore Profondità (Facile scegliere una categoria, 
                maggiore flessibilità, ma tanti click per raggiungere le pagine)

CL                                                                                   Gennaio 2008
Fase 2: Web Design
        Organizzazione dei contenuti/servizi: Schema A Faccette
          g                         /

     Lo schema a faccette è aperto e multidimensionale. Ogni contenuto/servizio viene 
     classificato in base a diversi attributi e non categorizzato in una ed una sola 
     classificato in base a diversi attributi e non categorizzato in una ed una sola
     categoria. La struttura generata è una “foresta” (e non un albero).
                                          • Enfasi sull’utente
                                          •Maggiore reperibilità dei contenuti
                                          •Maggiore flessibilità nell’aggiunta di contenuti 
                                          nuovi
                                          •Sistema “aperto”

                                          •Ancora poco diffusa l’utente non è abituato
                                                    p
                                          •Maggiore complessità nella gestione
                                          •E’ difficile pensare in più dimensioni
                                          progettazione  più attenta ed accurata 
                                          maggior tempo di sviluppo




CL                                                                                 Gennaio 2008
Fase 2: Web Design
                               Struttura di navigazione
                                                g



     Per struttura di navigazione si intende l’insieme di barre, pulsanti e menù che 
     consentono all’utente di muoversi in maniera agevole all’interno del sito web.

     L’obiettivo è creare una buona struttura e fornire agli utenti un aiuto per muoversi 
     senza che essi debbano pensare troppo (“Don’t make me think”)

     Occorre rispondere alle seguenti domande dell’utente:

                                        1) dove mi trovo?
                                            dove mi trovo?
                                         2) dove sono stato?
                                        3) dove posso andare?

     Occorre cioè fornire un CONTESTO ed un PERCORSO per l’utente.




CL                                                                                      Gennaio 2008
Fase 2: Web Design
                               Struttura di navigazione
                                                g



     Occorre individuare il tipo ed il numero di menù che si vogliono utilizzare:

                                         Menù principale
                                         M ù i i l

                                        Menù contestuale

                             Menù in intestazione e/o a piè di pagina

     Successivamente occorre decidere quando e dove ripetere ciascun menù (ad esempio, 
     Successivamente occorre decidere quando e dove ripetere ciascun menù (ad esempio
     il menù principale và ripetuto in ogni pagina?)




CL                                                                                  Gennaio 2008
Fase 2: Web Design
                                               Layout
                                                 y

     Il layout stabilisce la posizione di contenuti, servizi, pulsanti, menù e barre di 
          y                  p                     ,        ,p        ,
     navigazione all’interno della pagina web.




CL                                                                                         Gennaio 2008
Fasi 3,4,5,6



     Visual Design: si stabilisce la grafica del sito in termini di logo, immagini, carattere, 
     colori, bordo pagina, bordo sezione e così via...
     Sviluppo del software: il portale viene realizzato ex novo o assemblando componenti 
     Sviluppo del software: il portale viene realizzato ex novo o assemblando componenti
     già disponibili sul mercato, utilizzando le tecnologie che più rispondono ad obiettivi e 
     scelte progettuali.
     Gestione dei contenuti: vengono redatti i contenuti utilizzando stile e linguaggio 
     Gestione dei contenuti: vengono redatti i contenuti utilizzando stile e linguaggio
     adeguato al target scelto. Nella redazione dei contenuti si considera sempre che 
     “leggere sullo schermo non è leggere su carta”. Si pone quindi attenzione a lunghezza 
     dei documenti,densità di parole, supporto di immagini. Per pubbliche 
     dei documenti densità di parole supporto di immagini Per pubbliche
     amministrazioni si adotta “plain language” ovvero linguaggio semplice, facilmente 
     comprensibile dall’utente finale (come richiesto dal CNIPA)
                                       g                           p       gg
     Esercizio del sito: il sito è a regime. Il webmaster si occupa di aggiornare contenuti,  ,
     fare il backup di contenuti, gestire eventuali ampliamenti di sezione e così via…

CL                                                                                       Gennaio 2008
Supporti metodologici
     •Mappe mentali
     •Tabelle
     •Flow chart
     •Brain storming: i sei cappelli colorati
       rain storming: i sei cappelli colorati
          Bianco    Fatti e dati oggettivi. Raccolta informazioni. Niente giudizi.    

          Rosso     Emotività. Esprimere di  getto le proprie intuizioni e suggerimenti
                    Emotività. Esprimere di getto le proprie intuizioni e suggerimenti

          Verde     creatività e produzione di nuove idee, analisi di proposte 
                    migliorative e di visioni insolite
                       g

          Giallo    è il cappello dell'ottimismo e dei pensieri positivi

          Nero      Aspetti negativi del progetto

          Blu        impiegato per il controllo e l'organizzazione del processo di pensiero. 
                    Stabilisce priorità, metodi, sequenze funzionali. Pianifica, organizza, 
                    stabilisce le regole del gioco.
CL                                                                                       Gennaio 2008
Tempo per…


     Dubbi /domande ?
     Dubbi /domande ?



     Idee / proposte?
     Idee / proposte?

CL                      Gennaio 2008
Qualità di un sito web
     Q lità di      it    b




CL                            Gennaio 2008
La qualità: cos’è?
                                       Qualità

       l’insieme delle caratteristiche che determinano la rispondenza 
              di un prodotto alla funzione per la quale è utilizzato
                                                          (Dizionario De Mauro‐Paravia)

                     La qualità dunque si valuta in base al contesto
                     (utilizzo/utilizzatore), si esprime attraverso delle caratteristiche e si 
                     quantifica attraverso delle misure
                     quantifica attraverso delle misure.

                     Esempio:

                     Se fossi un pilota la qualità di un automobile sarebbe...
                     Se fossi un collezionista la qualità di un automobile sarebbe...
                     Se fossi un esperto di motori la qualità di un automobile sarebbe...
                     Se fossi un esperto di motori la qualità di un automobile sarebbe...
                     Se fossi padre di cinque figli la qualità di un automobile sarebbe...

Carlo Lombardi                                                                        Gennaio 2008
Qualità & Siti web: enfasi sull’utente

         Siamo interessati a valutare la qualità di un sito web dal
                        punto di vista dell’utente 
                     (è questo il nostro contesto!).
                     (è       t il    t       t t !)



     La nostra definizione di qualità si baserà dunque solo su aspetti 
       esterni e/o funzionali del sito web e legati all’ “uso” del sito 
               (e non su aspetti tecnici ed implementativi). 


              Parleremo di  Qualità nell uso o Usabilità
              Parleremo di “Qualità nell’uso” o “Usabilità”

CL                                                                    Gennaio 2008
L’usabilità – ISO/IEC 9126‐1

                      Qualità nell’uso:
                         li à ll’

             la capacità di un prodotto software di
             la capacità di un prodotto software di
     aiutare determinati utenti a raggiungere determinati
                          obiettivi con 
                             efficacia 
                            efficienza
                            sicurezza
                             i
                         soddisfazione
                  in determinati contesti d uso 
                  in determinati contesti d’uso

                      (Norma ISO/IEC 9126‐1)



CL                                                          Gennaio 2008
Un modello di qualità: le caratteristiche




CL                                         Gennaio 2008
Il processo di creazione e la qualità




CL                                       Gennaio 2008
Sottocaratteristiche del modello



                 Su formato cartaceo…




CL                                      Gennaio 2008
Approfondimenti e riferimenti bibliografici
     ISO/IEC 9126: Information Technology –
     Software Product Evaluation – Quality Characteristics
     and Guidelines for their Use. 1991 e 2000.
     and Guidelines for their Use 1991 e 2000

     ISO 9241: Requisiti ergonomici per il lavoro di
     ufficio con terminali video.

     Polillo R.: Il check‐up dei siti web – valutare la
     qualità per migliorarla. Apogeo, Milano, 2004.

     Architettura dell’informazione
     per il World Wide Web. Hops Libri, Milano,
     2002.

     Pressman.Principi di Ingegneria del Software.
     McGrawHill,2004

     www.cnipa.it – Sito del Comitato Per l’Informatica nella P.A.
     http://webdesign.html.it – Portale dedicato allo sviluppo web
     www.trovabile.it – Organizzare l’informazione per renderla (ri)trovabile
     www.mondodigitale.net – Rassegna critica del settore ICT
     www.mestierediscrivere.com ‐ Portale sulla produzione di contenuti scritti
CL                                                                                Gennaio 2008
Tempo per…


     Dubbi /domande ?
     Dubbi /domande ?



     Idee / proposte?
     Idee / proposte?

CL                      Gennaio 2008
Grazie e…buona giornata




CL                             Gennaio 2008

Weitere ähnliche Inhalte

Was ist angesagt?

Wireframe e struttura del sito internet
Wireframe e struttura del sito internetWireframe e struttura del sito internet
Wireframe e struttura del sito internetDaniele Moraschi
 
Architettura e navigazione dei siti web
Architettura e navigazione dei siti webArchitettura e navigazione dei siti web
Architettura e navigazione dei siti webGiacomo Mason
 
Ottimizzare il sito web dell'Hotel
Ottimizzare il sito web dell'HotelOttimizzare il sito web dell'Hotel
Ottimizzare il sito web dell'Hotelsorrentoinfo
 
Un modello retorico per l’analisi delle piattaforme partecipative on-line
Un modello retorico per l’analisi delle piattaforme partecipative on-lineUn modello retorico per l’analisi delle piattaforme partecipative on-line
Un modello retorico per l’analisi delle piattaforme partecipative on-lineMarcello Brivio
 
Facebook Evolution - Come gestire la comunicazione su FB
Facebook Evolution - Come gestire la comunicazione su FBFacebook Evolution - Come gestire la comunicazione su FB
Facebook Evolution - Come gestire la comunicazione su FBArtlandis' Webinar & Workshop
 
Laboratorio internet: 5. Requisiti (parte III)
Laboratorio internet: 5. Requisiti (parte III)Laboratorio internet: 5. Requisiti (parte III)
Laboratorio internet: 5. Requisiti (parte III)Roberto Polillo
 
Docenza per Cesvot - Prato
Docenza per Cesvot - PratoDocenza per Cesvot - Prato
Docenza per Cesvot - Pratoneri & neri
 
Basi di progettazione di un sito web
Basi di progettazione di un sito webBasi di progettazione di un sito web
Basi di progettazione di un sito webSabrinaC91
 
Semplicità: accessibilità business oriented
Semplicità: accessibilità business orientedSemplicità: accessibilità business oriented
Semplicità: accessibilità business orientedFabrizio Caccavello
 

Was ist angesagt? (18)

Wireframe e struttura del sito internet
Wireframe e struttura del sito internetWireframe e struttura del sito internet
Wireframe e struttura del sito internet
 
Lezione 01/2006
Lezione 01/2006Lezione 01/2006
Lezione 01/2006
 
Lezione 03/2006
Lezione 03/2006Lezione 03/2006
Lezione 03/2006
 
Architettura e navigazione dei siti web
Architettura e navigazione dei siti webArchitettura e navigazione dei siti web
Architettura e navigazione dei siti web
 
Lezione 09/2006
Lezione 09/2006Lezione 09/2006
Lezione 09/2006
 
Ottimizzare il sito web dell'Hotel
Ottimizzare il sito web dell'HotelOttimizzare il sito web dell'Hotel
Ottimizzare il sito web dell'Hotel
 
Un modello retorico per l’analisi delle piattaforme partecipative on-line
Un modello retorico per l’analisi delle piattaforme partecipative on-lineUn modello retorico per l’analisi delle piattaforme partecipative on-line
Un modello retorico per l’analisi delle piattaforme partecipative on-line
 
Lezione 10/2006
Lezione 10/2006Lezione 10/2006
Lezione 10/2006
 
Lezione 08/2006
Lezione 08/2006Lezione 08/2006
Lezione 08/2006
 
Lezione 07/2006
Lezione 07/2006Lezione 07/2006
Lezione 07/2006
 
Facebook Evolution - Come gestire la comunicazione su FB
Facebook Evolution - Come gestire la comunicazione su FBFacebook Evolution - Come gestire la comunicazione su FB
Facebook Evolution - Come gestire la comunicazione su FB
 
Social Media Marketing: Corso avanzato
Social Media Marketing: Corso avanzatoSocial Media Marketing: Corso avanzato
Social Media Marketing: Corso avanzato
 
Lezione 02/2006
Lezione 02/2006Lezione 02/2006
Lezione 02/2006
 
Lezione 05/2006
Lezione 05/2006Lezione 05/2006
Lezione 05/2006
 
Laboratorio internet: 5. Requisiti (parte III)
Laboratorio internet: 5. Requisiti (parte III)Laboratorio internet: 5. Requisiti (parte III)
Laboratorio internet: 5. Requisiti (parte III)
 
Docenza per Cesvot - Prato
Docenza per Cesvot - PratoDocenza per Cesvot - Prato
Docenza per Cesvot - Prato
 
Basi di progettazione di un sito web
Basi di progettazione di un sito webBasi di progettazione di un sito web
Basi di progettazione di un sito web
 
Semplicità: accessibilità business oriented
Semplicità: accessibilità business orientedSemplicità: accessibilità business oriented
Semplicità: accessibilità business oriented
 

Ähnlich wie Sviluppo Di Un Sito Web

Agile Experience Design & Development - IAD 2012
Agile Experience Design & Development - IAD 2012Agile Experience Design & Development - IAD 2012
Agile Experience Design & Development - IAD 2012Timothy Carniato
 
Aziende Fornitori Web2.0
Aziende Fornitori Web2.0Aziende Fornitori Web2.0
Aziende Fornitori Web2.0Gabriella
 
Online Customer Experience
Online Customer ExperienceOnline Customer Experience
Online Customer ExperienceDML Srl
 
Come Nasce Un Sito Internet?
Come Nasce Un Sito Internet?Come Nasce Un Sito Internet?
Come Nasce Un Sito Internet?Davide Schioppa
 
6 Step per un Sito Funzionale: 2. Progetto del Website
6 Step per un Sito Funzionale: 2. Progetto del Website6 Step per un Sito Funzionale: 2. Progetto del Website
6 Step per un Sito Funzionale: 2. Progetto del WebsiteFormazioneTurismo
 
Guida autovalutazione-3-0
Guida autovalutazione-3-0Guida autovalutazione-3-0
Guida autovalutazione-3-0Paola Severi
 
DOCFLOW - integrazione Document Management e Business Process Management nel ...
DOCFLOW - integrazione Document Management e Business Process Management nel ...DOCFLOW - integrazione Document Management e Business Process Management nel ...
DOCFLOW - integrazione Document Management e Business Process Management nel ...DOCFLOW
 
Web2.0 Enterprise2.0 Semantic Web
Web2.0 Enterprise2.0 Semantic WebWeb2.0 Enterprise2.0 Semantic Web
Web2.0 Enterprise2.0 Semantic WebClaudio Bergamini
 
Tecnologie e Tecniche per affrontare il Mondo che Cambia
Tecnologie e Tecniche per affrontare il Mondo che CambiaTecnologie e Tecniche per affrontare il Mondo che Cambia
Tecnologie e Tecniche per affrontare il Mondo che CambiaMarco Parenzan
 
Laboratorio Web Oriented
Laboratorio Web Oriented Laboratorio Web Oriented
Laboratorio Web Oriented Matteo Ziviani
 
Web Marketing, Recruiting e Employer Branding
Web Marketing, Recruiting e Employer BrandingWeb Marketing, Recruiting e Employer Branding
Web Marketing, Recruiting e Employer BrandingFrancesco Gramegna
 
Project management: Gestire progetto web con Agilità (con DSDM, Agile Project...
Project management: Gestire progetto web con Agilità (con DSDM, Agile Project...Project management: Gestire progetto web con Agilità (con DSDM, Agile Project...
Project management: Gestire progetto web con Agilità (con DSDM, Agile Project...Simone Onofri
 
Linee guida per i siti web delle PA - Uno spunto per tutti
Linee guida per i siti web delle PA - Uno spunto per tuttiLinee guida per i siti web delle PA - Uno spunto per tutti
Linee guida per i siti web delle PA - Uno spunto per tuttiextrategy
 
... thinking about Microformats!
... thinking about Microformats!... thinking about Microformats!
... thinking about Microformats!Stefano Fago
 
Web 2.0 (Internal presentation)
Web 2.0 (Internal presentation)Web 2.0 (Internal presentation)
Web 2.0 (Internal presentation)Andrea Pesoli
 
Web X Aziende Scettiche Prova
Web X Aziende Scettiche ProvaWeb X Aziende Scettiche Prova
Web X Aziende Scettiche ProvaGabriella
 
Francesco Micali : Come Organizzare i Contenuti Per Un Sito Web Efficace - Me...
Francesco Micali : Come Organizzare i Contenuti Per Un Sito Web Efficace - Me...Francesco Micali : Come Organizzare i Contenuti Per Un Sito Web Efficace - Me...
Francesco Micali : Come Organizzare i Contenuti Per Un Sito Web Efficace - Me...f.micali
 
Usabilità e User Experience Design: #3 Test e Performance sui Motori di Ricerca
Usabilità e User Experience Design: #3 Test e Performance sui Motori di RicercaUsabilità e User Experience Design: #3 Test e Performance sui Motori di Ricerca
Usabilità e User Experience Design: #3 Test e Performance sui Motori di RicercaFormazioneTurismo
 
Professioni Web - Digital Festival 2013
Professioni Web - Digital Festival 2013Professioni Web - Digital Festival 2013
Professioni Web - Digital Festival 2013Roberto Scano
 

Ähnlich wie Sviluppo Di Un Sito Web (20)

Agile Experience Design & Development - IAD 2012
Agile Experience Design & Development - IAD 2012Agile Experience Design & Development - IAD 2012
Agile Experience Design & Development - IAD 2012
 
Aziende Fornitori Web2.0
Aziende Fornitori Web2.0Aziende Fornitori Web2.0
Aziende Fornitori Web2.0
 
Online Customer Experience
Online Customer ExperienceOnline Customer Experience
Online Customer Experience
 
Come Nasce Un Sito Internet?
Come Nasce Un Sito Internet?Come Nasce Un Sito Internet?
Come Nasce Un Sito Internet?
 
6 Step per un Sito Funzionale: 2. Progetto del Website
6 Step per un Sito Funzionale: 2. Progetto del Website6 Step per un Sito Funzionale: 2. Progetto del Website
6 Step per un Sito Funzionale: 2. Progetto del Website
 
Guida autovalutazione-3-0
Guida autovalutazione-3-0Guida autovalutazione-3-0
Guida autovalutazione-3-0
 
DOCFLOW - integrazione Document Management e Business Process Management nel ...
DOCFLOW - integrazione Document Management e Business Process Management nel ...DOCFLOW - integrazione Document Management e Business Process Management nel ...
DOCFLOW - integrazione Document Management e Business Process Management nel ...
 
Web2.0 Enterprise2.0 Semantic Web
Web2.0 Enterprise2.0 Semantic WebWeb2.0 Enterprise2.0 Semantic Web
Web2.0 Enterprise2.0 Semantic Web
 
Tecnologie e Tecniche per affrontare il Mondo che Cambia
Tecnologie e Tecniche per affrontare il Mondo che CambiaTecnologie e Tecniche per affrontare il Mondo che Cambia
Tecnologie e Tecniche per affrontare il Mondo che Cambia
 
Laboratorio Web Oriented
Laboratorio Web Oriented Laboratorio Web Oriented
Laboratorio Web Oriented
 
Web Marketing, Recruiting e Employer Branding
Web Marketing, Recruiting e Employer BrandingWeb Marketing, Recruiting e Employer Branding
Web Marketing, Recruiting e Employer Branding
 
Project management: Gestire progetto web con Agilità (con DSDM, Agile Project...
Project management: Gestire progetto web con Agilità (con DSDM, Agile Project...Project management: Gestire progetto web con Agilità (con DSDM, Agile Project...
Project management: Gestire progetto web con Agilità (con DSDM, Agile Project...
 
Linee guida per i siti web delle PA - Uno spunto per tutti
Linee guida per i siti web delle PA - Uno spunto per tuttiLinee guida per i siti web delle PA - Uno spunto per tutti
Linee guida per i siti web delle PA - Uno spunto per tutti
 
... thinking about Microformats!
... thinking about Microformats!... thinking about Microformats!
... thinking about Microformats!
 
Web 2.0 (Internal presentation)
Web 2.0 (Internal presentation)Web 2.0 (Internal presentation)
Web 2.0 (Internal presentation)
 
N O T A D I L A V O R O
N O T A  D I  L A V O R ON O T A  D I  L A V O R O
N O T A D I L A V O R O
 
Web X Aziende Scettiche Prova
Web X Aziende Scettiche ProvaWeb X Aziende Scettiche Prova
Web X Aziende Scettiche Prova
 
Francesco Micali : Come Organizzare i Contenuti Per Un Sito Web Efficace - Me...
Francesco Micali : Come Organizzare i Contenuti Per Un Sito Web Efficace - Me...Francesco Micali : Come Organizzare i Contenuti Per Un Sito Web Efficace - Me...
Francesco Micali : Come Organizzare i Contenuti Per Un Sito Web Efficace - Me...
 
Usabilità e User Experience Design: #3 Test e Performance sui Motori di Ricerca
Usabilità e User Experience Design: #3 Test e Performance sui Motori di RicercaUsabilità e User Experience Design: #3 Test e Performance sui Motori di Ricerca
Usabilità e User Experience Design: #3 Test e Performance sui Motori di Ricerca
 
Professioni Web - Digital Festival 2013
Professioni Web - Digital Festival 2013Professioni Web - Digital Festival 2013
Professioni Web - Digital Festival 2013
 

Kürzlich hochgeladen

ScrapeGraphAI: a new way to scrape context with AI
ScrapeGraphAI: a new way to scrape context with AIScrapeGraphAI: a new way to scrape context with AI
ScrapeGraphAI: a new way to scrape context with AIinfogdgmi
 
Federico Bottino, Lead Venture Builder – “Riflessioni sull’Innovazione: La Cu...
Federico Bottino, Lead Venture Builder – “Riflessioni sull’Innovazione: La Cu...Federico Bottino, Lead Venture Builder – “Riflessioni sull’Innovazione: La Cu...
Federico Bottino, Lead Venture Builder – “Riflessioni sull’Innovazione: La Cu...Associazione Digital Days
 
Alessio Mazzotti, Aaron Brancotti; Writer, Screenwriter, Director, UX, Autore...
Alessio Mazzotti, Aaron Brancotti; Writer, Screenwriter, Director, UX, Autore...Alessio Mazzotti, Aaron Brancotti; Writer, Screenwriter, Director, UX, Autore...
Alessio Mazzotti, Aaron Brancotti; Writer, Screenwriter, Director, UX, Autore...Associazione Digital Days
 
Daniele Lunassi, CEO & Head of Design @Eye Studios – “Creare prodotti e servi...
Daniele Lunassi, CEO & Head of Design @Eye Studios – “Creare prodotti e servi...Daniele Lunassi, CEO & Head of Design @Eye Studios – “Creare prodotti e servi...
Daniele Lunassi, CEO & Head of Design @Eye Studios – “Creare prodotti e servi...Associazione Digital Days
 
Luigi Di Carlo, CEO & Founder @Evometrika srl – “Ruolo della computer vision ...
Luigi Di Carlo, CEO & Founder @Evometrika srl – “Ruolo della computer vision ...Luigi Di Carlo, CEO & Founder @Evometrika srl – “Ruolo della computer vision ...
Luigi Di Carlo, CEO & Founder @Evometrika srl – “Ruolo della computer vision ...Associazione Digital Days
 
Edoardo Di Pietro – “Virtual Influencer vs Umano: Rubiamo il lavoro all’AI”
Edoardo Di Pietro – “Virtual Influencer vs Umano: Rubiamo il lavoro all’AI”Edoardo Di Pietro – “Virtual Influencer vs Umano: Rubiamo il lavoro all’AI”
Edoardo Di Pietro – “Virtual Influencer vs Umano: Rubiamo il lavoro all’AI”Associazione Digital Days
 

Kürzlich hochgeladen (6)

ScrapeGraphAI: a new way to scrape context with AI
ScrapeGraphAI: a new way to scrape context with AIScrapeGraphAI: a new way to scrape context with AI
ScrapeGraphAI: a new way to scrape context with AI
 
Federico Bottino, Lead Venture Builder – “Riflessioni sull’Innovazione: La Cu...
Federico Bottino, Lead Venture Builder – “Riflessioni sull’Innovazione: La Cu...Federico Bottino, Lead Venture Builder – “Riflessioni sull’Innovazione: La Cu...
Federico Bottino, Lead Venture Builder – “Riflessioni sull’Innovazione: La Cu...
 
Alessio Mazzotti, Aaron Brancotti; Writer, Screenwriter, Director, UX, Autore...
Alessio Mazzotti, Aaron Brancotti; Writer, Screenwriter, Director, UX, Autore...Alessio Mazzotti, Aaron Brancotti; Writer, Screenwriter, Director, UX, Autore...
Alessio Mazzotti, Aaron Brancotti; Writer, Screenwriter, Director, UX, Autore...
 
Daniele Lunassi, CEO & Head of Design @Eye Studios – “Creare prodotti e servi...
Daniele Lunassi, CEO & Head of Design @Eye Studios – “Creare prodotti e servi...Daniele Lunassi, CEO & Head of Design @Eye Studios – “Creare prodotti e servi...
Daniele Lunassi, CEO & Head of Design @Eye Studios – “Creare prodotti e servi...
 
Luigi Di Carlo, CEO & Founder @Evometrika srl – “Ruolo della computer vision ...
Luigi Di Carlo, CEO & Founder @Evometrika srl – “Ruolo della computer vision ...Luigi Di Carlo, CEO & Founder @Evometrika srl – “Ruolo della computer vision ...
Luigi Di Carlo, CEO & Founder @Evometrika srl – “Ruolo della computer vision ...
 
Edoardo Di Pietro – “Virtual Influencer vs Umano: Rubiamo il lavoro all’AI”
Edoardo Di Pietro – “Virtual Influencer vs Umano: Rubiamo il lavoro all’AI”Edoardo Di Pietro – “Virtual Influencer vs Umano: Rubiamo il lavoro all’AI”
Edoardo Di Pietro – “Virtual Influencer vs Umano: Rubiamo il lavoro all’AI”
 

Sviluppo Di Un Sito Web

  • 1. Sviluppo di un sito web Sviluppo di un sito web Introduzione ad aspetti e problematiche da trattare nello sviluppo di un sito web. p p pp Cenni sulla qualità del prodotto. CL Gennaio 2008
  • 2. Un processo complesso La creazione di un sito web è un processo complesso che  coinvolge diverse competenze e professionalità. g p p Di seguito è presentato un modello procedurale che individua le  f i i i li i i i ò ddi id il fasi principali in cui si può suddividere il processo di creazione di  di i di un sito web e le relative figure professionali coinvolte CL Gennaio 2008
  • 3. Le varie fasi Per i nostri scopi sarà utile considerare nel seguito i task  dall’1 al 6, essendo i restanti due di natura prettamente tecnica e  d ll’ l d i i d di i ci soffermeremo in maniera particolare sui task 1 e 2.  CL Gennaio 2008
  • 4. Fase 1: Strategie e requisiti • Quali sono gli obiettivi da raggiungere con il sito? • Qual è il target di utenti? Q g • Quali contenuti voglio offrire? vincoli • Quali servizi voglio offrire? • Ci sono particolari vincoli e/o requisiti da soddisfare? •(Che tecnologie voglio utilizzare?) contenuti requisiti obiettivi target t t servizi ii tecnologie CL Gennaio 2008
  • 5. Fase 1: Strategie e requisiti  tre obiettivi principali  tre obiettivi principali Chi sono? A cosa servo? Identità “Ricordati di me” Perché proprio io e non Differenziazione altri? Obiettivi Fidelizzazione “Torna da me” Torna da me … CL Gennaio 2008
  • 6. Fase 2: Web Design Intro In questa fase si definiscono: • L’organizzazione dei contenuti/servizi del sito ’ d / d l • La struttura di navigazione La struttura di navigazione • La “gabbia visiva” (o layout) delle varie pagine g ( y ) p g CL Gennaio 2008
  • 7. Fase 2: Web Design Organizzazione dei contenuti/servizi g / L’organizzazione dei contenuti è alla base dei sistemi di navigazione:  i portali si navigano in base al sistema organizzativo scelto inizialmente. i portali si navigano in base al sistema organizzativo scelto inizialmente L’Architettura dell’Informazione si occupa  di progettare la struttura semantica di  p un sito decidendo dove e come posizionare contenuti e servizi, definendone così  l’architettura informativa ovvero il modo in cui le informazioni vengono organizzate  all’interno del sito. Attualmente sul web vengono usati tre schemi di organizzazione: 1. Gerarchico 2. A faccette 3. Cronologico 3 C l i Il Cronologico è riferito ad un particolare tipo di sito, il blog, e nel seguito verrà  tralasciato. tralasciato CL Gennaio 2008
  • 8. Fase 2: Web Design Organizzazione dei contenuti/servizi: Schema Gerarchico g / La struttura gerarchica (o ad albero) si basa su un sistema che si dipana dalla home  in macroaree che si dividono a loro volta in aree e sottoaree fino ad arrivare alle  in macroaree che si dividono a loro volta in aree e sottoaree fino ad arrivare alle singole pagine. •Semplice da gestire •Lineare da ideare Lineare da ideare •Navigazione più tradizionale Utente più  sicuro •Struttura rigida •Rischio di “seppellire” informazione •Se il sito è ampio molti click per raggiungere  informazione Compromesso tra ampiezza e profondità dell’albero: p p p •Più categorie Minore Profondità  (meno click per raggiungere contenuti,  ma rischio di indecisione dell’utente, quale categoria scegliere?) •Meno categorie Maggiore Profondità (Facile scegliere una categoria,  maggiore flessibilità, ma tanti click per raggiungere le pagine) CL Gennaio 2008
  • 9. Fase 2: Web Design Organizzazione dei contenuti/servizi: Schema A Faccette g / Lo schema a faccette è aperto e multidimensionale. Ogni contenuto/servizio viene  classificato in base a diversi attributi e non categorizzato in una ed una sola  classificato in base a diversi attributi e non categorizzato in una ed una sola categoria. La struttura generata è una “foresta” (e non un albero). • Enfasi sull’utente •Maggiore reperibilità dei contenuti •Maggiore flessibilità nell’aggiunta di contenuti  nuovi •Sistema “aperto” •Ancora poco diffusa l’utente non è abituato p •Maggiore complessità nella gestione •E’ difficile pensare in più dimensioni progettazione  più attenta ed accurata  maggior tempo di sviluppo CL Gennaio 2008
  • 10. Fase 2: Web Design Struttura di navigazione g Per struttura di navigazione si intende l’insieme di barre, pulsanti e menù che  consentono all’utente di muoversi in maniera agevole all’interno del sito web. L’obiettivo è creare una buona struttura e fornire agli utenti un aiuto per muoversi  senza che essi debbano pensare troppo (“Don’t make me think”) Occorre rispondere alle seguenti domande dell’utente: 1) dove mi trovo? dove mi trovo? 2) dove sono stato? 3) dove posso andare? Occorre cioè fornire un CONTESTO ed un PERCORSO per l’utente. CL Gennaio 2008
  • 11. Fase 2: Web Design Struttura di navigazione g Occorre individuare il tipo ed il numero di menù che si vogliono utilizzare: Menù principale M ù i i l Menù contestuale Menù in intestazione e/o a piè di pagina Successivamente occorre decidere quando e dove ripetere ciascun menù (ad esempio,  Successivamente occorre decidere quando e dove ripetere ciascun menù (ad esempio il menù principale và ripetuto in ogni pagina?) CL Gennaio 2008
  • 12. Fase 2: Web Design Layout y Il layout stabilisce la posizione di contenuti, servizi, pulsanti, menù e barre di  y p , ,p , navigazione all’interno della pagina web. CL Gennaio 2008
  • 13. Fasi 3,4,5,6 Visual Design: si stabilisce la grafica del sito in termini di logo, immagini, carattere,  colori, bordo pagina, bordo sezione e così via... Sviluppo del software: il portale viene realizzato ex novo o assemblando componenti  Sviluppo del software: il portale viene realizzato ex novo o assemblando componenti già disponibili sul mercato, utilizzando le tecnologie che più rispondono ad obiettivi e  scelte progettuali. Gestione dei contenuti: vengono redatti i contenuti utilizzando stile e linguaggio  Gestione dei contenuti: vengono redatti i contenuti utilizzando stile e linguaggio adeguato al target scelto. Nella redazione dei contenuti si considera sempre che  “leggere sullo schermo non è leggere su carta”. Si pone quindi attenzione a lunghezza  dei documenti,densità di parole, supporto di immagini. Per pubbliche  dei documenti densità di parole supporto di immagini Per pubbliche amministrazioni si adotta “plain language” ovvero linguaggio semplice, facilmente  comprensibile dall’utente finale (come richiesto dal CNIPA) g p gg Esercizio del sito: il sito è a regime. Il webmaster si occupa di aggiornare contenuti,  , fare il backup di contenuti, gestire eventuali ampliamenti di sezione e così via… CL Gennaio 2008
  • 14. Supporti metodologici •Mappe mentali •Tabelle •Flow chart •Brain storming: i sei cappelli colorati rain storming: i sei cappelli colorati Bianco  Fatti e dati oggettivi. Raccolta informazioni. Niente giudizi.     Rosso Emotività. Esprimere di  getto le proprie intuizioni e suggerimenti Emotività. Esprimere di getto le proprie intuizioni e suggerimenti Verde creatività e produzione di nuove idee, analisi di proposte  migliorative e di visioni insolite g Giallo è il cappello dell'ottimismo e dei pensieri positivi Nero Aspetti negativi del progetto Blu impiegato per il controllo e l'organizzazione del processo di pensiero.  Stabilisce priorità, metodi, sequenze funzionali. Pianifica, organizza,  stabilisce le regole del gioco. CL Gennaio 2008
  • 15. Tempo per… Dubbi /domande ? Dubbi /domande ? Idee / proposte? Idee / proposte? CL Gennaio 2008
  • 16. Qualità di un sito web Q lità di it b CL Gennaio 2008
  • 17. La qualità: cos’è? Qualità l’insieme delle caratteristiche che determinano la rispondenza  di un prodotto alla funzione per la quale è utilizzato (Dizionario De Mauro‐Paravia) La qualità dunque si valuta in base al contesto (utilizzo/utilizzatore), si esprime attraverso delle caratteristiche e si  quantifica attraverso delle misure quantifica attraverso delle misure. Esempio: Se fossi un pilota la qualità di un automobile sarebbe... Se fossi un collezionista la qualità di un automobile sarebbe... Se fossi un esperto di motori la qualità di un automobile sarebbe... Se fossi un esperto di motori la qualità di un automobile sarebbe... Se fossi padre di cinque figli la qualità di un automobile sarebbe... Carlo Lombardi Gennaio 2008
  • 18. Qualità & Siti web: enfasi sull’utente Siamo interessati a valutare la qualità di un sito web dal punto di vista dell’utente  (è questo il nostro contesto!). (è t il t t t !) La nostra definizione di qualità si baserà dunque solo su aspetti  esterni e/o funzionali del sito web e legati all’ “uso” del sito  (e non su aspetti tecnici ed implementativi).  Parleremo di  Qualità nell uso o Usabilità Parleremo di “Qualità nell’uso” o “Usabilità” CL Gennaio 2008
  • 19. L’usabilità – ISO/IEC 9126‐1 Qualità nell’uso: li à ll’ la capacità di un prodotto software di la capacità di un prodotto software di aiutare determinati utenti a raggiungere determinati obiettivi con  efficacia  efficienza sicurezza i soddisfazione in determinati contesti d uso  in determinati contesti d’uso (Norma ISO/IEC 9126‐1) CL Gennaio 2008
  • 22. Sottocaratteristiche del modello Su formato cartaceo… CL Gennaio 2008
  • 23. Approfondimenti e riferimenti bibliografici ISO/IEC 9126: Information Technology – Software Product Evaluation – Quality Characteristics and Guidelines for their Use. 1991 e 2000. and Guidelines for their Use 1991 e 2000 ISO 9241: Requisiti ergonomici per il lavoro di ufficio con terminali video. Polillo R.: Il check‐up dei siti web – valutare la qualità per migliorarla. Apogeo, Milano, 2004. Architettura dell’informazione per il World Wide Web. Hops Libri, Milano, 2002. Pressman.Principi di Ingegneria del Software. McGrawHill,2004 www.cnipa.it – Sito del Comitato Per l’Informatica nella P.A. http://webdesign.html.it – Portale dedicato allo sviluppo web www.trovabile.it – Organizzare l’informazione per renderla (ri)trovabile www.mondodigitale.net – Rassegna critica del settore ICT www.mestierediscrivere.com ‐ Portale sulla produzione di contenuti scritti CL Gennaio 2008
  • 24. Tempo per… Dubbi /domande ? Dubbi /domande ? Idee / proposte? Idee / proposte? CL Gennaio 2008