COME PROGETTARE UN SITO INTERNET - … · Cos’è un Sito Web Siti Web Statici e Dinamici, Blog,...
Transcript of COME PROGETTARE UN SITO INTERNET - … · Cos’è un Sito Web Siti Web Statici e Dinamici, Blog,...
Cos’è un Sito Web
Siti Web Statici e Dinamici, Blog, E-Commerce, Web Application
Desktop, Mobile, Responsive e Nuove Tipologie di Navigazione
Usabilità, User Experience, Engagement, Conversioni
Architettura e Progettazione Grafica
Strumenti per realizzare e gestire siti web - CMS
CMS proprietari e CMS Opensource
JoomlaWordpress Magento
Drupal, Prestashop, Opencart e CMS minori
Monitoraggio ed Allineamento alle Attitudini degli Utenti
Dominio, Estensione, Host, DB
COS’É UN SITO WEB
993000 risultati
2 fra i primi 5 hanno suscitato subito interesse, fornendo immediatamente un piccolo estratto di definizione
3 dei primi 5 hanno mostrato informazioni incomplete o errate
Le fonti reperite online non sempre sono attendibili.
COS’É UN SITO WEB
Un sito è uno spazio nel web in cui un'azienda, un privato o chiper essi esprimono delle idee, propongono un qualcosa osemplicemente condividono dei pensieri.Fisicamente un sito è uno spazio in un pc, che chiamiamo servere che viene associato ad un indirizzo.
Amdweb
Sito internet è uno di quei concetti che diamo per scontato, ma non sappiamo mai bene di preciso cosa significhi
COS’É UN SITO WEB
Un sito web o sito Internet (anche abbreviato in sito se chiaro il contesto informatico) è un insieme di pagine web correlate,
ovvero una struttura ipertestuale di documenti che risiede su un server web.
Wikipedia
Collegamento ipertestuale
In informatica, un collegamento ipertestuale (in inglese hyperlink, spesso abbreviato in link, usato anche in italiano) è un rinvio da
un'unità informativa su supporto digitale ad un'altra. È ciò che caratterizza la non linearità dell'informazione propria di un
ipertesto.
COS’É UN SITO WEB
Sito Luogo, Località
WebIl World Wide Web (in inglese letteralmente: "ragnatela mondiale"), abbreviato Web, sigla
WWW, è uno dei principali servizi di Internet che permette di navigare e usufruire di un insieme
vastissimo di contenuti (multimediali e non) collegati tra loro attraverso legami (link), e di
ulteriori servizi accessibili a tutti o ad una parte selezionata degli utenti di Internet.
Contenuti Insieme di informazioni sull’argomento, oggetto di trattazione o di discussione
COS’É UN SITO WEB
Sito
Luogo sul web
Web
Insieme di infrastrutture e collegamenti di internet
Mezzi di trasporto
Indirizzi
Posizioni del territorio virtuale
Browser
Internet
Territorio Virtuale
COS’É UN SITO WEB
Tipologia
Piccola impresa
Titolo
Azienda Agricola Stefania Mezzetti
Indirizzo
http://www.vinimezzetti.it/
Tipo di attività
Produzione agrolimentare
COS’É UN SITO WEB
Tipologia
Grande Impresa
Titolo
Asos
Indirizzo
http://asos.com/
Commercio abbigliamento
Tipo di attività
Tipologia
Media impresa
Titolo
Marini Home Design
Indirizzo
http://www.mobilimarini.it/
Rivenditore Arredamento
Tipo di attività
COS’É UN SITO WEB
Multinazionale
Titolo
Volkswagen
Indirizzo
http://it.volkswagen.com/
Produzione Automobili
Tipo di attività
Tipologia
Rivista
Titolo
Teatro Naturale
Indirizzo
http://www.teatronaturale.it/
Informazione Agroalimentare
Tipo di attività
Tipologia
COS’É UN SITO WEB
Centro Commerciale Virtuale
Titolo
Ebay
Indirizzo
http://www.ebay.com/
Servizi di compravendita fra utenti
Tipo di attività
Tipologia
Multinazionale
Titolo
Indirizzo
http://www.facebook.com/
Servizi di connessione fra utenti
Tipo di attività
Tipologia
COS’É UN SITO WEB
Un sito web o sito Internet è uno spazio nel web (ospitato fisicamente su di un server), accessibile tramite un browser e raggiungibile tramite un indirizzo, in cui un'azienda, un privato o chi per essi ha la possibilità di organizzare e mettere a disposizione del contenuto, e quindi dell'informazione sull'argomento o sull'oggetto di trattazione del sito stesso.
Siti Web come raccoglitori di informazioni
L'insieme di informazioni contenute su un sito web viene solitamente organizzato in pagine correlate, collegate attraverso
appositi link ipertestuali.
SITI WEB STATICI E DINAMICI, BLOG, E-COMMERCE, WEB APPLICATION
Sito web è quindi un termine incredibilemente generico, all’interno del
quale si possono distinguere categorie di prodotti diversi, basati su
tecnologie differenti e finalizzati a servizi di diversa natura.
Sito Web Statico
Sito Web Dinamico
Blog
E-commerce
Web Application
Sito Vetrina
Portali
Community
Motori di ricerca
Forum
Social Newtork
Altro
Tipologia
Piccola impresa
Titolo
Azienda Agricola Stefania Mezzetti
Indirizzo
http://www.vinimezzetti.it/
Tipo di Sito
Statico
SITI WEB STATICI E DINAMICI, BLOG, E-COMMERCE, WEB APPLICATION
Sito Web Statico
Tipologia di sito web che permette ad un utente generico di visualizzare i contenuti senza però poter interagire con essi. Solitamente scritto in html puro e non collegato ad un database, non permette quindi al generico amministratore di modificarne le informazioni.
Tipo di attività
Produzione agrolimentare
Tipologia
Media impresa
Titolo
Marini Home Design
Indirizzo
http://www.mobilimarini.it/
Rivenditore Arredamento
Tipo di attività
Tipo di Sito
Dinamico
SITI WEB STATICI E DINAMICI, BLOG, E-COMMERCE, WEB APPLICATION
Sito Web Dinamico
Il termine web dinamico viene utilizzato per indicare tutte quei sistemi Web che interagiscono attivamente con l'utente modificando le informazioni mostrate in base a quelle ricevute dall'utente stesso e che consentono anche un più rapido aggiornamento del sito web da parte dell'amministratore.Questa tipologia di siti è solitamente collegata ad un database utilizzato per memorizzare i contenuti.
SITI WEB STATICI E DINAMICI, BLOG, E-COMMERCE, WEB APPLICATION
Tipologia
Grande Impresa
Titolo
Asos
Indirizzo
http://asos.com/
Tipo di attività
Commercio abbigliamento
Tipo di Sito
Ecommerce
E-commerce
L’E-commerce consiste nello svolgimento di attività commerciali e di transazioni per via elettronica e comprende attività diverse quali: la commercializzazione di beni e servizi per via elettronica, la distribuzione on-line di contenuti digitali, l’effettuazione per via elettronica di operazioni finanziarie. Una piattaforma e-commmerce è quindi un sito web dinamico che permetta di effettuare tali operazioni
SITI WEB STATICI E DINAMICI, BLOG, E-COMMERCE, WEB APPLICATION
Tipologia
Rivista
Titolo
Teatro Naturale
Indirizzo
http://www.teatronaturale.it/
Tipo di attività
Informazione Agroalimentare
Tipo di Sito
Blog
Blog
Nel gergo di Internet, un blog è un particolare tipo di sito web in cui i contenuti vengono visualizzati in forma cronologica, ordinati in categorie e correlati per tag. In genere un blog è gestito da uno o più blogger che pubblicano, più o meno periodicamente, contenuti multimediali e/o testuali, in forma di post, concetto assimilabile o avvicinabile ad un articolo di giornale.
Anche Il blog può essere considerato un sito web dinamico.
SITI WEB STATICI E DINAMICI, BLOG, E-COMMERCE, WEB APPLICATION
Tipologia
Multinazionale
Titolo
Volkswagen
Indirizzo
http://it.volkswagen.com/
Tipo di attività
Produzione Automobili
Tipo di Sito
Web Application / Portale
Web Application
L’espressione Web Application indica un'applicazione accessibile/fruibile via web per mezzo di un network, come ad esempio una Intranet all'interno di un sistema informatico o attraverso la Rete Internet, ovvero in una architettura tipica di tipo client-server, che offre determinati servizi all'utente client.
Portale
Un portale web, o portale internet (informalmente anche portale) è un sito web che costituisce un punto di partenza, una porta di ingresso, ad un gruppo consistente di risorse in internet o di una intranet.
SITI WEB STATICI E DINAMICI, BLOG, E-COMMERCE, WEB APPLICATION
Tipologia
Multinazionale
Titolo
Indirizzo
http://www.facebook.com/
Tipo di attività
Servizi di connessione fra utenti
Tipo di Sito
Web Application / Social Newtork
Social Network
Si intende con Social Network quel tipo di struttura informatica basata sul paradigma di Web Application, che permetta di creare una rete sociale di virtuale, ovvero che semplifichi il processo di nascita e mantenimento dei lagami fra utenti. Il concetto di Social Network è strettamente legato a quello di profilo personale, lista di contatti, collegamenti e fruizione dell’informazione dai contatti collegati.
SITI WEB STATICI E DINAMICI, BLOG, E-COMMERCE, WEB APPLICATION
Tipologia
Centro Commerciale Virtuale
Titolo
Ebay
Indirizzo
http://www.ebay.com/
Tipo di attività
Servizi di compravendita fra utenti
Tipo di Sito
Web Application / Ecommerce
Sistema informatico inteso a sostenere comunità omogenee attraverso il supporto, l'aumento e l'implementazione delle reti sociali già esistenti.
Forum
Insieme delle sezioni di discussione in una piattaforma informatica, o una singola sezione, oppure lo stesso software utilizzato per fornire questa struttura.
Motori di ricerca
Un motore di ricerca è un sistema automatico che analizza un insieme di dati e restituisce un indice dei contenuti disponibili classificandoli in modo automatico in base a formule statistico-matematiche che ne indichino il grado di rilevanza data una determinata chiave di ricerca.
Community
USABILITÀ, USER EXPERIENCE, ENGAGEMENT, CONVERSIONI
Il termine generico Sito Web risponde quindi ad un’ampia e contorta
possibilità di classificazione. Nonostante ciò è possibile individuare
una serie di caratteristiche comuni ad un po’ tutti i siti che navighiamo.
Alcune di queste caratteristiche sono nel tempo diventate convezioni e
vanno a definire quelli che sono i canoni di usabilità di un sito web.
L’usabilità viene definita come "la capacità di un sistema di essere compreso, appreso e utilizzato dagli utenti quando usato sotto condizioni specificate"
Usabilità
Accessibilità
Utilità
Semplicità
Funzionalità
Alcune convenzioni consolidate ci permettono di
avvicinarci in maniera semplice ai canoni di usabilità.
Vediamo ad esempio le pagine più comuni a un po’ tutti
i siti web.
USABILITÀ, USER EXPERIENCE, ENGAGEMENT, CONVERSIONI
Home
Sempre presente, rappresenta la pagina principale di presentazione del sito, dei suoi contenuti, e delle pagine web secondarie tramite essa raggiungibili. Se consideriamo il sito come una brochure aziendale, la home può essere paragonata alla copertina.
Pagina di “atterraggio”, appositamente sviluppata per trattare argomenti specifici ed attrarre tanto i motori di ricerca quanto gli utenti, eventualmente veicolandoli verso aree del sito di particolare interesse.
Landing
Contatti
Pagina quasi sempre presente, spesso inserita fra le ultime voci dell’indice o del menù, è utilizzata per fornire al navigatore informazioni utili a contattare l’azienda, spesso provvista di apposito form contatti automatizzato e
mappa navigabile
Pagine
USABILITÀ, USER EXPERIENCE, ENGAGEMENT, CONVERSIONI
Pagine Istituzionali
Pagine come ad esempio “Chi Siamo” o “L’ Azienda” sono quasi sempre incluse nei siti web, eventualmente popolate con contenuti testuali e multimediali, vengono utilizzate per presentare l’argomento del sito stesso al navigatore.
Pagine Archivio
Sono pagine archivio quel tipo di pagine utilizzate per raccogliere piccole introduzioni di più sottopagine sullo stesso argomento, che rendano possibile all’utente lo spostarsi con facilità fra le varie sottopagine (spesso chiamate Articoli,
Entry o Post).Questo tipo di pagine di solito viene assimilato alle pagine di Categoria, Tag o Tipo di Dati. Anche la pagina di ricerca può
essere assimilata ad una pagina archivio. Ne sono esempio quelle sezioni che spesso prendono il nome di “Prodotti”, “Servizi”, “Porfolio” ecc...
Pagine Articolo
Rappresentano le sottopagine di una pagina archivio e contengono una descrizione dettagliata dell’argomento in questione. Nella maggiorparte dei casi in queste pagine è possibile trovare anche riferimenti ad articoli collegati o correlati.
Pagina presente su piattaforme Web E-commerce. Viene utilizzata per completare il processo di acquisto dei prodotti selezionati dall’utente.
Checkout
Carrello
Pagina presente su piattaforme Web E-commerce. E’ utilizzata come area di raccolta dei prodotti selezionati dall’utente.
Anche la struttura delle varie pagine segue delle convenzioni oramai consolidate, adeguate al senso di lettura occidentale (da sinistra verso destra). Tali consuetudini prevedono che alcune aree del layout restino inalterate mentre altre vengano adeguate alla specifica pagina del sito sulla quale il navigatore si trova.
Layout
USABILITÀ, USER EXPERIENCE, ENGAGEMENT, CONVERSIONI
Header o Testata
USABILITÀ, USER EXPERIENCE, ENGAGEMENT, CONVERSIONI
Elementi in evidenza(Spesso presente solo in home)
Sidebar (o barra laterale) destra e/o Sinistra (Spesso presenti solo nelle pagine interne)
Contenuto
Elementi in coda
Footer o Piè di Pagina
Header
Rappresenta grosso modo il preambolo del sito web, come anche il primo elemento che si presenta all’utente e che deve permettergli di muoversi agilmente attraverso le varie sezioni del sito. L’header solitamente rimane invariato su tutte le pagine; sia in termini contenutistici che di posizionamento. Fra gli altri, comprende di solito i seguenti elementi:
● Logo● Menù principale● Icone Social● Barra di ricerca● Eventuale Pay Off
Sempre per le convenzioni di lettura occidentale citate sopra, solitamente si usa inserire il Logo all’estrema sinistra o tuttalpiù al centro; le icone social e la barra di ricerca all’estrema destra, menù in evidenza, ed eventuale payoff direttamente a destra o sotto il logo.
USABILITÀ, USER EXPERIENCE, ENGAGEMENT, CONVERSIONI
Logo
Cerca nel sito
Link Social
Menù principale
Contenuti in evidenza
Spesso presenti solo in home, e consistenti in una singola immagine, uno slideshow o un video; vengono utilizzati per mostrare da subito i contenuti e le aree del sito che potrebbero interessare l’utente.
USABILITÀ, USER EXPERIENCE, ENGAGEMENT, CONVERSIONI
Sidebar
Spesso presenti solo nelle pagine interne, ed eventualmente variabili da pagina a pagina. Lo spazio delle sidebar è usualmente dedicato ad ospitare contenuti collegati, correlati o comunque inerenti alla pagina o alla sezione su cui l’utente si trova. Rappresentano uno spazio utilizzabile per veicolare l’utente verso una direzione suggerita piuttosto che una scelta.
Contenuto
L’area di contenuto rappresenta la parte più importante di un sito web, ed è quella che viene utilizzata per rendere disponibile all’utente le informazioni vere e proprie della pagina in cui si trova.
USABILITÀ, USER EXPERIENCE, ENGAGEMENT, CONVERSIONI
Elementi in coda
Diffuso tanto sulle varie pagine del sito quanto in home page, questo spazio viene nella maggior parte dei casi utilizzato per offrire all’utente contenuti ed aree del sito che potrebbero interessargli a prescindere dalla pagina che sta navigando.
Footer
L’area del footer non è meno importante di quella dell’header e rimane solitamente invariata in ogni pagina del sito. Si tratta della parte convlusiva delle varie pagine ed ha senso utilizzarla tanto per permettere all’utente di non dover tornarein testa del sito (proponendogli quindi una serie di link che gli permettano di navigare ulteriormente) e di poter contattare
facilmente il proprietario nel caso in cui ne fosse sua intenzione.Fra gli altri, comprende di solito i seguenti elementi:
● Logo● Menù principale● Icone Social ● Contatti e Riferimenti● Partita IVA (obbligo legale)● Credits
Naturalmente, il logo spesso e volentieri viene posizionato a sinistra e i credits a destra.
USABILITÀ, USER EXPERIENCE, ENGAGEMENT, CONVERSIONI
User Experience
Con tutte queste similitudini fra vari tipi di siti webper potersi presentare al meglio e riuscire ad esserecompetitivi, oltre ad essere usabile ed averecontenuti di qualità un sito deve riuscire a garantireall’utente una buona controparte estetica, cherispecchi l’immagine dell’azienda, come anche acoinvolgerlo attraverso un’esperienza pulita eaccattivante.
Oltre ciò, ha sicuramente senso realizzare o pensare di realizzare un sito websoltanto se si hanno in mente degli obiettivi prestabiliti.Engagement e Conversioni in questo caso divengono prioritari.Se poi si tratta del sito web di una pmi, probabilmente gli obiettivi potrebberoessere vendere prodotti o servizi, espandere la clientela, aprirsi a nuovimercati, fidelizzare il cliente ecc..
USABILITÀ, USER EXPERIENCE, ENGAGEMENT, CONVERSIONI
EngagementObiettivi come quelli appena nominati potrebberoessere raggiunti tramite il tenativo di “ingaggiare” ilnavigatore, rendendolo partecipe della realtàimprenditoriale cui si sta interessando, magaricoinvolgendolo virtualmente in maniera attiva. Ilprocesso naturalmente prende il sito web come base,ma spazia in altre grandi aree del web. Utilizzare tuttele accortezze fin qui descritte può essere un buoninizio. Conversioni
Gli obiettivi possibili su un sito non devono per forza riguardare la vendita diun prodotto, ma potrebbero riguardare l'iscrizione ad una newsletter, lacompilazione di un form o una richiesta di informazioni. Quando un obiettivoanche banale viene raggiunto, si dice che c’è stata una conversione.Un dato importante nell’ambito web è il tasso di conversione, misurata come ilrapporto tra il numero dei visitatori che accedono ad una pagina (o sito web) equanti di questi compiono una determinata azione.
USABILITÀ, USER EXPERIENCE, ENGAGEMENT, CONVERSIONI
Siamo pigri
Se l’ambizione è realizzare delle conversioni, nel progettare un sitoweb e creare i contenuti da offrire agli utenti vanno tenute a menteuna serie di attitudini fondamentali.
Ci distraiamo facilmente
Prendiamo decisioni inconsciamente
Adoriamo le cose facili
DESKTOP, MOBILE, RESPONSIVE E NUOVE TIPOLOGIE DI NAVIGAZIONE
Navighiamo con un gran numero di devicediversi
DESKTOP, MOBILE, RESPONSIVE E NUOVE TIPOLOGIE DI NAVIGAZIONE
Proprio per questo i siti web moderni, al fine di essere accessibili efruibili, devono adattarsi alle dimensioni del dispositivo da cuivengono visualizzati.
Fino a qualche anno fa i dispositivi mantenevano una media didimensioni che non andava sotto i 980px. I web designer basavanoinfatti i loro layout sulla 980grid e se lo schermo eccedeva taledimensione la griglia si posizionava automaticamente al centro diesso.
Ad oggi le convenzioni del web design sonoleggermente cambiate e ci sono due diversesoluzioni per fare in modo che un sito si adatti aldispositivo di visualizzazione. Il responsive design ela versione mobile. Quale che sia la soluzione, ladistribuzione degli elementi sui vari device vieneeffettuata in modo da dare un senso di lettura piùverticale quanto più si riduce la larghezza deldispositivo.
DESKTOP, MOBILE, RESPONSIVE E NUOVE TIPOLOGIE DI NAVIGAZIONE
DESKTOP, MOBILE, RESPONSIVE E NUOVE TIPOLOGIE DI NAVIGAZIONE
Sito responsive
Il sito responsive è quel sito che
prevede dei meccanismi di
adattamento alla dimensione della
finestra dalla quale vengono
visualizzati.
Versione mobile
Un sito oltre che essere usabile
dall’utente umano deve poter
essere indagato dai motori di
ricerca, che oltre ai contenuti
visibili per ogni pagina vanno a
visionarne alcuni aggiuntivi che
vengono denominati “meta
informazioni”.
La versione mobile di un sito è un
duplicato del sito stesso, pensato
e implementato per essere
visulizzabile dai dispositivi mobili.
Pare che questa non sia una
soluzione troppo adottata nella
community di sviluppatori web, che
preferiscono dare all’utente una
certa omogeneità di fruizione.
Meta infomazioni
DOMINIO, ESTENSIONE, HOST, DB
Realizzare un sito web - Passo 1: Scelta del dominio
Primo step per la creazione di un sito web è la scelta e l’acquisto di un
dominio, uno spazio Host (uno spazio sul web), ed un DataBase
(solitamente un mysql).
Scegliere un nome a dominio
Che sia descrittivo e facile da ricordare
Parte fondamentale del dominio, identifica immediatamente
tipologia o provenienza del sito. Fra le varie scelte possibili:
● com
● org
● net
● it
Scegliere un’estenzione
Un dominio rappresenta un indirizzo web attraverso il quale sia possibile arrivare ad un sito. Si presenta nella forma:www.nomeadominio.estensione
A volte viene indicato anche come URL (Uniform Reference Locator).
Verificare la disponibilità
DOMINIO, ESTENSIONE, HOST, DB
Realizzare un sito web - Passo 2: Scelta del provider
Per fare in modo che il nostro sito siaperfettamente utilizzabile da qualsiasiutente connesso al web dobbiamo farein modo che i sorgenti e le informazionivengano memorizzati su di unamacchina ad alte prestazioni, sempreaccessa e connessa, capace di ricevere esoddisfare richieste. Insomma ci servequello che di solito viene chiamatoServer. Per acquistarne uno dedicatodovremmo sicuramente affrontare unacifra proibitiva, per cui la scelta che si fanella maggior parte dei casi è acquistareuno spazio su una delle macchine diquello che viene detto Provider.Nella maggior parte dei casi, il Providermetterà a disposizione anche uno o piùDataBase mySql.
Scegliere la tipologia di servizio del provider
Fra le varie soluzione offerte dal provider 3 sono quelle più diffuse
Hosting Condiviso
Virtual Private Server
Cloud
DOMINIO, ESTENSIONE, HOST, DB
Hosting Condiviso
Forma classica di hosting in cui un unico server è destinato ad ospitare una pluralità di siti web (a volte anche diversecentinania se non adirittura migliaia) appartenenti a diversi titolari.Nell'hosting condiviso tutti i siti web presenti sullo stesso server devono, ovviamente, condividere le capacità e le risorsedella stessa macchina con il rischio che i problemi di un singolo sito web si riflettano anche su tutti gli altri.
Virtual Private Server (VPS)
Un server virtuale è una porzione di un server fisico in cui viene emulato (mediante un apposito software di virtualizzazione) un ambiente indipendente del tutto analogo a quello che si avrebbe in un server dedicato. In un certo senso possiamo definire un VPS come una soluzione a metà strada tra l'hosting condiviso (perchè si condivide spazio e risorse di una macchina "fisica") e l'housing (perchè si può gestire l'ambiente a proprio piacimento ed in piena autonomia esattamente come se si disponesse di un intero server hardware!).
Cloud
Il termine cloud indica una particolare architettura di sistemi informatici in cui le risorse sono distribuite e scalabili sullabase delle effettive necessità dell'utilizzatore. Ciò signifca che i dati sono memorizzati e caricati in remoto, e cheall’occorenza vengono attivate o disattivate una serie di risorse dell’architattura atte a soddisfare le esigenze di trafficointernet.
ARCHITETTURA E PROGETTAZIONE GRAFICA
Realizzare un sito web - Passo 3: Architettura dell’informazione
Una volta ottenuto uno spazioadeguato ad ospitare il sito web èbene partire con un’ampia attività diprogettazione.Tale attivà usualmente si suddividenella progettazione dell’architetturadell’informazione e nellaprogettazione grafica.La prima delle due è di fondamentaleimportanza e pone le fondamenta perla struttura del sito web.
Definire la struttura del menù principale
Definire il menù principale permette di iniziare a dare un
primo ordinamento alle informazioni presenti sul sito.
Il menù principale è un importante elemento del design del
sito, nonchè strumento principale per l’utente durante la
navigazione.
Esso può essere considerato alla stregua di un sommario o
indice su di una pubblicazione cartacea.
Una volta definito il menù si deve passare a definire i tipi di
dati che andranno a popolare il sito. Il tipo di dato “Pagina”
ad esempio è sempre presente. Altri tipi di dati abbastanza
utilizzati sono “Prodotti”, “Servizi”, “News” ecc..
Definire i vari tipi di dati
Definire Gerarchie e Categorie
Per dare all’utente la possibilità di spostarsi facilmente all’interno di grandi quantità di informazione è bene
collegare e mettere in relazione le varie entry del sito fra di loro. Per farlo di solito si utilizzano diversi gradi di
annidamento e la definizione di categorie e tag cui andranno poi associate le vari informazioni del sito.
ARCHITETTURA E PROGETTAZIONE GRAFICA
Definire la distribuzione degli elementi nel layout
Adesso che tutta l’informazione da inserire sul sito dovrebbe essere stata definita ed ordinata
si passa a ipotizzare come i vari elementi definiti in fase di architettura vadano distribuiti tanto
nell’home page quanto nelle pagine interne.
Realizzare un sito web - Passo 4: Progettazione Grafica
L’attività di progettazione finisce quindi con unarielaborazione grafica di quanto definito;fondamentale per poter appurare che tuttofunzioni effettivamente come previsto comeanche che si stia procedendo nella giusta direzioneestetica.Di solito è un grafico ad occuparsi di questaattività, producendo una serie (2/3) di bozzegrafiche, e rifinendo successivamente quellaconcordata con il proprietario del sito.
STRUMENTI PER REALIZZARE E GESTIRE SITI WEB - CMS
Realizzare un sito web - Passo 5: Scelta del CMS
Finita la fase di progettazione, entriamo finalmente nel pratico ed iniziamo astrutturare il sito web.Per farlo dovremmo sicuramente servirci di quello che viene chiamato ContentManagement System, o Sistema di Gestione dei Contenuti.
Un CMS è uno strumento software, installato su un server web, il cui compito èfacilitare la gestione dei contenuti di siti web, svincolando il webmaster daconoscenze tecniche specifiche di programmazione Web.
Possiamo quindi dire che un CMS è uno strumento che ci permette di installare egestire siti web dinamici. L’utilizzo di un simile sistema è fondamentale in quantosvincola il webmaster da competenze tecniche web e permette a chiunque digestire un sito web in maniera banale.
La diffusione dell’utilizzo di CMS è stata così importante che la community di sviluppatori
Web internazionale ha inziato a creare dei sistemi gratuiti e a disposizione tanto dell’utente
esperto che li voglia utilizzare come base di partenza per ulteriori sviluppi, quanto all’utente
meno esperto che li voglia usare in maniera banale per la semplice gestione di un sito.
CMS PROPRIETARI E CMS OPENSOURCE
CMS Proprietari
Il CMS di questa tipologia è un sistema chiuso, diproprietà di chi lo sviluppa. Nella maggior parte dei casi ilcodice sorgente non è noto al grande pubblico nè fruibiledal titolare del sito web ed è costruito ad hoc perrispettare precisi canoni di usabilità sicurezza e velocità.
Fra i pro dell’utilizzare un sistema proprietario:● Alto grado di originalità● Personalizzazione● Semplicità● Velocità● Ampie garanzie di sicurezza
Fra i contro invece:● Basse probabilità di evoluzione● Integrazioni macchinose● Scarsa diffusione di istruzioni e documentazione● Vincolo forte con gli sviluppatori del sistema● Costi maggiori
CMS Open Source
Un CMS Open Source è invece un sistema aperto, gratuito, incui il codice è a disposizione di chiunque lo voglia indagare.Utilizzare un sistema del genere spesso significa avere inmano una struttura costituita per il grande pubblico del web,piena di funzionalità (anche inutili alle volte) e facilmenteespandibile.
Fra i pro di un sistema Open Source abbiamo:● Costi di installazione e configurazione contenuti● Modularità● Libertà nei confronti dello sviluppatore● Ampia diffusione di documentazione, wiki ecc.● Alte probabilità di evoluzione
Fra i contro:● Scarse garanzie di sicurezza● Potenziali funzionalità superflue● Basso grado di originalità
CMS PROPRIETARI E CMS OPENSOURCE
Realizzare un sito web - Passo 6: Installazione del CMS
Una volta scelto il CMS da utilizzare per creare il sito web ne va effettuatal’istallazione. Il processo di istallazione è tutt’altro che banale e, tanto per unsistema proprietario quanto per un sistema Open Source, è bene che sia una figuracompetente a procedere in tale senso.
Realizzare un sito web - Passo 7: Gestione del CMS
Installato e configurato il tutto inizia l’effettiva attività di gestione del sito web.Dal primo caricamento contenuti all’aggiornamento periodico, l’amministratore dovràprendere dimestichezza con il sistema di gestione.Alcuni sistemi nascono con l’obiettivo di favorire la gestione del contenuto multimedialegenerico, altri sono più orientati verso la gestione di meccanismi di commercioelettronico.Andiamo adesso a vedere i principi di gestione di 3 fra i più famosi CMS diffusi sul web:
WORDPRESS
Sistema di gestione dei contenuti pubblicato per la prima volta nel2003 e oramai alla versione 4.1, al momento è uno dei CMS piùutilizzati a livello globale.Elastico ed essenziale, Wordpress affianca ad un interfaccia semplice efunzionale un sistema di integrazione ed evoluzione che ne aumenta lepotenzialità in manieria tutt’altro che banale.
Per chi volesse prendere dimestichezza con WordPress, ecco unminimo di lessico essenziale da conoscere:
● Plugin● Tema● Editor● Widget● Post● Media
Wordpress utilizza una tipizzazione molto forte, che prevede lapossibile creazione di un’ampia gamma di tipi di dati, tutti discendentidel tipo di dato Post.
WORDPRESS
Tipi di dati
Area solitamente dedicata alla gestione dei contenuti del sito web.
I tipi di dati Articoli, Pagine e Media sono inclusi di default.
● Articoli è utilizzabile per gestire una sezione stile blog;
● Pagine è invece dedicato alla gestione delle pagine generiche
● Media viene usato per la gestione di qualsivoglia tipo di contenuto
multimediale
Aspetto
Sezione utilizzabile per modificare molte caratteristiche dell’aspetto del sito,
comprende al suo interno:
● Gestione del tema
● Gestione dei menù
● Gestione dei widget
Plugin
Area del CMS dedicata all’integrazione di funzionalità
WORDPRESS
Editor contenutoEditor Url Pagina
Editor Titolo Pagina
Informazioni pubblicazione
Call to Action Aggiornamento Pagina
WORDPRESS
Funzionalità aggiuntive
Pannello gestione meta informazioni
Immagine collegata alla pagina
JOOMLA
CMS nato nel 2005 e già alla versione 3.3, fino a poco tempofa competeva con WordPress per il titolo di sistema piùutilizzato per la gestione dei contenuti.Rigido ma con ampie garanzie di sicurezza, Joomla prensentaun’esperienza utente leggermente più macchinosa; maconserva ugualmente le caratteristiche di integrabilità equindi porta con se diverse possibilità di evoluzione.Per chi volesse prendere dimestichezza con Joomla, ecco unminimo di lessico essenziale da conoscere:
● Plugin● Componenti● Estensioni● Templates● Editor● Moduli● Articoli
Se usate Joomla cercate di far integrare il componente k2,ottimo sistema aggiuntivo di gestione dei contenuti
JOOMLA
Gestione Menù
Gestione Banale Contenuti
Gestione funzionalità aggiuntive (fra cui sistema di gestione
contenuti k2)
Installazione e Rimozione funzionalità aggiuntive e template
JOOMLA
Gestione Titolo
Gestione Url
Navigazione contenuti multimediali
Gestione Meta Informazioni
Call to Action e stato Pubblicazione
MAGENTO
I CMS Content Oriented visti fin’ora, se integrati con le giuste componenti, possonoandare bene per gestire anche E-Commerce in cui la quantità di prodotti in venditae la complessità di personalizzazione dei prodotti stessi siano contenute.
Nel caso in cui invece i presupposti di cui sopra venganomeno, è bene usare sistemi costruiti ad hoc per la gestione diE-Commerce di grande complessità.
MAGENTO
CMS E-Commerce Oriented lanciato nel 2008, è unapiattaforma che garantisce una serie di vantaggi poichéinclude potenti strumenti di marketing e di gestione delcatalogo prodotti, ed è un sistema estremamente versatilee perfetto per l’ottimizzazione SEO.Le funzioni che lo differenziano da altri CMS e lo rendonouno tra i più scaricati per il commercio elettronico sono:
● possibilità di confronto tra i prodotti● inserimento di recensioni sul prodotto● immagini con possibilità di zoom visualizzazione di
report● gestione degli ordini batch di importazione e di
esportazione di catalogo● personalizzazione degli account spedizione di mail per
l’ordine a più indirizzi contemporaneamente● inserimento di sconti, promozioni e prezzi speciali● possibilità di negozi online multipli● supporto per più valute e supporto per più lingue
Utilizzare Magento vuoldire anche affrontare deicosti di gestione emanutenzione più alti, apartire dallo spaziohosting che deverispondere a precisicanoni di efficienza evelocità.Proprio per questo lascelta di questo CMSpiuttosto che di unContent Oriented con leopportune integrazioniva ponderata caso percaso.
MONITORAGGIO ED ALLINEAMENTO ALLE ATTITUDINI DEGLI UTENTI
Abbiamo visto quanto sia importante l’interazione con l’utente per essere online inmaniera sensata col proprio sito web.Naturalmente un sito ben fatto, usabile e che porti a delle conversioni può portaread una pmi dei vantaggi non banali.Le potenzialità di Internet però non si fermano qui. I siti web ci danno infatti lapossibilità di avere dei feedback taciti da parte degli utenti; registrando le loroattitudini attraverso dei sistemi di monitoraggio adeguati allo scopo.