PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET...
Transcript of PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET...
![Page 1: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/1.jpg)
PROGETTAZIONE DI UN SITO WEB
![Page 2: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/2.jpg)
PROGETTAZIONE DI UN SITO WEB
Fasi di progettazione Software:
● Analisi dei Requisiti
● Progettazione (Design)
● Sviluppo
● Test
● Manutenzione
Analisi dei requisiti
Progettazione (design)
Sviluppo
Test e Manutenzione
![Page 3: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/3.jpg)
Progettazione di un sito web - Risorse
Attività di tipo gestionale
● Stime dei costi (e dei tempi)
● Gestione dei progetti (delle persone, pianificazione)
● Gestione dei rischi
● Gestione della qualità
![Page 4: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/4.jpg)
Progettazione di un sito web - Risorse
Documento tipo
Stima dei tempi
![Page 5: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/5.jpg)
Progettazione di un sito web - Timeline
A cascata
Interattivo
A componenti
Evoluzione
![Page 6: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/6.jpg)
Progettazione di un sito web - Qualità
Un sito web deve, come tutti i software, garantire i seguenti criteri di qualità:
● Correttezza
● Affidabilità
● Robustezza
● Efficienza
● Usabilità
● Integrità
Li vedremo meglio successivamente....
![Page 7: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/7.jpg)
PROGETTAZIONE DI UN SITO WEB
Fasi di progettazione Software:
● Analisi dei Requisiti
● Progettazione (Design)
● Sviluppo
● Test
● Manutenzione
Analisi dei requisiti
Progettazione (design)
Sviluppo
Test e Manutenzione
![Page 8: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/8.jpg)
Analisi dei Requisiti
● Cosa vuole il cliente?
(più risulta dettagliata meglio è)
● Terminata l’analisi dei requisiti,
raccolgo tutte le informazioni in documenti (solitamente elettronici, ma anche no)
(si eviterà di perdere dettagli importanti durante lo svolgimento delle fasi successive)
Fase fondamentale!! Raccogliere quante più informazioni possibili
![Page 9: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/9.jpg)
Analisi dei RequisitiDA EVITARE
Analisi dei requisiti
Progettazione (design)
Sviluppo
Test e Manutenzione
Sviluppo Software
DA EVITARE
Partitella
Progetto la mia squadra
Chiamo Amici
Partita
Partita Calcetto
Era calciotto
![Page 10: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/10.jpg)
Progettazione (Design)
● Dopo aver risposto alla domanda “cosa deve/devo fare?”
● Ora devo rispondere alla domanda “come posso fare?”
Più a livello informatico, si può trasformare in:
Che tecnologie posso usare?
DATABASE
CMS
PHP
JAVASCRIPT
CSS3
ASP.NET
HTML5
![Page 11: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/11.jpg)
Progettazione (Design)
DATABASE
CMS
PHP
JAVASCRIPT
CSS3
ASP.NETHTML5
DATABASE PHP CSS3
SCELTA
![Page 12: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/12.jpg)
Progettazione (Design) - Database
DIAGRAMMA E-R
CONTATTO RELAZIONE NUMERO
ID NOME
1 Mario
2 Paolo
3 Luca
4 Marco
ID NUMERO
1 328-123-1234
2 328-123-4567
3 329-321-7654
4 347-987-6589
5 347-555-6544
id_contatti id_numeri
1 3
2 2
1 4
4 1
1 5
CONTATTO NUMERO
(0,n)
DATABASE - Rubrica online
Posso migliorare..... è davvero necessaria la relazione?
(1,1)
CARDINALITA'
![Page 13: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/13.jpg)
Progettazione (Design) - Database
ID NOME
1 Mario
2 Paolo
3 Luca
4 Marco
id_contatti ID NUMERO
4 1 328-123-1234
2 2 328-123-4567
1 3 329-321-7654
1 4 347-987-6589
1 5 347-555-6544
CONTATTI NUMERI
Rubrica telefonino
Ho risparmiato una tabella non necessaria
Ora posso eseguire Query di ogni genere sulle tabelle
RISPARMIO DI RISORSE
![Page 14: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/14.jpg)
Progettazione (Design) - Interfaccia
Pensata in base alle esigenze del cliente
COMMERCIALE
BLOG
SERVIZI WEB
PORTALE
CLOUD
TARGET
PUBBLICITARIO
Donne Sportivi
Giovani Uomini d'affari
![Page 15: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/15.jpg)
Progettazione (Design) - Interfaccia
ibu GastroPub
![Page 16: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/16.jpg)
Progettazione (Design) - Interfaccia
Team Antonucci Corse
![Page 17: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/17.jpg)
Progettazione (Design) - Interfaccia
Web Application – Comune L'Aquila
![Page 18: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/18.jpg)
Progettazione (Design) - Interfaccia
![Page 19: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/19.jpg)
Progettazione di un sito web - Qualità
Dopo aver visto le prime due fasi del processo di creazione di un sito web rivediamo i criteri di qualità:
● Correttezza, in quale misura rispetta i suoi requisiti
● Affidabilità, quanto bene rispondono ai suoi requisiti
● Robustezza, come si comporta il sistema in caso di errori
● Efficienza, tempi di risposta, uso della memoria
● Usabilità, è user-friendly?
● Integrità, sicurezza in caso di attacchi
![Page 20: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/20.jpg)
Sviluppo
● Si parla dello sviluppo del sito vero e proprio
● Parte quando tutte le precedenti fasi sono state ben definite
DATABASE PAGINE WEB LAYOUT
- Sql- Query - Insert - Select - Delete - Join
- HTML5- Javascript- AJAX- phpecc...
CSSHTML5Javascript
![Page 21: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/21.jpg)
Integrazione e Testing
Se sviluppato in moduli si integra il tutto
Testing
Presenta errori?
Si
oN
Posso consegnare Correggo gli errori
Integrazione
![Page 22: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/22.jpg)
Progettazione di un sito web - Timeline
A cascata
Interattivo
A componenti
Evoluzione
![Page 23: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/23.jpg)
Progettazione di un sito web - Timeline
A cascata
Tempi delle varie fasi sono ben equilibrati
![Page 24: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/24.jpg)
Progettazione di un sito web - Timeline
A cascata
Ciclico, fino a che la valutazione del prodotto diviene soddisfacente rispetto ai requisiti richiesti
In risposta al modello a cascata che risulta troppo lineare
![Page 25: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/25.jpg)
Progettazione di un sito web - Timeline
A componenti
Dopo una valutazione molto attenta e precisa dei requisiti si procede allo sviluppo separato di componenti
L'integrazione è fondamentale
![Page 26: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/26.jpg)
CMS – Content Management System
● Cos'è?
Fondamentalmente è un sistema di gestione dei contenuti
![Page 27: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/27.jpg)
CMS – Fasi della progettazione
Analisi dei requisiti
Progettazione (design)
Sviluppo
Test e Manutenzione
Come cambia la progettazione
quando usiamo un CMS?
![Page 28: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/28.jpg)
CMS – Fasi della progettazione
Analisi dei requisiti
Progettazione (design)
Sviluppo
Test e Manutenzione
La fase di progettazione viene a mancare in maniera consistente
![Page 29: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/29.jpg)
CMS – Fasi della progettazione
● Posso ignorare le problematiche legate a:
- Database
- Layout
- Sicurezza
- Scrittura del codice sorgente
(se non per modalità più avanzate)
Da vantaggi significativi nella creazione di siti web con grandi quantità di contenuti
![Page 30: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/30.jpg)
CMS – Fasi della progettazione
● I CMS non sono solo per piccoli blog
![Page 31: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/31.jpg)
CMS – Struttura
● Come sono strutturati i CMS?
CORE
TEMPLATE MODULI
Espansioni delle funzionalità
Modifica l'interfaccia
Funzionalità base di un CMS
![Page 32: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/32.jpg)
CMS – Struttura
CORE TEMPLATE
MODULI
Gestione Articoli/Notizie
Categorizzazione
Sicurezza
Layout
Colori
Miglioramenti di quelle esistenti
Nuove funzionalità
Gestione Utente
![Page 33: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/33.jpg)
CMS – Qualità
Il CMS garantisce alcuni requisiti di qualità
● Correttezza
● Affidabilità
● Robustezza
● Efficienza
● Usabilità
● IntegritàDipendono dall'utente
Garantiti dal CMS
- Pessima categorizzazione dei dati- Scrittura di dati errati
![Page 34: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/34.jpg)
Sito Web Tradizionale VS CMS
Analisi dei requisiti
Progettazione (design)
Sviluppo
Test e Manutenzione
Analisi dei requisiti
Sviluppo
Test e Manutenzione
Risparmio di tempo
Website CMS
![Page 35: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/35.jpg)
Sito Web Tradizionale VS CMS
Il CMS è quindi uno strumento potente che riduce i tempi di realizzazione di un sito web
ma bisogna pagare un prezzo...
● La Versatilità
- Non tutto può essere fatto da un CMS
- E' generalmente pesante
- Non tutti i requisiti potrebbero essere soddisfatti
- Si adattano poco a servizi e applicazioni web
![Page 36: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/36.jpg)
Sito Web Tradizionale VS CMS
● Un sito web tradizionale (html, php, css) è quindi più versatile ma ha bisogno di più lavoro
in particolare sulla:
- gestione della sicurezza
- gestione utenti
- definizione dei ruoli
- gestione contenuti
Automatizzate nel CMS
![Page 37: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/37.jpg)
Sito Web Tradizionale VS CMS
Differenza Evidente
NOTA BENE
80 28
FATTIBILITA'
![Page 38: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/38.jpg)
Quale usare?
Dipende dai requisiti
Finita la prima fase di ANALISI DEI REQUISITI posso decidere quale delle due procedure è più conveniente.
![Page 39: PROGETTAZIONE DI UN SITO WEBteachnet.altervista.org/Scuola/Guide/Progettare/progweb.pdf · ASP.NET HTML5 Progettazione ... Efficienza, tempi di risposta, uso della memoria ... - gestione](https://reader036.fdocumenti.com/reader036/viewer/2022071023/5fd776cf9f2d5548da0fcd10/html5/thumbnails/39.jpg)
FINE
GRAZIE PER L'ATTENZIONE