Lista completa per la creazione di un sito web professionale dalla “A” alla “Z”.
In questo articolo trovi la lista completa, passo passo, per la creazione di un sito web professionale. Dalla proposta al preventivo alla parte progettuale e consegna del sito web. La lista si adatta bene anche alla realizzazione di un ecommerce.
Scarica la versione PDF
“Fasi progettazione sito web in pdf”
1 – Contatto e preventivo
In questa guida alle fasi di progettazione di un sito web vogliamo tenere anche conto della parte di approccio al cliente. Questo perchè è una fase importantissima e che comporta impegno in termini di tempo e relazioni.
- Primo contatto e raccolta info per redigere il preventivo
- Stesura preventivo di massima con opzioni e proposta grafica
- Colloquio e/o incontro per definire opzioni, dubbi, domande, e redigere proposta definitiva.
- Richieste info e materiale
- Definizione scelte strategiche, tempi, metodi.
- Accettazione, emissione fattura anticipo.
Talvolta sono necessarie settimane, altre volte il processo viene sospeso o messo in attesa per mesi dal committente e occorre riprendere le fila successivamente.
2 – Hosting e Ambiente
Quando realizziamo un sito web, dobbiamo premunirci di avere l’ambiente corretto per farlo. Essere frettolosi in questa fase potrebbe influire negativamente su tutto il resto del progetto. Sviluppare un sito web complesso su un Hosting lento potrebbe significare impiegare il doppio del tempo. Usare un Hosting con tecnologia obsolete (Php non aggiornato, certificati ssl non disponibili…) potrebbe significare trovarci a metà lavoro con problemi di compatibilità e bloccare del tutto il nostro processo di realizzazione del sito.
HOSTING NUOVO
- Acquisto servizio
- Dominio, spazio web, Database
- Posta
- Configurazione
HOSTING ESISTENTE
- Raccolta credenziali
- Verifica compatibilità Php, DB, Certificati Ssl …
- Eventuale acquisto servizi aggiuntivi
- Setup ambiente e configurazione
3 – Prime Attività Tecniche
Bene, è venuto il momento della realizzazione vera e propria del sito web. In questa fase il portale prende forma e gettiamo le basi per tutto il futuro lavoro.
- Installazione WordPress, Joomla, file HTML o altro Cms
- Setup e configurazioni base CMS
- Installazione (previo acquisto) tema grafico
- Eventuale importazione dati demo
- Installazione Plugin base:
- CF/+style+redirect
- RecaptchaSSL
- Cache
- Backup (configur.automat)
- …
Installazione
L’installazione può avvenire su:
- Area sviluppo su sito esistente
- Locale (off line)
- Root su nuovo spazio
Attivazione blocco accessi a sito in costruzione e blocco index Google via Robots.txt
4 – DESIGN
In questa fase di realizzazione del sito web iniziamo davvero a divertirci. E’ il momento in cui iniziano a lavorare con il design vero e proprio, i CSS, le immagini, le icone, i bottoni.
- Progettazione pagine>menu Albero
- Creazione pagine, con contenuti reali o demo se non disponibili, se si utilizzano dati DEMO andrà fatto un secondo passaggio per inserire i contenuti reali
- Ottimizzazione dei media (resize/rename/cambio formato)
- Razionalizzazione dei testi, bottoni, link, ancore
- Accenti stili colori,
- Voci menu e ancore
- Setup header e footer
- Setup area news
- Tabelle, listini …
- Funzionalità specifiche: Filtri, campi ricerca,
elementi correlati … - Sidebars, widget, moduli, banner
- Iscrizione Newsletter, qundi: creazione account MailChimp, setup, liste, layout newsletter, lead generation …
- Live help, Social sharing, Social like, Whatsapp Button
Installazione
L’installazione può avvenire su:
- Area sviluppo su sito esistente
- Locale (off line)
- Root su nuovo spazio
Attivazione blocco accessi a sito in costruzione e blocco index Google via Robots.txt
Il cliente spesso vuole inserire nel sito mille funzionalità. Spesso questo significa spendere il doppio e trovarsi con un sito caotico e lento. Occorre rendere consapevole il cliente.
4b – LOGO DESIGN
A volte il Web Designer deve anche realizzare il logo per il sito web. Spesso i clienti credono che sia un giochino da ragazzi. Siamo noi a dovergli spiegare l’importanza di questa attività e mostrargli il lavoro che c’è dietro alla creazione anche di un semplice logo in lettering.
- Creazione o Revamp del logo
- Proposta, Scelta cliente, Realizzazione
- Crezione versione Vettoriale, png Scontornato, SVG
- Versioni: Logo header, Favicon, Logo inverso, Logo mobile, Tuch icon
Nota: Tutti gli elementi devono essere ottimizzati per Smartphone e Tablet, per tutte le dimensioni dello schermo e Cross Browser (compatibili con tutti browser, Chrome, Safari, Firefox …)
Alcuni elementi ANDRANNO disabilitati sulla versione mobile e altri, viceversa andranno abilitati solo per la versione mobile.
Se siamo dei professionisti dobbiamo fare si che il sito web non solo sia Seo Friendly e che possa un domani essere predisposto a essere manipolato ma anche avere un minimo di funzionalità seo giusto per partire. La seo vera e propria è ben altra cosa, leggi qui l’articolo sull’ ottimizzazione per i motori di ricerca e la consulenza Seo
5 – Seo Basic
- Install/config. Yoast
- Meta title/description/H1, H2, Link title, Alt img, friendly Url’s …
Google Tools (account Google Cliente)
- Google Search Console
- Verifica sito
- Sitemap XML (con Plugin per aggiornamento automatico)
- Google Analytics
- Google My Business
- Bing, Yahoo ?
- File robots.txt con sitemap e disallow
Attenzione: SEO
Tutta la parte di SEO vera e propria necessita di un processo e di attività a parte.
6 – Extra necessari
- Setup file Htaccess
- Avviso Cookies 1°accesso
- Pagina privacy policy
- Pagina Cookies Policy
- Api Google Map
- Api recaptcha
7 – Revisione del cliente
8 – Messa online
- Rimozione blocchi indicizzazione Google
- Spostamento in area definitiva e riconfigurazione path, htaccess, Path DB.
- Test: pagine, form contatti, funzionalità…
REDIRECT301
- Esportazione di tutte le vecchie URL in file Excel
- Associazione con regola o sartorialmente con ciascuna URL corretta
- Pulizia dei path
- Aggiunta colonna Redirect 301
- Esportato CSV, ripulito
- Caricare in Htaccess e testare
In alcuni casi il Redirect può essere fatto con una singola regola. Ma Le URL devono essere state create nella stessa identica maniera del vecchio
NOTA1
Se il sito è stato sviluppato in locale perchè il cliente non disponeva ancora di un Hosting o in un’area di sviluppo la procedura di spostamento e configurazione può essere laboriosa e riservare sorprese.
NOTA2
Se il nuovo sito sostituisce un sito vecchio OCCORRE fare il REDIRECT di tutte le vecchie pagine indicizzate in Google verso le nuove. Non farlo significa perdere l’indicizzazione maturata in Google.
Il cliente riceve User e Password per accedere al Backoffice del sito con poteri completi. A questo punto il Web Master che ha fatto un backup non può più essere responsabile di ciò che accadrà alla piattaforma.
MULTILINGUE – Attenzione!
Se il sito è multilingue gran parte delle attività sopra descritte sono da considerare raddoppiate. Inoltre va prevista tutta la parte di installazione e configurazione del sistema Multilingue.
Alcuni esempi di cose da considerare doppie sono: tutte le pagine, i menu, il footer, gli elementi nella sidebar (widget, moduli, banner), tutta la parte di SEO, la parte del GDPR, i form di contatto e le relative pagine ThankYou
Termini assistenza
La manutenzione del sito comporta alcune attività da svolgere costantemente, eccone alcune:
- Backup dei dati e del Database per tutelarsi in caso di attacco Hacker, errori di rinnovo Hosting, guasti determinati da errati aggiornamenti.
- Aggiornamento del CMS (WordPress, Joomla…) dei Plugin, dei moduli, dei componenti, del tema grafico.
- Verifica e monitoraggio delle performance.
- Verifica e monitoraggio delle funzionalità. I contact form funzionano? Ci sono errori di visualizzazione di qualche pagina? Il form di iscrizione Newsletter sta funzionando? Ecc Ecc
- Se sul sito sono state attuate strategie SEO si apre tutto un paragrafo sul monitoraggio e l’implementazione.
Il Fai da te
Spesso le piccole aziende e i professionsiti gestiscono in modalità “Fai da Te” la parte di manutenzione del sito. Contattano il web master quando subentrano delle criticità. Spesso al Web Master viene chiesto di intervenire in maniera spot, senza essere pagato ma questo può creare un grosso disagio all’agenzia,
Perchè?
Il web designer entra per sistemare e diventa automaticamente responsabile del problema che può essere non da poco
Il cliente pensa che in 3 minuti la cosa si possa sistemare ma non sempre è così. 1h di lavoro è sempre 1h di lavoro sottratta ad altre attività di clienti che stanno attendendo…
Gdmtech
20128 Milano (MI) - Italy
- info@gdmtech.it
- PI 00865500144
- CF DMEGZN73A10F205M
- Cod. Univ. SZLUBAI
Philosofy
I nostri clienti sono aziende e professionisti che vogliono sfruttare Internet per trovare nuovi clienti, aumentare i loro contatti, vendere i loro servizi e prodotti. Oltre alle normali attività di Web Design siamo specialisti SEO e Digital Marketing. Ci occupiamo di corsi di web marketing in azienda, sviluppo di e-commerce con Opencart e Prestashop e Woocommerce, siti web in Wordpress e Joomla, migrazioni.
