Creazione di un sito web 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 da:
Risorse Free SEO e Web Marketing

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.

1. Primo contatto e raccolta info per redigere il preventivo
2. Stesura preventivo di massima con opzioni e proposta grafica
3. Colloquio e/o incontro per definire opzioni, dubbi, domande, e redigere proposta definitiva.
4. Richieste info e materiale
5. Definizione scelte strategiche, tempi, metodi.
6. 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

Il cliente non dispone di nessun ambiente e va acquistato e configurato.

1. Acquisto servizio
2. Dominio, spazio web, Database
3. Posta
4. Configurazione

HOSTING ESISTENTE

Il cliente ha già un servizio Hosting

• 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.

1. Installazione Wordpress, Joomla, file HTML o altro Cms
2. Setup e configurazioni base CMS
3. Installazione (previo acquisto) tema grafico
4. Eventuale importazione dati demo
5. Installazione Plugin base:

• CF/+style+redirect
• RecaptchaSSL
• Cache
• Backup (configur.automat)
• …

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.

1. Progettazione pagine>menu Albero
2. 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
3. Ottimizzazione dei media (resize/rename/cambio formato)
4. Razionalizzazione dei testi, bottoni, link, ancore
5. Accenti stili colori, 
6. Voci menu e ancore
7. Setup header e footer
8. Setup area news
9. Tabelle, listini …
10. Funzionalità specifiche: Filtri, campi ricerca,
    elementi correlati …
11. Sidebars, widget, moduli, banner
12. Iscrizione Newsletter, qundi: creazione account MailChimp, setup, liste, layout newsletter, lead generation …
13. 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 Importante

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.

1. Creazione o Revamp del logo
2. Proposta, Scelta cliente, Realizzazione
3. Crezione versione Vettoriale, png Scontornato, SVG
4. 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

1. Install/config. Yoast
2. Meta title/description/H1, H2, Link title, Alt img, friendly Url’s …

Google Tools (account Google Cliente)

1. Google Search Console
2. Verifica sito
3. Sitemap XML (con Plugin per aggiornamento automatico)
4. Google Analytics
5. Google My Business
6. Bing, Yahoo ?
7. 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

1. Setup file Htaccess
2. Avviso Cookies 1°accesso
3. Pagina privacy policy
4. Pagina Cookies Policy
5. Api Google Map
6. Api recaptcha

7 - Revisione del cliente

Riunione Vis a Vis oppure Online. Aggiustamenti Design, pagine, specifiche, varie ed eventuali.

8 - Messa online

1. Rimozione blocchi indicizzazione Google
2. Spostamento in area definitiva e riconfigurazione path, htaccess, Path DB.
3. Test: pagine, form contatti, funzionalità…

REDIRECT301

1. Esportazione di tutte le vecchie URL in file Excel
2. Associazione con regola o sartorialmente con ciascuna URL corretta
3. Pulizia dei path
4. Aggiunta colonna Redirect 301
5. Esportato CSV, ripulito
6. 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:

1. Backup dei dati e del Database per tutelarsi in caso di attacco Hacker, errori di rinnovo Hosting, guasti determinati da errati aggiornamenti.
2. Aggiornamento del CMS (Wordpress, Joomla…) dei Plugin, dei moduli, dei componenti, del tema grafico.
3. Verifica e monitoraggio delle performance.
4. 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
5. 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…