Come creare
un sito web
partendo da zero
Oggi su internet sono presenti circa 1.98 miliardi di siti internet.
Aziende, liberi professionisti, associazioni: chiunque al giorno d’oggi è presente sul web e, per quanto possa sembrare immediato, progettare, costruire e mettere online un sito web è un processo che richiede studio e dedizione.
Come creare un sito web
Non sai da dove partire per creare un sito web da zero? Non ti preoccupare! Abbiamo preparato per te una guida in 13 passi da seguire step-by-step per progettare e costruire un sito web funzionale ed efficace.
Se vuoi imparare a creare un sito web per la tua azienda o per iniziare a lavorare come programmatore freelance, ecco le 13 fasi da seguire per progettare e costruire una pagina web.
- Individuare obiettivi e target
- Analizzare le ricerche degli utenti
- Analizzare i competitor
- Scegliere e comprare il nome dominio giusto
- Organizzare le informazioni: come creare l’alberatura del tuo sito web
- Decidere immagine e mood del sito web
- Scrivere i copy delle singole pagine
- Ottimizzare a livello SEO i tag
- Realizzare i mock-up
- Individuare le tecnologie per realizzare il sito web
- Realizzare e mettere online il sito web
- Ottimizzare il sito web una volta che è online (CRO)
- Frequentare un corso per creare siti web
Leggi il resto della guida per creare un sito web per scoprire come affrontare nel dettaglio le 13 fasi e creare il tuo primo sito web da zero.
Se invece vuoi passare subito alla pratica e creare la tua prima pagina web in soli 5 giorni con il supporto di docenti esperti, iscriviti al corso gratuito di Aulab con lezioni online in live streaming ed esercitazioni pratiche!
Registrati per iniziare il corso gratuito
2 ANALIZZARE LE RICERCHE DEGLI UTENTI
Analizzare le ricerche degli utenti è un ottimo modo per scoprire quali sono le loro esigenze e rendere il tuo sito efficiente, competitivo ed utile.
Google Trends
Google Trends è uno strumento gratuito che consente di comprendere meglio ciò che interessa e incuriosisce il pubblico, in tempo reale. Molti esperti di marketing utilizzano questi dati come un modo per ottenere informazioni sul comportamento dei clienti.
Answer The Public
È uno strumento di analisi dei consumatori che combina le ricerche suggerite da Bing e Google e le visualizza in quello che potrebbe essere chiamato un cloud di ricerca. Organizzate in categorie come cosa, dove e perché, questi insiemi di ricerca forniscono una panoramica delle domande che le persone stanno ponendo ai motori di ricerca dai loro dispositivi.
Google Suggest
Google Suggest è una funzione del motore di ricerca di Google che fornisce suggerimenti agli utenti quando inseriscono una query nella casella di ricerca. Attraverso un’altra funzione chiamata Google Instant, la SERP si adatta alle parole chiave o alla frase man mano che vengono immesse.
3 ANALIZZARE I COMPETITOR
Per creare un sito web è importante analizzare ciò che fanno i tuoi concorrenti.
Immedesimati nel tuo cliente ideale, fai su Google le ricerche che farebbe il tuo cliente, vedi i 5 primi risultati e studia questi siti web. Esistono anche dei tool a pagamento per la ricerca dei competitors, ad esempio, similarweb e buzzsumo.
Scopri che messaggi e che tono di voce usano, che contenuti prediligono e che stile visuale utilizzano e prendi ispirazione per creare il tuo sito web.
4 SCEGLIERE E COMPRARE IL DOMINIO GIUSTO
Il nome del dominio è il biglietto da visita per il tuo sito web. Per questo avrai bisogno di un nome memorabile, brandizzabile e facile da digitare e pronunciare.
Evita nomi troppo lunghi o eccessivamente specifici e scegli un nome che ti aiuti a indirizzare più traffico verso di te.
Le keyword non servono solo per indicizzare i contenuti. I motori di ricerca usano il tuo nome dominio per capire di cosa tratta il tuo sito, quindi, se possibile, è importante includere parole chiave pertinenti.
5 ORGANIZZARE LE INFORMAZIONI:
COME CREARE L'ALBERATURA DEL TUO SITO WEB
L’alberatura di un sito si presenta generalmente sotto forma di diagramma che organizza le pagine web in sezioni e definisce i diversi livelli di navigazione. Creare l’alberatura del tuo sito web ti permetterà di avere una visione globale del sito e del percorso di navigazione prima di creare effettivamente le pagine principali.
Un sito web, per quanto bello, difficilmente raggiungerà i suoi obiettivi se prima non progetterai la sua struttura. Come fare? Innanzitutto crea un elenco che comprenda tutti i contenuti che vuoi includere all’interno del tuo sito web. Ad esempio, i contenuti per un’azienda che cerca di promuovere la propria attività su Internet potrebbero essere elencati in questo modo:
- Servizi e offerte: Attività, settore di competenza 1, Settore di competenza 2, Punti di forza
- Catalogo dei prodotti
- Chi siamo: Contatti, Uffici, Note legali
Analizzare l’alberatura dei tuoi competitor può essere un ottimo punto di partenza, sia per assicurarti di non aver dimenticato di inserire contenuti importanti all’interno del tuo sito web, sia per prendere spunto per organizzarli.
6 DECIDERE IMMAGINI E MOOD DEL SITO WEB
I colori
I colori comunicano emozioni. Per esempio il rosso brillante comunica una sensazione di pericolo, il blu calma o tranquillità e il viola regalità. La scelta del colore giusto può avere una forte influenza sulla reazione di un visitatore.
Crea una palette di colori con circa 3 colori primari e 3 colori secondari. I tuoi colori primari riempiranno la maggior parte del layout, mentre i colori secondari fungeranno da contrasto. Ricordati di usare il colore per mettere in risalto le informazioni principali e per le call to action, ovvero le azioni che devono compiere gli utenti. Ci sono diversi siti per generare palette online, uno tra tutti è Adobe Color.
Le immagini
Se vuoi che il tuo sito web colpisca nel segno, devi scegliere immagini ben fatte ed inserirle al posto giusto. Non usare immagini sgranate, inserisci le più belle in primo piano e distribuisci le altre all’interno delle varie pagine. Scegli di utilizzare sempre immagini royalty-free che non violino i diritti d’autore: utilizzare immagini protette da copyright senza autorizzazione o senza il pagamento delle necessarie licenze può comportare pesanti sanzioni. Alcuni siti dove trovare immagini del genere sono Unsplash, Pexels e Pixabay ma, ci raccomandiamo: controlla sempre la licenza di utilizzo!
I font
Scegli caratteri semplici e di facile lettura! Quando si tratta di web design, la leggibilità è fondamentale. I caratteri eccessivamente stilizzati o condensati metteranno in difficoltà gli utenti e, molto probabilmente, li faranno uscire dalla pagina web. Puoi trovare tantissimi font da utilizzare per i tuoi progetti su Google Fonts.
7 SCRIVERE I COPY DELLE SINGOLE PAGINE
Ogni singola riga di testo sul tuo sito web dovrebbe aiutare i tuoi visitatori a scoprire o imparare qualcosa di nuovo. Cerca di spiegare in modo chiaro e conciso come funziona il tuo prodotto e quali vantaggi offre all’utente.
Definisci il “tono di voce” del tuo brand ma cerca anche di concentrarti sui desideri e sui bisogni dei clienti (e potenziali clienti) dando una priorità in termini di importanza a quello che vuoi comunicare.
Quando scrivi i copy del tuo sito web tieni ben presente i motivi principali per cui una persona lo sta visitando:
- Conoscere il settore in cui opera la tua azienda
- Saperne di più sulle offerte di servizi nel tuo settore
- Saperne di più sulla tua azienda in particolare
- Confrontare prodotti, offerte, prezzi etc.
- Comprare qualcosa
8 OTTIMIZZARE A LIVELLO SEO I TAG
La SEO è il metodo per ottimizzare l’efficacia dei tuoi contenuti per i motori di ricerca, al fine di posizionarsi più in alto rispetto ai contenuti di altri siti che hanno come target gli stessi termini di ricerca.
Una delle maggiori sfide che i creatori di contenuti devono affrontare è scrivere contenuti ottimizzati per i motori di ricerca ma anche per le persone. Quindi tieni bene a mente che le due cose devono andare di pari passo e il contenuto creato deve essere utile per l’utente oltre che ben ottimizzato lato SEO.
L’ottimizzazione di titoli e sottotitoli è una delle cose più importanti per assicurarti che il tuo sito web si posizioni su Google, oltre ad attirare un pubblico.
9 REALIZZARE I MOCK-UP
Un mock-up è una bozza visiva di una pagina web o un’applicazione che presenta molti dei suoi elementi di design finali ma non è funzionale. Un mockup non è raffinato come una pagina live e in genere include alcuni dati segnaposto.
Per creare il tuo mock-up hai due opzioni:
- utilizzare un software che potrai scegliere in base agli strumenti che già utilizzi, al tuo budget etc
- usare uno strumento di progettazione grafica per siti web come Figma, utilizzato da tantissimi designer
10 INDIVIDUARE LE TECNOLOGIE PER REALIZZARE IL SITO WEB
I siti web moderni sono costruiti utilizzando tantissime tecnologie diverse. Non esiste una “tecnologia giusta” per la creazione di siti web, e la tua scelta può variare in base alla tua esperienza, ai costi di sviluppo e di licenza, alle prestazioni del sito web, la manutenzione, la scalabilità e altro ancora.
Che tu scelga di avvalerti di CMS come WordPress o di realizzare il tuo sito web da zero, le tecnologie che di sicuro non possono mancare sono il linguaggio HTML (Hypertext Markup Language), il linguaggio CSS (Cascading Style Sheets) e il linguaggio JavaScript. Se vuoi scoprire come imparare a programmare, da quali linguaggi è meglio partire e quali sono gli sbocchi professionali, ti consigliamo di consultare le nostre guide gratuite.
HTML
è un linguaggio che compone il contenuto del tuo sito web. Delinea la struttura del tuo sito e ne compone “lo scheletro”. Se vuoi approfondirlo, abbiamo preparto per te una pratica guida all’html in italiano, da consultare ogni volta che vuoi!
CSS
è un linguaggio di stile, utilizzato per descrivere la presentazione (l’aspetto e la formattazione) del tuo sito web e indica al tuo browser (Firefox o Chrome, ad esempio) cosa mostrare sul tuo sito, cosa l’utente potrà visualizzare navigandolo. Abbiamo pensato ad una guida al css in italiano per aiutarti a cimentarti con questo linguaggio.
JavaScript
è un linguaggio di programmazione comunemente usato per creare effetti interattivi all’interno dei browser web.
Spesso le risorse per apprendere il linguaggio Javascript sono in lingua inglese, ma non preoccuparti: abbiamo creato una guida per aiutarti a muovere i primi passi con questo linguaggio: leggi la nostra guida a Javascript in italiano!
Vuoi scoprire come creare un sito web partendo da zero utilizzando HTML, CSS e Javascript?
Guarda questo video!
11 REALIZZARE E METTERE ONLINE IL SITO WEB
Ci sono vari modi per realizzare il tuo sito web in base alle tue esigenze e competenze specifiche:
A Creare un sito web statico in HTML e CSS
Per creare un sito web in HTML devi innanzitutto installare un editor di testo adatto a scrivere codice (ad esempio, puoi usare Visual Studio Code o Sublime Text, gratuiti e disponibili sia per Mac che per PC). Dopodiché dovrai imparare le basi del funzionamento dell’HTML.
L’elemento principale di una struttura HTML è un tag HTML. Un tag, ad esempio, ha questo aspetto:
<b>QUALCOSA</b>
Qui abbiamo a che fare con un tag <b>. Questo metterà in grassetto una parte di testo che si trova tra il tag di apertura (<b>) e il tag di chiusura (</b>).
In questo caso, quella parte di testo è QUALCOSA.
Esistono diversi tipi di tag, semplici e più complessi. Ad esempio, se vuoi creare un elenco puoi farlo con il seguente codice HTML:
<ul>
<li>Articolo 1</li>
<li>Articolo 2</li>
<li>Articolo 3</li>
</ul>
Per rendere la tua pagina accattivante dovrai imparare ad usare anche il CSS, (Cascading Style Sheets) che definisce lo stile/presentazione di una pagina web e gli elementi su di essa. HTML e CSS lavorano insieme per creare la pagina web finale, il suo design e il contenuto.
Dopodiché dovrai installare Bootstrap, un toolkit open source che si occupa della struttura di base di un documento HTML e di un foglio di stile CSS. Fornisce un framework che assicura che l’impalcatura principale della tua pagina web sia pronta e ottimizzata per un ulteriore sviluppo.
Ci sono due strade che puoi intraprendere:
- imparare ad utilizzare Bootstrap vai alla homepage di Bootstrap, scarica il pacchetto Bootstrap principale e inizia ad utilizzarlo;
- prendere una scorciatoia ottieni uno starter pack per Bootstrap con un bel design e una pagina web demo già creata.
B Creare un sito con un CMS (es. WordPress)
Un CMS (Content Management System) è un’applicazione che permette di creare un sito internet tramite un’interfaccia semplice da utilizzare. I CMS nascono dalla necessità di dare a chiunque la libertà di progettare la propria pagina web, proprio in virtù dell’interfaccia utente molto intuitiva. Hai mai sentito parlare di WordPress? Ecco, è uno dei CMS più famosi.
Con questi software è possibile creare un sito web di buona qualità e facile gestione; i CMS offrono una rapida implementazione, un’ampia scelta di temi e plugin per estendere le funzionalità del sito, e la possibilità di gestire il contenuto in modo collaborativo con più utenti.
Se è vero che, in alcune situazioni, costituiscano una valida soluzione, potrebbe non essere appropriato utilizzare un CMS in alcuni casi, come per siti web altamente personalizzati che richiedono funzionalità particolari o prestazioni ottimizzate: in queste situazioni, potrebbe essere più vantaggioso sviluppare un sito web su misura.
Che si scelga di utilizzare un CMS come WordPress o di realizzare il proprio sito in maniera sartoriale, non si può prescindere da una conoscenza di base dello sviluppo web: sebbene, infatti, l’utilizzo di un CMS semplifichi notevolmente il processo di creazione di un sito web, padroneggiare le basi dello sviluppo web garantisce un risultato finale di qualità superiore e una maggiore flessibilità nella gestione e personalizzazione del sito. Senza una comprensione di base dello sviluppo web, potrebbe essere difficile risolvere eventuali problemi tecnici, adattarsi a cambiamenti tecnologici, implementare best practice per l’ottimizzazione del sito e garantire una migliore esperienza utente.
L’Hackademy di Aulab ti darà l’opportunità di padroneggiare le basi dello sviluppo web qualunque sia la tua scelta a posteriori: potrai realizzare il tuo sito web come un vero professionista a prescindere dal tool utilizzato, perchè comprenderai le basi della programmazione web.
C Creare un sito web con un framework (es. Laravel)
Laravel è un framework per applicazioni web con una sintassi espressiva ed elegante. Laravel tenta di rendere divertente lo sviluppo semplificando le attività comuni utilizzate nella maggior parte dei progetti Web, come autenticazione, routing, sessioni, modelli, memorizzazione nella cache e altro.
Laravel è progettato per sviluppare siti web di media complessità: costituisce, infatti, una soluzione ottimale laddove i CMS come WordPress potrebbero incontrare ostacoli.
Con Laravel, ad esempio, potete creare una web app, un sito di news, un sito aziendale, ma anche progetti più grandi come veri e propri gestionali per aziende.
È una base di partenza per i programmatori per creare siti e applicazioni, mentre WordPress viene utilizzato da esperti di web marketing e web designer più che da veri e propri developers.
Se non sai da dove partire per imparare a creare un sito web utilizzando Laravel, ti consigliamo di prendere familiarità con questo framework leggendo la nostra guida Laravel in italiano; se l’idea di imparare a programare utilizzando un framework ti stuzzica, invece, ti consigliamo di consultare la nostra guida per trovare il corso di informatica più adatto a te.
12 OTTIMIZZARE IL SITO WEB UNA VOLTA CHE È ONLINE (CRO)
Dopo aver creato il tuo sito web, è arrivato il momento: analizza ciò che fanno gli utenti e fai un’ottimizzazione iterativa. Se all’inizio il nostro sito converte all’1%, il tuo obiettivo è far salire questa percentuale al 10%.
Alcuni ottimi strumenti di analisi sono:
Google Analytics
È lo strumento più popolare e conosciuto e serve per analizzare le sorgenti di traffico e l’efficacia dei contenuti. Utilizzarlo correttamente ti permetterà di scoprire tendenze molto utili per creare ed ottimizzare il tuo sito web.
Hotjar
Offre strumenti per comprendere il comportamento degli utenti e può davvero aiutarti a distinguerti dalla concorrenza.
Google Optimize
È lo strumento di Google per eseguire esperimenti su un sito web, come A/B test e test di reindirizzamento per valutare l’efficacia di potenziali modifiche al sito Web e testare funzionalità come pulsanti e call to action.
13 FREQUENTARE UN CORSO PER CREARE SITI WEB
Arrivato a questo punto della guida sicuramente avrai le idee molto più chiare su come creare il tuo primo sito web partendo da zero.
Se vuoi approfondire l’argomento oppure senti di aver bisogno di altri strumenti o di un supporto professionale, ti consigliamo di seguire il Corso Hackademy per Full Stack Developer. Potrai seguire il corso online da ovunque vorrai, ma non sarai mai solo.
Potrai interagire con i compagni di classe e i docenti saranno a tua disposizione in qualunque momento, durante le lezioni frontali e le esercitazioni pratiche. Durante le esercitazioni quotidiane metterai in pratica tutto ciò che imparerai durante le lezioni teoriche e fin dal primo giorno sarai seguito dalle nostre career advisor che ti accompagneranno nel mondo del lavoro costruendo insieme a te la tua nuova carriera.
Scopri se il corso Hackademy
Full time fa per te
Parliamone! Prenota una chiamata con un nostro consulente.
