La guida definitiva per costruire un sito Web personale

Questa guida è stata originariamente pubblicata nel marzo 2012. Da allora, centinaia di studenti (e persino non studenti!) Hanno creato i propri siti Web personali utilizzandola. Trattandosi di uno degli articoli più visti su College Info Geek, tengo questa guida molto aggiornata ed è aggiornata a dicembre 2019.

Qual è lo strumento di rete n. 1 che puoi avere nel tuo arsenale da studente? Te lo dico subito: non è il tuo curriculum. 

I curriculum sono noiosi. Gli esperti di carriera ti dicono di rendere il tuo curriculum di un documento romano di una pagina, formato 11 volte, stampato con inchiostro nero senza immagini. Sul serio? Come dovresti rappresentare – e differenziarti – con quello?

Inoltre, il tuo curriculum diventa statico e obsoleto nel momento in cui lo passi a qualcuno. Non puoi aggiornare i curriculum che hai già distribuito: devi fare nuove copie.

Ecco perché è necessario creare un sito Web personale.

Un sito Web è l’ esatto contrario di un curriculum. Tutto ciò che è negativo sui curriculum può essere risolto semplicemente con un sito Web. Direi che non avere un sito web è come spararsi ai piedi – è utile.

4 motivi per cui è necessario creare un sito Web personale

1)  Un sito Web non è statico; è dinamico . È in continua evoluzione. Nel momento in cui realizzi qualcosa, puoi aggiungerlo al tuo sito web. Quando completi un progetto, puoi inserirlo nel tuo portfolio affinché tutti possano vederlo. Non è necessario stampare nuove copie e inviarlo più volte ai contatti; lo aggiorni e basta. Le persone possono tornare continuamente e vedere cosa stai facendo.

2) Avere un sito Web ti rende più reperibile. Se tutto ciò che hai è un curriculum, devi uscire e consegnarlo alle persone per ottenere il tuo nome. Se qualcuno volesse cercarti su Internet e non avessi un sito Web, tutto ciò che potrebbero ottenere è un profilo Facebook o Twitter.

Tuttavia, se si dispone di un sito web, si può essere trovato da un pubblico molto più vasto e controllare che cosa è che vedono prima. Questa è la chiave per stabilire il tuo marchio personale e per evidenziare i tuoi risultati.

Mi sono stati offerti lavori, ho incontrato clienti per il mio lavoro di web design e ho ottenuto interviste semplicemente perché ho un sito web. Se non avessi il tempo di crearne uno, sono sicuro che non sarei stato trovato.

Assicurati di essere trovato!

3) Non molte persone ne hanno uno. I siti Web personali potrebbero essere più comuni nel 2019 rispetto a dieci anni fa, ma la stragrande maggioranza degli studenti e delle persone in cerca di lavoro fa ancora affidamento su curriculum e siti Web di ricerca di lavoro.

Per avere successo oggi è necessario distinguersi e avere un sito Web può aiutarti. Dimostra che hai avuto il tempo di imparare a fare qualcosa di abbastanza tecnico e mostra che hai alcune abilità che altre persone non hanno.

4) Ottieni alcune nuove abilità che possono essere molto utili in futuro. Imparare a costruire un sito Web comporta una serie di competenze diverse, soprattutto se si inizia a personalizzare e ottimizzare le cose. Anche se non stai cercando un lavoro in un campo tecnologico, avere queste abilità può darti un vantaggio.

Supponi che stai facendo domanda per un lavoro nella pubblicità. Se riesci a dire all’intervistatore che non sei solo un grande marketer, ma che hai anche una conoscenza del web, diventi un candidato molto più attraente.

Convinto ancora?

Lo spero proprio, perché questa guida ti insegnerà esattamente come costruire quel fantastico sito Web!

Ho trascorso più di 15 ore a scrivere questa guida (oltre a prendere screenshot e modificarli) con l’intento di renderlo la risorsa definitiva per metterti online. Al termine, avrai stabilito un’ottima presenza online.

Se vuoi vedere alcuni esempi di siti web personali prima di iniziare, ecco come appare il mio oggi:

Il mio sito Web personale
Questo è il mio sito web personale.

(A proposito – se ti piace il design del mio sito Web, più avanti nella guida troverai un tutorial video approfondito che ti mostrerà come l’ho creato usando un tema gratuito. Tieni d’occhio quello nel Passaggio 3.)

Mi sono anche assicurato di tenere accessibili tutte le versioni precedenti del mio sito Web. Ecco la versione che ho usato per la maggior parte del college, che fa molto di più per evidenziare i miei risultati e obiettivi come studente:

Sito Web personale degli studenti di Thomas Frank
Il sito personale e il portafoglio che ho usato come studente universitario.

Ecco un altro ottimo esempio: questo è il sito Web del portfolio della mia ragazza, che usa per mostrare le sue illustrazioni e il lavoro di progettazione grafica:

Sito Web di Anna Graphic Graphic Portfolio
Il sito Web del portfolio della mia ragazza Anna: un buon esempio per vedere se sei un graphic designer.

Ho lavorato duramente per rendere questa guida più  completa, ma accessibile possibile. È un po ‘lungo, ma è perché ti porta letteralmente dal nulla a un sito Web finito.

In questo tutorial imparerai come:

  1. Ottieni un nome di dominio e un web hosting per il tuo sito
  2. Installa facilmente WordPress (il mio costruttore di siti Web preferito) e ottieni tutti i tuoi contenuti sul Web senza bisogno di conoscenze di programmazione
  3. Rendi il tuo sito bello con un tema accattivante
  4. Ottimizza la velocità, la sicurezza e molto altro del tuo sito Web con plugin e widget
  5. Migliora la SEO del tuo sito e trova risorse che possono insegnarti come portare il tuo sito ulteriormente se lo desideri

È possibile trattare questo elenco come un sommario; se desideri passare a una sezione specifica, fai clic su di essa. Altrimenti, sentiti libero di trasportare in ordine l’intera guida.

Cosa devi sapere in anticipo:

  1. Come usare Internet
  2. Come seguire le indicazioni

Cosa non devi sapere / avere in anticipo:

  1. HTML, PHP, CSS, Javascript, JQuery, XML, XSLT, Ruby, Zend, Python, Flash, MySQL, Nginx, Apache o qualsiasi altra lingua
  2. Photoshop, Dreamweaver o qualsiasi altro programma: possono essere molto utili per personalizzare le cose in un secondo momento, ma per iniziare a utilizzare tutto ciò di cui hai bisogno è un browser web.
  3. Kung-fu, Naruto jutsus o chirurgia missilistica

Seriamente, la costruzione di un sito Web non è difficile e non è necessario conoscere alcun codice. Conoscere il codice può essere utile per modificare e personalizzare le cose in un secondo momento, ma puoi approfondire le nozioni di base senza conoscere un minimo di HTML!

Tempo stimato per il completamento di questo tutorial: 1-2 ore (passerai la maggior parte del tempo su cose non tecnologiche come la scrittura dei tuoi contenuti).

Nota n. 1:  se rimani bloccato in qualsiasi momento in questo tutorial e hai bisogno di aiuto, sarei più che felice di aiutarti. Puoi contattarmi su Twitter o via e-mail . Sono serio – per  favore, fammi domande se rimani bloccato. Odierei vedere qualcuno passare attraverso un sacco di lavoro e non finire con un sito di bell’aspetto.

Nota n. 2: in questo tutorial raccomando alcuni prodotti e servizi specifici. Sii consapevole che queste non sono la tua unica scelta; sono semplicemente ciò che uso personalmente e consiglio.

Dichiarazione di non responsabilità completa:  se scegli di utilizzare il dominio e l’opzione di hosting che consiglio in questo tutorial e fai clic sui miei collegamenti per accedervi, guadagnerò una commissione (anche se non ci sono costi aggiuntivi per te – in realtà sarà un bel po ‘ più economico poiché sono in grado di offrire un codice coupon). Voglio essere molto chiaro che ci sono sicuramente altre buone scelte per il tuo dominio e il tuo hosting là fuori. Questo è semplicemente quello che ho usato dall’inizio e sono molto soddisfatto. Se scegli di usare il mio link,  grazie!

Va bene, basta con le cose preliminari. Iniziamo a costruire il tuo sito.

Passaggio 1: ottieni un nome di dominio e hosting

Il primo passo per costruire il tuo sito personale è scegliere come ospitarlo. Esistono diversi modi per creare un sito Web. Per esempio, si potrebbe semplicemente creare un blog libero a Weebly o WordPress.com, o addirittura Tumblr.

Tuttavia, credo che sia molto più impressionante avere un sito self-hosted con un nome di dominio effettivo (non un sottodominio). Questo sembrerà molto più legittimo e mostrerà che hai preso il tempo per imparare a costruire un sito Web, che può differenziarti dalla massa.

Non sono l’unico che la pensa così. Uno dei miei imprenditori preferiti, Srinivas Rao , ha dato questo consiglio agli aspiranti blogger:

“Se vuoi essere preso sul serio, assicurati di avere un blog WordPress ospitato da solo.”

Quindi, mentre dipende da te alla fine, consiglierei di ospitare il tuo sito da solo. Tuttavia, avere un sito gratuito su WordPress.com o un altro posto se hai un budget limitato è molto meglio che non avere affatto un sito!

Ora, prima di addentrarci in tutte le cose grintose e dettagliate passo-passo, c’è una cosa che voglio che tu pensi prima: il tuo nome di dominio. E la prima regola di scegliere un nome di dominio è …

Non registrare SailorMoonFreak94435.biz, manichino.

Non posso sottolineare abbastanza: hai bisogno di un buon nome di dominio. Cosa rende un buon nome di dominio? Per un sito Web o portfolio personale, consiglierei di attenermi ai seguenti criteri.

Come scegliere un nome di dominio eccezionale

Innanzitutto, se è possibile, imposta il tuo nome di dominio con il tuo nome + il tuo cognome.com. Questa è davvero l’opzione migliore per la memorabilità e il SEO (ovvero quanto in alto ti mostri in Google).

Se hai un nome comune (come faccio io), probabilmente sarà già preso. Certamente non sono riuscito a trovare thomasfrank.com, quindi ho dovuto andare con thomasjfrank.com . Se il tuo nome viene preso, puoi inserire un’iniziale seconda o forse anche il tuo secondo nome completo se non allunga troppo il dominio.

Puoi anche usare un gioco intelligente sul tuo nome se nessuna delle precedenti funzioni. Ad esempio, il mio nome utente Instagram è TomFrankly , quindi ho anche registrato tomfrankly.com .

Non usare numeri nel tuo nome di dominio e usa trattini solo se assolutamente necessario.

Quando si tratta di estensioni di dominio:

  • Usa:  .com (preferibile), .me, .org, .co
  • Evita:  .info, .biz e tutto ciò che sembra poco professionale

Al giorno d’oggi ci sono anche molte nuove strane estensioni di dominio, come .limo e .pizza – ma la mia opinione è che andare con un’estensione più consolidata e riconoscibile ti aiuterà a evitare di confondere le persone.

Soprattutto, assicurati che l’ortografia del tuo dominio sia molto facile da correggere per qualcuno che lo sta sondando. In questo modo, sarai in grado di menzionare facilmente il tuo dominio in una conversazione occasionale e la persona con cui stai parlando sarà in grado di trovarlo senza preoccuparti dell’ortografia.

Quindi, una volta che hai pensato a un buon nome di dominio, iniziamo l’intero processo di costruzione del sito Web ottenendo il tuo dominio e il tuo hosting.

È ora di ottenere un nome di dominio e un hosting Web.

In passato dovevi comprare il tuo nome di dominio separatamente dal tuo web hosting. Ora, tuttavia, puoi ottenerli dallo stesso posto, nello stesso momento. Acquistarli separatamente è ancora un’opzione, ma è molto più facile metterli insieme.

Userò il metodo combinato in questo tutorial per mantenere le cose semplici; tuttavia, puoi sempre metterti in contatto con me se desideri aiuto per configurarli separatamente (o per qualsiasi altra cosa).

Nota per il tuo portafoglio:  questa è l’unica parte del processo che ti costerà denaro. L’hosting non è gratuito. Tuttavia, non deve essere nemmeno così costoso – e credo che il piccolo costo valga la spinta che un sito Web dà al tuo marchio personale e alla tua credibilità.

Ci sono letteralmente milioni di opzioni per il web hosting là fuori. Puoi andare con un account condiviso, un VPS o impazzire e pagare per il tuo server dedicato.

Potresti persino diventare fanatico e ospitare il tuo sito dal tuo computer, anche se non lo consiglio poiché probabilmente non vuoi affrontare i rischi di sicurezza legati all’esecuzione di un server Web e ogni volta che il tuo computer viene spento (ad es. durante le interruzioni di corrente e quando devi uscire dal tuo dormitorio), il tuo sito andrà in giù. Tuttavia, è un’opzione.

Dato che probabilmente sei uno studente universitario e, come me, non stai nuotando in un caveau pieno di soldi, suppongo che tu voglia solo qualcosa di economico che funzioni.

Con questo in mente, ti consiglio di ottenere il piano di hosting condiviso di base da HostGator . (Ancora una volta, divulgazione completa, farò una commissione se acquisti attraverso questo link – se scegli di farlo, grazie!)

Ci sono molti buoni host là fuori, quindi HostGator non è certamente l’unico che puoi usare; tuttavia, ho ospitato tutti i miei siti attraverso di loro per oltre tre anni e sono sempre stato più che soddisfatto perché:

  • I loro piani sono piuttosto economici (e, in particolare, meno costosi dei piani premium di aziende come Squarespace e Wix)
  • Ottieni un nome di dominio gratuito (a condizione che sia un .com, .org o .net, sei un nuovo cliente e ricevi un piano di 12 mesi o più)
  • Non c’è quasi mai alcun tempo morto
  • Adoro avere opzioni di installazione rapida per l’installazione di costruttori di siti Web come WordPress (cosa useremo in questa guida)
  • Il loro supporto è semplicemente tosto

Una volta, avevo bisogno di un’oscura impostazione del server PHP modificata per un progetto scolastico, ed era qualcosa che i loro tecnici di livello 1 non potevano fare per me.

Quindi, entro 20 minuti dalla mia richiesta, uno dei loro amministratori di sistema di livello superiore non solo ha cambiato l’impostazione, ma mi ha anche inviato uno screenshot delle directory e dei comandi che usava per farlo nel caso in cui dovessi farlo su un altro server in il futuro.

HostGator, il mio host web preferito.
HostGator, il mio host web preferito. (Ancora una volta, farò una commissione se acquisti tramite questo link – se scegli di farlo, grazie!)

Puoi anche ottenere uno sconto abbastanza buono.

Da quando sono con loro da diversi anni e sto dirigendo questo tutorial per studenti attenti al budget, ho chiesto se potevo collaborare con loro per offrire uno sconto. Hanno detto di sì, ecco perché vedrai la mia tazza barbuta sulla pagina quando fai clic.

Quindi, usa il codice coupon COLLEGEINFOGEEK per ottenere il  50% di sconto sul tuo acquisto iniziale di hosting (o anche il 62% di sconto se scegli un piano di 3 anni).

Questo è in realtà un risparmio del 30-40% in più rispetto a quello che otterresti con il codice coupon predefinito che ti danno, quindi usalo sicuramente se scegli di utilizzare HostGator. (Se hai fatto clic su uno dei link di iscrizione sopra, il codice dovrebbe essere inserito automaticamente.)

Quindi si Questo tutorial presuppone che tu stia utilizzando HostGator; tuttavia, se scegli un altro host, queste istruzioni dovrebbero essere abbastanza simili a quelle che devi fare.

Vai su HostGator e fai clic sul pulsante grande che dice “Inizia subito”. (Ancora una volta, farò una commissione se acquisti tramite questo link – se scegli di farlo, grazie!)

Inizia il tuo viaggio scegliendo il  piano di tratteggio,  che è il più economico ed è tutto ciò di cui hai bisogno se stai solo costruendo un singolo sito web.

Selezione del piano di tratteggio nel modulo d'ordine
Seleziona il piano di tratteggio.

Successivamente, ti consigliamo di scegliere un nome di dominio. Supponendo che non ne possiedi già uno, segui la scheda predefinita Registra un nuovo dominio  e digita quello che desideri vedere se è disponibile. Se lo è, vedrai una schermata come quella qui sotto! In caso contrario, modificalo un po ‘finché non ne trovi uno che non è stato preso.

Inoltre, se scegli un piano di hosting di 12 mesi o più, sarai in grado di ottenere il tuo dominio gratuitamente per un anno . Ci sono alcuni avvertimenti: è solo per i domini .com, .net e .org, devi essere un nuovo cliente e devi acquistarlo contemporaneamente all’acquisto del tuo hosting, ma è comunque un ottimo affare.

Registrazione di un nuovo dominio.
Registrazione di un nuovo dominio.

Sotto tutte le opzioni di estensione del dominio, vedrai un’opzione per aggiungere  la protezione della privacy del dominio. 

Questo è un servizio che impedisce al tuo nome, indirizzo e numero di telefono di apparire nelle ricerche WHOIS. Molte persone non conoscono WHOIS, ed era il caso che si potesse cavarsela senza averlo.

Oggi, tuttavia, agli spammer piace scrivere robot che cercano nuovi domini nel database WHOIS e quindi inviano e-mail di spam alle persone che li hanno registrati.

L'opzione Protezione privacy dominio.
L’opzione Protezione privacy dominio.

Di conseguenza, la protezione della privacy del dominio è qualcosa che consiglio di aggiungere. Tuttavia, è anche un’opzione che puoi aggiungere al tuo account in seguito, quindi se non lo fai ora (o ti sei già registrato e hai dimenticato di includerlo), non sei sfortunato.

Quindi, scorri verso il basso e completa le prossime sezioni:

  • Conferma che il  pacchetto Hatchling  è selezionato e scegli per quanti mesi di hosting desideri iniziare. Raccomando almeno  un anno .
  • Scegli un  nome utente  e  un perno di sicurezza.
  • Inserisci la tua spazzatura personale e di fatturazione.
Il piano di tratteggio dovrebbe essere selezionato.  Raccomando di ottenere almeno un anno.
Il piano di tratteggio dovrebbe essere selezionato. Raccomando di ottenere almeno un anno.

Successivamente, vedrai una sezione per  i componenti aggiuntivi di hosting. Onestamente, non penso che tu abbia bisogno di nessuno di questi, incluso il componente aggiuntivo del certificato SSL.

Per essere chiari, io fare che si dovrebbe avere SSL. Ciò consentirà al tuo sito di avere quella piccola icona di blocco “Sicuro”, che probabilmente puoi vedere nella barra degli indirizzi per questo sito. Avere quello lì rende il tuo sito più affidabile per i visitatori.

Tuttavia, se leggi la stampa fine sotto il componente aggiuntivo, vedrai che HostGator include già un certificato SSL gratuito. Il componente aggiuntivo è solo un certificato SSL “aggiornato” che è totalmente inutile.

Quindi puoi lasciare tutte le caselle deselezionate per risparmiare qualche soldo. Nella sezione Plugin, ti mostrerò alcuni modi in cui puoi proteggere il tuo sito, eseguirne il backup regolarmente e più probabilità di mostrarti altamente nei risultati di ricerca di Google (o “ottimizzato per il SEO”, come diciamo noi appassionati di web) – tutto gratis.

Componenti aggiuntivi di hosting.  Non penso che tu abbia davvero bisogno di nessuno di questi, tranne SSL - che è pre-controllato e gratuito!
Componenti aggiuntivi di hosting. Non penso che tu abbia davvero bisogno di nessuno di questi.

Infine, rivedi il tuo ordine per assicurarti che tutto sia copacetico e verifica che il codice COLLEGEINFOGEEK  sia lì per ottenere uno sconto fino al 62% – il 42% in più rispetto al loro codice predefinito ti dà

🙂

Inserimento del codice coupon: utilizzare "COLLEGEINFOGEEK" per ottenere uno sconto fino al 62%.Infine, premi il grande pulsante blu per creare il tuo account.

Controlla il tuo ordine, quindi crea il tuo account.
Controlla il tuo ordine, quindi crea il tuo account.

Una volta effettuato il pagamento, riceverai un’e-mail che contiene ” Informazioni sul tuo account” nel link dell’oggetto – che avrà tutte le informazioni necessarie per continuare.

Passaggio 2: installa WordPress e configura il tuo sito

È ora di iniziare a costruire il tuo sito.

Come ho detto all’inizio, utilizzerai uno strumento chiamato  WordPress  ( self-hosted , non WordPress.com) per configurare il tuo sito. Potresti aver sentito che WordPress è principalmente una piattaforma di blog, il che è completamente vero.

Tuttavia, negli ultimi anni WordPress è diventato così popolare e ben supportato che rende una piattaforma perfetta anche per la creazione di siti non blog.

WordPress è famoso per l’ installazione in soli 5 minuti ; Dico che è troppo lungo. Facciamolo in 2, vero?

Una delle cose migliori di  HostGator sono le opzioni di installazione rapida per quasi tutti i CMS (Content Management System) popolari. Naturalmente ne hanno uno per WordPress. Prepariamolo. (Ancora una volta, farò una commissione se acquisti tramite questo link – se scegli di farlo, grazie!)

Per iniziare, digita questo URL nel tuo browser (ma sostituisci “yourcoolnewdomain” con il nome di dominio del tuo sito Web): yourcoolnewdomain.com/cpanel .

Se per qualche motivo non riesci ancora a raggiungere il tuo dominio (a volte può volerci un po ‘di tempo per configurarlo), usa il link che ti è stato fornito nella tua email di HostGator elencato Il tuo pannello di controllo.

Accedi con il nome utente e la password che ti sono stati forniti nell’e-mail.

Ora guarderai il tuo pannello di controllo. Per installare WordPress, cerca nella sezione “Essentials” e trova il link per il programma di installazione di WordPress .

Facendo clic sul programma di installazione di WordPress nel cPanel di HostGator.
WordPress Installer – uno strumento che ti aiuterà a installare automaticamente WordPress in pochi secondi.

Nella pagina che viene visualizzata, seleziona il nome del tuo dominio dal menu a discesa. Dovrebbe essere l’unica opzione elencata.

Assicurati di lasciare vuoto il campo della directory : in questo modo, la tua home page verrà impostata sul tuo dominio (cioè yourcoolnewdomain.com) anziché su una sottocartella.

Installazione di WordPress - Selezione dominio
Seleziona il tuo dominio dall’elenco a discesa.

Quindi compila il modulo nella pagina successiva in questo modo:

  1. Scegli un  titolo del blog. Se stai creando un sito web personale, usa il tuo nome. Questo può essere cambiato in seguito.
  2. Scegli un nome utente amministratore . Non usare “admin”, poiché non è sicuro (poiché è comunemente usato). Qualcos’altro va bene🙂
  3. Inserisci il tuo nome e cognome: questi possono anche essere modificati in seguito, se necessario.
  4. Inserisci un indirizzo  email amministratore. Assicurati che sia quello che usi.
  5. Seleziona entrambe le caselle sotto i campi di testo.
  6. Fai clic su  Installa ora.
Installazione di WordPress - Nome utente e dettagli del sito
Completamento del processo di installazione.

Una volta fatto, dovresti vedere un grande segno di spunta verde e le parole “Installazione completata”. 

Dovresti anche vedere una sezione intitolata  Dettagli di installazione. Qui troverai il tuo nome utente WordPress e una password generata. Assicurati di memorizzarli per riferimenti futuri.

Installazione di WordPress completata
Trova il tuo nome utente e password WordPress qui.

Sotto i dettagli dell’installazione, vedrai alcune offerte per temi premium che puoi utilizzare. Consiglierei di ignorarli: ti indicherò alcuni  fantastici  temi gratuiti più avanti in questa guida. In effetti, il mio sito Web personale è basato su un tema gratuito.

Ora dovresti avere un’installazione WordPress perfettamente funzionante! Se visiti il ​​tuo sito in questo momento, vedrai una pagina “Sito Web in arrivo” – che andrà via e sarà sostituita dal tuo nuovo sito Web una volta effettuato l’accesso al Dashboard di WordPress e avviarlo.

Per accedere alla Dashboard, digita  yourcoolnewdomain.com/wp-admin  nel tuo browser  : è qui che farai tutto il resto relativo alla costruzione / personalizzazione del tuo sito. Probabilmente sarebbe una buona idea aggiungere quel link ai segnalibri!

URL amministratore di WordPress
Aggiungi “/ wp-admin” al tuo dominio per raggiungere la dashboard di WordPress.

Nota: a volte può essere necessaria fino a un’ora per la configurazione dell’account da parte dell’host web. Mentre sarai in grado di accedere immediatamente a cPanel, il tuo dominio potrebbe non essere accessibile per quell’ora o giù di lì. Puoi leggere di più su questo qui .

Configurare il tuo sito

Normalmente, WordPress non tiene alcuna mano; una volta effettuato l’accesso alla Dashboard, hai accesso a tutti gli strumenti e spetta a te capire cosa fanno tutti.

Tuttavia, la versione di WordPress installata dallo script cPanel di HostGator viene fornita con una breve procedura guidata che può guidarti attraverso il processo di impostazione di alcune cose. Ma non lo useremo.

La procedura guidata potrebbe essere utile per alcune persone, ma contiene alcuni passaggi che configureranno cose di cui non credo tu abbia bisogno, come un indirizzo commerciale. Inoltre, è utile capire come funziona la dashboard di WordPress, quindi configureremo tutto manualmente. Non ti preoccupare, non è troppo lavoro

🙂

Per iniziare, fai clic sul link “Non ho bisogno di aiuto” sotto i  pulsanti Affari e  Personale .

Dashboard di WordPress: fai clic su "Non ho bisogno di aiuto".
Fai clic su “Non ho bisogno di aiuto”: lo faremo manualmente in modo da capire ogni passaggio.

Quindi, ci prendiamo un minuto per pulire la casa. Insieme alla procedura guidata, la versione di WordPress di HostGator viene preinstallata con alcuni plug-in di cui non hai bisogno o che sono inferiori a quelli che ti consiglierò un po ‘più avanti nella guida. Eliminiamoli per mantenere le cose semplici e pulite.

  • Sul lato sinistro della Dashboard fai clic su  Plugin.
  • Seleziona la casella accanto a  Jetpack di WordPress.com,  MOJO Marketplace  e  l’API OptinMonster.
  • Fai clic sul menu a discesa con l’etichetta  “Azioni in blocco”  e seleziona  Disattiva. Premi Applica.
  • Ora, seleziona la casella accanto a tutti i plugin,  tranne Akismet.
  • Fai di nuovo clic sul menu a discesa Azioni in blocco e seleziona  Elimina. Premi Applica.
Eliminazione di plugin predefiniti
Eliminazione dei plugin predefiniti

Che cos’è Akismet, chiedi? Akismet è un plug-in che aiuta a mantenere le sezioni dei commenti del blog libere da spam. Se decidi di aggiungere un blog al tuo sito Web (che è davvero facile con WordPress) e desideri abilitare i commenti sui tuoi post, Akismet ti tornerà utile. In caso contrario, puoi sempre tornare più tardi ed eliminarlo.

Attivazione SSL sul tuo sito

Prima di aggiungere qualsiasi contenuto al tuo sito, vorrai passare attraverso la rapida procedura di attivazione del certificato SSL gratuito del tuo sito.

In questo modo i visitatori finiranno automaticamente sul sicuro ” https: // yourcoolnewdomain.com”  piuttosto che sul non sicuro  ” http: // yourcoolnewdomain.com”.  

Se questa differenza non significa nulla per te, beh … tutto quello che devi sapere è che farlo rende il tuo sito più affidabile e sicuro. Ad esempio, se cerchi nella barra degli indirizzi di questo sito, probabilmente vedrai  un’icona a forma di lucchetto  o la parola ” Sicuro ” accanto all’URL del mio sito.

Esempio SSLEcco perché ho un certificato SSL attivo per il mio sito. Senza quello, la barra degli indirizzi direbbe  “Non sicuro”. Se ti interessa saperne di più, consulta l’articolo di Google sul motivo per cui HTTPS è importante .

Fortunatamente, HostGator include un certificato SSL gratuito con il tuo account, quindi tutto ciò che devi fare è attivarlo sul tuo sito WordPress.

E – ancora più fortunatamente – è davvero facile da fare,  purché lo faccia prima di aggiungere qualsiasi contenuto al tuo sito.

(Se hai già aggiunto contenuti al tuo sito per qualche motivo, la speranza non è persa. Tuttavia, questo processo potrebbe essere un po ‘più coinvolto. Consulta questo articolo per un processo passo-passo per affrontare le complicazioni che potrebbero presentarsi .)

Quindi, prima di iniziare a costruire il tuo sito, facciamo una cosa veloce. Se non ci sei già, vai  nell’area Plugin  della tua Dashboard:

  • Fai clic su  Aggiungi nuovo.
  • Cerca  SSL davvero semplice. Questo è un plugin che abiliterà automaticamente SSL sul tuo sito.
  • Installa il plug-in, attivalo, quindi fai clic sul pulsante che viene visualizzato in seguito per attivare completamente SSL.

Questo è tutto!

(Nota: l’attivazione gratuita del certificato SSL può richiedere fino a 24 ore sul tuo account dopo l’acquisto dell’hosting. Se SSL Really Simple non funziona all’inizio, prova ad attendere 24 ore e quindi a riattivarlo. In questo caso, puoi comunque creare in sicurezza nuove pagine e aggiungere del testo nel frattempo – ti consiglierei di attendere il caricamento di qualsiasi immagine fino a quando Really Simple SSL sarà attivo.)

SSL davvero semplice
Il plug-in SSL davvero semplice.

Ora, prima di sporcarci le mani con l’attività di creazione di pagine e tutto il resto, prendiamoci qualche minuto per avere un’idea del dashboard di WordPress.

Conoscere WordPress

WordPress è un sistema abbastanza facile da usare e navigare. Tuttavia, vorrei ancora darti una rapida panoramica di ciò che è disponibile per te.

Ecco uno scatto di ciò che dovresti vedere quando accedi:

Una panoramica della dashboard di WordPress
La dashboard di WordPress – dove tutto il lavoro viene svolto

Il grande messaggio di benvenuto nel mezzo è lì per aiutarti quando inizi per la prima volta, quindi è bene verificarlo. Sotto questo messaggio ci sono un sacco di widget, ma non dovrai fare molto con loro in questo momento.

Quello che vorrei esaminare sono i collegamenti nella barra laterale: queste sono tutte le funzioni principali di WordPress. Passa il mouse su ciascuno di questi link per visualizzare ulteriori opzioni. Inoltre, quello attivo mostrerà le sue opzioni aggiuntive per impostazione predefinita proprio sotto di esso.

  • Dashboard : la “base di casa” di WordPress. Questo è ciò che hai visto quando effettui l’accesso e contiene tutti i widget che hai scelto di mostrare su di esso.
  • Messaggi: il cuore e l’anima di WordPress. Questo è dove andrai quando vuoi scrivere un post sul blog o modificarne uno esistente.
  • Media: un archivio centrale per qualsiasi immagine, file audio, video e altri elementi multimediali caricati sul tuo sito. Qui puoi sfogliare e modificare i contenuti multimediali che hai caricato nei tuoi post e caricare ancora di più.
  • Pagine: qui puoi creare Pagine, che è ciò che utilizzerai per i contenuti principali del tuo sito. Le pagine sono diverse dai Post perché verranno visualizzate nella navigazione principale del tuo sito invece di andare sul tuo elenco di post di blog. Questo rende le pagine utili per contenuti “senza tempo” come la tua biografia, la storia del lavoro e le informazioni di contatto.
  • Commenti:  qui puoi vedere i commenti sul tuo blog (se decidi di averne uno).
  • Aspetto: è qui che puoi personalizzare l’aspetto del tuo sito. Esistono opzioni per il tema, i menu e i widget del tuo sito che desideri visualizzare. C’è anche un rudimentale editor di codice, ma non è molto buono. Se stai arrivando al punto in cui desideri modificare manualmente il tema del tuo sito, ti consiglio CodeAnywhere .
  • Plugin: è qui che puoi aggiungere e gestire i tuoi plug-in, che sono come piccole app che possono dare al tuo sito nuove funzionalità. Ci sono un numero di plugin fantastici che dovresti usare, ma ci arriveremo un po ‘più tardi.
  • Utenti : qui puoi gestire i profili utente sul tuo sito. Dal momento che questo è un sito personale, l’unico che dovrebbe essere qui è il tuo.
  • Strumenti : per impostazione predefinita, le uniche cose qui sono le opzioni di importazione / esportazione, il Presslet questo bookmarklet e un convertitore Categorie / Tag. In questo momento, non avrai bisogno di nessuno di questi.
  • Impostazioni: questa sezione contiene tutte le impostazioni generali per il tuo sito. Ci sono molte cose qui.

Ora che sai cosa fa cosa, dovresti avere più tempo a navigare in WordPress e creare il tuo sito.

Prima di iniziare a creare le tue pagine, tuttavia, prendiamoci cura di un paio di cose importanti!

Quando crei una  pagina, WordPress fa in modo che l’URL rifletta il titolo della pagina. Ad esempio, una pagina intitolata “Contatti” otterrebbe un URL come yourcoolnewdomain.com/contact. Questo è quello che vuoi.

Tuttavia, per impostazione predefinita WordPress non lo fa per i post sul blog. Invece, crea questi brutti URL numerici come yourcoolnewdomain.com/?p=123. Questi URL non significano nulla: è molto meglio fare in modo che il titolo del tuo post sul blog sia l’URL.

Per fare ciò, è necessario modificare la struttura del permalink. Questo è piuttosto semplice:

  1. Passa il mouse su Impostazioni e fai clic su Permalink.
  2. Scegli l’opzione per Nome post.
  3. Salva le tue modifiche.
Impostazione dei permalink
Scegli l’impostazione permalink Nome post.

Ora gli URL dei tuoi post sul blog saranno molto più memorabili.

Ora che hai finito di occuparti di quei piccoli dettagli, è tempo di creare le tue pagine e ottenere i tuoi contenuti sul Web !

Impostazione della struttura della pagina

Se ricordi dalla sezione che dettaglia ogni parte di WordPress, le pagine vengono utilizzate per contenuti senza tempo come la tua biografia e le informazioni di contatto. Queste pagine verranno visualizzate nella navigazione di livello superiore del tuo sito o nella navigazione di secondo livello se decidi di creare pagine secondarie.

Dai un’occhiata alla navigazione del mio sito ancora una volta per avere un’idea di ciò che stai cercando qui:

La struttura di navigazione del mio sito attuale.
Il menu principale del mio sito attuale .

Poiché il mio attuale sito Web personale utilizza principalmente un design a una pagina (facendo clic sui collegamenti si passa semplicemente alla sezione corrispondente della pagina), puoi anche dare un’occhiata a uno dei miei precedenti progetti di siti Web, che utilizzava un approccio a più pagine:

La struttura di navigazione del sito che ho usato al college.
Il menu principale sul mio sito Web precedente.

Mentre osservi questi due diversi approcci, potresti chiederti:

“Dovrei scegliere un design a una o più pagine?”

Questo dipende da te, ma ciò che dovresti tenere a mente quando decidi è che il lavoro n. 1 del tuo sito è mostrare il tuo lavoro e le tue competenze . Meglio lo fa, più è probabile che le persone vorranno assumerti o lavorare con te.

Se studi il mio sito attuale, vedrai che la maggior parte delle mie sezioni principali si collegano ad altri luoghi del Web: il mio canale YouTube , i miei podcast, la pagina parlante qui su College Info Geek, ecc. Questa è una decisione strategica – come YouTuber / scrittore professionista, questi sono i  posti migliori  in cui dirigere le persone, dal momento che traggo beneficio dalle persone che si iscrivono ai miei contenuti piuttosto che valutarli.

Quando ero uno studente, tuttavia, la mia priorità era quella di  essere assunto. Di conseguenza, andare con un design multipagina mi ha dato un modo per dare ai potenziali datori di lavoro  uno sportello unico  per vedere il mio curriculum, la mia biografia e uno sguardo dettagliato al mio miglior lavoro.

Quindi chiediti:  qual è lo scopo del mio sito Web? Chi è il pubblico previsto? Usa queste informazioni per guidare la tua decisione.

Se sei uno studente, è probabile che la tua priorità principale venga assunta o selezionata per borse di studio / opportunità di ricerca / ecc. Penso che un design multipagina funzioni meglio per questi scopi. Alla fine, però, è la tua scelta!

Detto questo, qui ci sono alcune pagine / sezioni che penso dovrebbero essere assolutamente incluse da qualche parte sul tuo sito se stai cercando di essere assunto. Questi includono:

  • Una breve  pagina su di me , che imposterai come pagina iniziale
  • Una pagina di biografia più dettagliata
  • Un Riprendi pagina in cui è possibile elencare la vostra formazione, il lavoro, ecc (ricordo come ho detto io odio curricula? Avere il tuo curriculum sulle correzioni di sito web tutte quelle cose che odio)
  • Una pagina di contatto che dice alle persone come possono mettersi in contatto con te. Potrebbe anche avere un modulo di contatto. Nota: non consiglio di elencare pubblicamente il tuo indirizzo e-mail, numero di telefono o indirizzo fisico sul tuo sito – gli spammer possono facilmente prendere quelle informazioni. Un modulo di contatto, insieme a collegamenti ai tuoi profili social, è un’opzione molto migliore.

Altre pagine che potresti pensare di aggiungere, se sono applicabili alla tua vita:

  • Un portfolio per mettere in mostra qualsiasi tipo di lavoro tu abbia svolto – grafica, progetti di programmazione, scrittura – qualunque cosa. Sul mio sito precedente, ho creato un portfolio del mio lavoro Web usando un normale modello di pagina. Puoi creare il tuo in questo modo o puoi ottenere un tema con un modello di portfolio specifico. Dai un’occhiata al sito della mia ragazza Anna per un esempio.
  • Una pagina Assumimi . Ti consiglio vivamente di creare questa pagina, anche se al momento non stai cercando concerti a tempo pieno o freelance. Questa pagina dice alle persone cosa stai cercando di fare e può aiutarli a immaginare dove ti adatteresti meglio.
  • Un blog. WordPress è impostato per il blog per impostazione predefinita, ma imposterai la tua home page come pagina Chi sono statica . Pertanto, dovrai impostare il tuo blog manualmente, il che è ancora molto semplice. Puoi anche scegliere di lasciare il blog fuori se vuoi, ma penso che averne uno sia un ottimo modo per mostrare le tue conoscenze e pensieri. Ecco come ho implementato un blog sul mio sito personale.
  • Una pagina stampa , in cui è possibile elencare eventuali interviste o menzioni che hai ottenuto nei media. Controlla la mia pagina Stampa / Media per un esempio.
  • Una lista impossibile . Penso che creare una pagina come questa sia davvero divertente e possa aiutarti a consolidare i tuoi obiettivi di vita.

Se desideri una spiegazione più dettagliata delle pagine che dovresti includere, dai un’occhiata al mio post sui componenti essenziali del sito Web, che include anche alcuni esempi eccezionali di altri siti Web personali. (Vuoi ancora PIÙ esempi? Dai un’occhiata alla raccolta di 50 fantastici siti Web personali e portafogli che abbiamo pubblicato di recente.)

Sta davvero a te decidere quali pagine vuoi avere sul tuo sito. Ti mostrerò come creare la tua pagina Chi sono e puoi usare gli stessi passaggi per creare il resto.

Prima di farlo, però, dovresti eliminare la pagina di esempio e pubblicare che WordPress inserisce automaticamente sul tuo sito.

Per prima cosa, elimina il post di esempio andando su Post nella dashboard di WordPress. Trova il post intitolato “Hello World!” E fai clic su Cestino. 

Quindi vai su Pagine e fai la stessa cosa per la pagina intitolata Pagina di esempio.

Creazione della pagina “Informazioni personali”

La tua pagina su di me sarà la pagina di destinazione del tuo sito – il luogo che i visitatori vedranno per primo. Qui vorrai avere un breve riassunto di chi sei, di cosa stai studiando e di che lavoro fai. È anche bello avere una tua foto e forse anche alcune citazioni sul tuo lavoro da altre persone.

Creiamolo!

Dovresti già essere nella sezione Pagine della dashboard di WordPress. Trova il pulsante nella parte superiore che dice Aggiungi nuovo. Vedrai questa schermata quando fai:

Pagina vuota nell'editor di WordPressCome puoi vedere, creare pagine in WordPress è abbastanza semplice. Per iniziare la pagina Chi sono , inserisci prima un titolo nella barra del titolo. Probabilmente avrebbe senso intitolare questa pagina ” Chi sono” o “Informazioni su <il tuo nome>”. 

Successivamente, troverai l’area del corpo. Nella maggior parte dei casi, useresti questo spazio per inserire i tuoi contenuti. Tuttavia, a seconda del  tema  scelto (più su quello nel passaggio successivo), potresti inserire i tuoi contenuti altrove – quindi per ora, inserisci solo una o due frasi di esempio.

Dai un’occhiata ai diversi strumenti disponibili per la formattazione dei tuoi contenuti; come scoprirai, l’uso di WordPress non è poi così diverso dall’uso di Microsoft Word.

Opzioni di formattazione del testo di WordPressLa maggior parte di questi strumenti ti permetterà di formattare il testo, aggiungere collegamenti e così via. Puoi anche aggiungere immagini al tuo post creando un  blocco di immagini  .

Per fare ciò, posiziona il cursore nel punto del contenuto in cui desideri che appaia la foto. Quindi, fai clic  sull’icona “Più” a sinistra del contenuto e seleziona “Immagine” dall’elenco visualizzato.

Aggiunta di un blocco di immaginiOra, scegli una delle opzioni che appaiono.

Scegliere come aggiungere un'immagine
Normalmente, ti consigliamo di scegliere “Carica”.

Boom: hai una foto sulla tua pagina.

Una volta che hai la tua foto e del testo, vai avanti e premi Pubblica. Questo renderà la tua pagina attiva.

Nota: a partire dall’aggiornamento più recente di questa guida, l’editor di WordPress predefinito è ora Gutenberg . Abbiamo aggiornato i nostri screenshot per riflettere il nuovo editor, ma onestamente preferiamo ancora l’editor WordPress classico. Se sei curioso della differenza (e di come passare al tuo sito nell’editor classico), dai un’occhiata a questa guida .

Imposta la tua pagina “Informazioni personali” come pagina iniziale

A questo punto, la tua pagina Informazioni personali dovrebbe essere simile a questa:

Chi sono Pagina con tema predefinito
Come apparirà la tua pagina con l’attuale tema predefinito di WordPress.

Tuttavia, WordPress mostrerà la sezione del tuo blog come pagina iniziale per impostazione predefinita anziché questa pagina.

Poiché si tratta di un sito personale anziché di un blog, è consigliabile che questa pagina sia la prima pagina visualizzata dai visitatori quando accedono al tuo sito. Impostiamolo come pagina iniziale:

  1. Nella barra laterale, passa con il mouse su Impostazioni  e fai clic su Lettura.
  2. Nella sezione Display della prima pagina , fai clic sul pulsante di opzione che dice Una pagina statica
  3. Scegli la tua pagina Chi sono per essere la home page.
  4. Se vuoi avere un blog, crea e pubblica una pagina vuota chiamata Blog e impostala come Pagina dei post.
  5. Salva le tue modifiche.
Impostazione di una pagina statica come pagina iniziale.
Impostazione della tua home page.

Ora, torna indietro alla sezione Pagine di WordPress e crea il resto delle tue pagine. Questo processo dovrebbe essere relativamente semplice; l’unico che può essere più complicato è la tua pagina di contatto .

Questa pagina può essere davvero facile da creare se tutto ciò che vuoi fare è link ai tuoi profili sui social media. Tuttavia, potresti anche voler collegare il tuo indirizzo email o aggiungere un modulo di contatto.

Rendere cliccabile il tuo indirizzo e-mail è davvero facile: evidenzia qualsiasi parte di testo (in questo esempio ho digitato l’e-mail [falsa], ma puoi usare qualsiasi testo), fai clic  sull’icona Link  (o premi CTRL / CMD + K) e digitare “mailto: whatevertheemailis@domain.com ” senza virgolette.

Tuttavia, tieni presente che rendere pubblico il tuo indirizzo e-mail consente a chiunque di inviargli e-mail, anche spammer e bot. Ecco perché preferisco usare un modulo di contatto.

Inserimento di un indirizzo e-mail in una pagina di WordPress.
Inserimento di un’e-mail cliccabile

Se decidi di aggiungere un modulo di contatto , hai due opzioni. Puoi trovare un tema con un modello di pagina di contatto integrato oppure puoi usare qualsiasi tema tu voglia e aggiungere un modulo di contatto usando un plugin. Ad ogni modo, è davvero facile. Tratterò la prima opzione nel passaggio 3 e la seconda nel passaggio 4.

Facoltativo: aggiunta di una pagina blog

Se desideri aggiungere una pagina di blog  al tuo sito, è ridicolmente facile.

Crea semplicemente un’altra nuova pagina sul sito chiamata “Blog” (o qualunque cosa tu voglia, non importa). Quindi sulla tua Dashboard torna su Impostazioni -> Lettura e imposta la pagina Post come quella pagina che hai appena creato.

Da lì, tutto ciò che devi fare è andare su Messaggi e iniziare a scrivere. Tutti i post del tuo blog pubblicati devono essere visualizzati nella pagina del blog.

Se desideri saperne di più sulla creazione di un  blog di successo  , assicurati di consultare la mia guida completa per la creazione di blog .

Ora sta venendo tutto insieme.

A questo punto, dovresti avere tutte le tue pagine impostate, supponendo che tu stia andando con una configurazione multi-pagina.

Ora è il momento di assicurarsi che i visitatori siano colpiti quando colpiscono il tuo sito. Diamo un’occhiata alla personalizzazione dell’aspetto del tuo sito.

Passaggio 3: personalizza il design del tuo sito Web con un tema

Una delle cose migliori di WordPress è la stupidamente grande quantità di temi disponibili per l’uso. Usando un tema, puoi cambiare l’aspetto del tuo sito senza dover conoscere alcun CSS o avere competenze di progettazione grafica.

Un tema è fondamentalmente un modello o skin per il tuo sito. Cambia l’aspetto mantenendo tutto il contenuto che hai creato.

Il primo passo per personalizzare l’aspetto del tuo sito è semplicemente trovare un tema che ti piace. Questo può essere più facile a dirsi che a farsi, a causa dell’enorme quantità di temi disponibili. Proverò ad aiutarti a sceglierne uno.

4 ottimi consigli a tema

Sono uscito e ho trovato quattro temi WordPress che penso funzionino bene per i siti personali. Tieni presente che ci sono letteralmente migliaia di temi là fuori, quindi questo è solo un punto di partenza.

Semplice

Tema WordPress semplice
Tema semplice

Questo è il tema che sto usando sul mio sito personale. È  incredibilmente  versatile, in quanto è un tema in stile costruttore che ti consente di personalizzare ogni pagina in larga misura. Inoltre, è  gratuito. 

Se non hai una forte preferenza per il tema o non sai da dove iniziare, Simple è la mia migliore raccomandazione. Ho anche creato un tutorial video approfondito che mostra come l’ho usato per creare il mio sito Web:

Oltre al tutorial, puoi anche consultare la documentazione ufficiale per ulteriori risposte alle domande che potresti avere.

verboso

Tema Verbosa
Tema Verbosa

Verbosa è un altro grande  tema gratuito  che ti dà molto spazio per personalizzare l’aspetto. Non è un tema in stile builder, quindi non puoi modificare la struttura  il più possibile con Simple, ma hai molte altre opzioni.

A mio avviso, Verbosa è più facile da imparare rispetto a Simple, che è un giusto compromesso per il suo livello di flessibilità inferiore.

Controlla la homepage del tema per aggiornamenti e documentazione.

Lovecraft

Tema di Lovecraft
Tema di Lovecraft

Lovecraft è, per ammissione, un tema per i blogger – ma con la sua grande tipografia, menu pulito e ampia area dell’immagine, potresti anche usarlo per creare un sito Web personale di bell’aspetto.

Ultra

Tema Ultra di Themify
Tema Ultra

A differenza dei tre temi precedenti che ho elencato qui, Ultra è un  tema premium  . Ciò significa che costa denaro – circa $ 50 mentre scrivo questo. Quindi perché pagare un tema quando ce ne sono così tanti gratuiti? In poche parole, è  flessibilità. 

Ultra è un tema creato da Themify, le stesse persone che hanno creato Simple, che è il tema gratuito che ho menzionato sopra. Mentre Simple è davvero molto flessibile, specialmente per un tema gratuito, Ultra fa un passo avanti.

Ad esempio, Ultra include 15 diversi stili di intestazione, il che significa che puoi posizionare il tuo logo e le voci di menu dove vuoi. Hai anche molta più scelta quando si tratta di colori, caratteri e layout di pagina predefiniti. Inoltre, c’è una funzione di portfolio che ti consente di mostrare facilmente il tuo lavoro.

Personalmente, trovo che il tema Semplice gratuito sia sufficiente per le mie esigenze. Se hai bisogno di funzionalità aggiuntive e ancora maggiore flessibilità, Ultra è la mia migliore raccomandazione. Nota: poiché Simple e Ultra sono realizzati dalle stesse persone e utilizzano le stesse basi, puoi iniziare con Simple e trasferire tutto ciò che hai creato su Ultra se ne hai bisogno.

Vuoi ancora più temi? Ecco alcuni posti fantastici in cui cercare:

Come ho detto, le opzioni del tema che hai sono letteralmente infinite. Esplora e trova qualcosa che ti piace! Inoltre, controlla se il tema che hai scelto ha un modello per una pagina di contatto. In tal caso, sarai in grado di creare un modulo di contatto senza utilizzare un plug-in.

Una volta trovato qualcosa che ti piace abbastanza, installiamolo.

Installa il tuo tema

Ovunque hai trovato il tuo tema, scaricalo sul tuo computer. Il tema verrà probabilmente in un file .zip . Guarda dentro questo file zip.

Se vedi file come index.php, header.php e footer.php in quella primissima cartella, sei a posto. Se scopri che quei file sono sepolti in sottocartelle, dovrai estrarre tutto e creare una cartella zip di qualunque cartella contenga quei file.

La maggior parte dei temi arriverà con la documentazione che ti dice come o anche se hai bisogno di farlo, quindi consulta quella per aiuto se ne hai bisogno.

Una volta che hai il file .zip finale , è il momento di installarlo.

  1. Nella dashboard di WordPress, passa con il mouse su Aspetto e fai clic su Temi.
  2. Fai clic sulla scheda in alto che dice Installa temi.
  3. Trova e fai clic sul link che dice Carica.
  4. Scegli il tuo file .zip e fai clic su Installa Ora.
  5. Assicurati che il tema sia stato installato correttamente e fai clic su Attiva.
Caricamento di un tema.
Caricamento di un tema.

Da questo punto in poi, non posso davvero illustrare la configurazione del tema in questo tutorial. I temi sono così diversi che sarebbe impossibile per me coprire tutto. Fortunatamente, la maggior parte dei buoni temi arriva con la documentazione che ti guiderà attraverso l’impostazione.

Dai un’occhiata allo strumento di personalizzazione

Quasi tutti i temi WordPress disponibili ti daranno alcune opzioni per personalizzare il logo, i colori e altre funzionalità del tuo sito. Alcuni temi potrebbero essere forniti in bundle con aree di menu speciali nella Dashboard per determinate impostazioni, ma la maggior parte della personalizzazione verrà eseguita nello Strumento di personalizzazione di WordPress integrato  .

Per accedervi, passa con il mouse su  Aspetto,  quindi fai clic su  Personalizza.

Dopo aver aperto lo strumento, vedrai un’anteprima dal vivo del tuo sito, insieme a una serie di opzioni a sinistra. Ogni tema includerà diverse opzioni, quindi dovrai giocarci da solo per vedere cosa è possibile con il tema che hai scelto.

Ecco un’idea di come appare:

Il personalizzatore di WordPress
Qui, ho cambiato il logo del mio sito usando lo strumento Personalizza.

Dopo aver apportato tutte le modifiche, fai clic su  Salva e pubblica  nella parte superiore del menu per rendere effettive le modifiche.

Ricorda: a seconda del tema, lo strumento Personalizza potrebbe non essere l’unica area in cui è possibile apportare modifiche! Ad esempio, il tema che sto usando sul mio sito web personale,  Simple  (linkato sopra), presenta un intero strumento per la creazione di pagine a cui è possibile accedere su  ogni  pagina.

Assicurati sempre di controllare la documentazione per il tuo tema in modo da sapere quali sono tutte le opzioni.

Imposta il tuo menu

Una cosa che esaminerò prima di passare alla sezione successiva: la funzionalità del menu personalizzato di  WordPress .

Da quando ho pubblicato questo tutorial, molte persone mi hanno chiesto come creare menu personalizzati sui loro siti. In particolare, volevano fare cose come:

  • Cambia l’ordine delle pagine nel loro menu
  • Crea voci di menu che verranno visualizzate per visualizzare più pagine correlate a una pagina principale

Chiedi e riceverai. Ho creato un breve video che ti guiderà attraverso l’intero processo di creazione di un menu personalizzato per il tuo sito.

Ora che hai il tuo tema, è il momento di modificare le cose un po ‘di più aggiungendo plugin e widget.

Passaggio 4: migliora il tuo sito con plugin e widget

Da solo, WordPress è un ottimo sistema con molte funzionalità. Tuttavia, la vera bellezza di WordPress sta nella sua capacità di lavorare con plugin: piccoli (o grandi) pezzi di codice impacchettato che aggiungono funzionalità al tuo sito.

Ci sono alcuni plugin che credo siano assolutamente essenziali per qualsiasi sito WordPress, e ancora di più che potresti voler installare anche.

L’installazione di plugin è piuttosto semplice. A differenza dei temi, quasi tutti i plugin di cui avrai mai bisogno sono conservati nel repository ufficiale dei plugin di WordPress. Pertanto, non è necessario caricare i file .zip: puoi effettivamente cercare plug-in direttamente dalla tua Dashboard e installarli! Per farlo:

  1. Nella dashboard di WordPress, passa con il mouse sopra Plugin e fai clic su Aggiungi nuovo.
  2. Cerca il plug-in che desideri. La funzione di ricerca non è sorprendente, quindi di solito otterrai i migliori risultati digitando il nome esatto del plugin che stai cercando.
  3. Fai clic su Dettagli per leggere il plug-in o Installa ora per installarlo.
  4. Dopo l’installazione, fai clic su Attiva.
  5. Se è necessaria un’installazione per il plug-in, occupati di esso.

Nota importante: i plugin funzionano direttamente con l’intestino della tua installazione di WordPress. È importante che tu stia discernendo su quali plugin scegli di installare sul tuo blog; assicurati di fidarti di ciò che stai installando.

Installazione plug-in
Qui è dove cercare e installare plug-in

Ti consiglio di cercare i plugin nella Directory dei plugin di WordPress prima di installarli. Se un plug-in ha una valutazione a stelle bassa, potrebbe essere rotto – o peggio ancora, potrebbe avere vulnerabilità di sicurezza che possono aprire il tuo blog agli attacchi. Stai attento là fuori, soldato.

Plugin essenziali

Ci sono alcuni plugin di cui non sarei preso morto senza su questi mari d’altura di Internet. Ti consiglio di usarli anche tu. Collegherò alla pagina del repository di ognuno, ma ricorda che puoi installarli direttamente dalla tua Dashboard semplicemente effettuando una ricerca.

  • Ninja Forms  – un plug-in per moduli di contatto semplice e facile da usare. Consulta la documentazione per istruzioni su come configurare tutto.
  • WP Super Cache – in poche parole, questo plugin renderà il tuo sito molto più veloce per i tuoi visitatori. Per impostazione predefinita, WordPress estrae informazioni dal suo database ogni volta che un visitatore carica una pagina. Questo plugin “memorizzerà” molte di queste informazioni, permettendole di essere caricate molto rapidamente senza la necessità di una chiamata al database.
  • UpdraftPlus –  probabilmente il miglior plug-in di backup del sito gratuito che abbia mai visto. Consente di eseguire manualmente il backup del database o dell’intero sito. Puoi anche impostare backup regolari e programmati (che consiglio) e inviarli a destinazioni remote come Dropbox, Amazon S3, e-mail, ecc.

Questi plugin sono solo la punta dell’iceberg. Se c’è qualcosa che vuoi fare con il tuo sito, probabilmente c’è un plugin che può aiutarti a farlo.

Bene, ora che hai installato i tuoi plugin, passiamo al bit finale: i widget.

Widgetize!

I widget sono elementi che è possibile posizionare su qualsiasi parte del tema che è stata “widgetizzata”, ovvero impostata per la visualizzazione dei widget. Esistono già alcuni widget visualizzati sul tuo sito per impostazione predefinita, come  Categoria, Post recenti  e  Meta  (anche se alcuni temi potrebbero non visualizzarli ovunque).

Per modificare i widget visualizzati sul tuo sito, segui questi passaggi:

  1. Nella dashboard di WordPress, passa con il mouse su Aspetto e fai clic su Widget.
  2. Sul lato destro dello schermo, vedrai tutte le aree del widget che sono state create per il tuo tema.
  3. Trascina i widget desiderati dall’area centrale nelle caselle corrette.
  4. Modifica le impostazioni specifiche del widget che devi modificare.

I widget vengono salvati automaticamente quando li trascini dentro o fuori da una casella. A proposito, è possibile utilizzare il plug-in Widget contesto se si desidera specificare determinate pagine su cui verrà o meno visualizzato un widget. Questo impedisce alle cose di diventare ridondanti.

L'area Widget della dashboard di WordPress.
Personalizzazione dei widget.

Poiché questo è un sito personale , ci sono alcuni widget specifici che potresti voler mostrare:

  • Collegamenti : se hai amici che hanno anche siti personali, può essere bello collegarli. L’ho fatto sulla barra laterale del mio precedente sito personale; è stato un ottimo modo per costruire una rete visiva di studenti imprenditori.
  • Testo – come si dice, questo è un widget per “testo arbitrario o HTML”. Puoi inserire qualsiasi cosa in questo elenco, a condizione che tu conosca un codice di codice. Ad esempio, potresti aggiungere una tua foto e una biografia super breve come ho fatto su questo sito. Oppure puoi incorporare i tuoi tweet utilizzando il widget profilo di Twitter . Ci sono molte possibilità qui.

Hai finito!

Ora dovresti avere un sito Web perfettamente funzionante! Hai creato tutte le tue pagine, i tuoi menu impostati, un tema fantastico, alcuni fantastici plugin e forse alcuni widget nella barra laterale.

Congratulazioni! Hai appena aumentato il tuo credito Internet di +1000 e allo stesso tempo sei diventato un candidato molto più attraente per qualsiasi lavoro che potresti desiderare.

Grande successo!
Molto bella! (Immagine di rodi su Flickr)

Ecco un breve elenco di cose da fare per assicurarti di ottenere il massimo dal tuo sito:

  • Più importante:  aggiungi il tuo URL nella parte superiore del tuo curriculum e, se stai visualizzando lavori sul tuo sito, considera di etichettarlo come “portfolio” in modo che i recruiter sappiano verificarlo.
  • Preparati dei biglietti da visita personalizzati e assicurati di includere il tuo URL su di essi
  • Inserisci il tuo URL nella tua biografia su Twitter
  • Aggiungi il tuo URL agli altri social network: Facebook, Pinterest, LinkedIn, Google+, ecc.
  • Inizia a pensare al tuo sito come alla tua “base operativa” online

A questo punto, puoi considerare il tuo sito “fatto”. Nel prossimo passaggio, illustrerò alcuni modi in cui puoi portare il tuo sito al livello successivo. Che tu decida di farlo o no, vorrei chiederti di fare una cosa …

Inviami l’URL del tuo nuovo sito su Twitter! Mi piacerebbe dare un’occhiata e vedere cosa sei riuscito a inventare.

Bene, quindi per quelli di voi che vogliono andare oltre, facciamo l’ultimo passo.

Passaggio 5 (facoltativo): migliora ulteriormente il tuo sito web

Lo scopo di questo tutorial era di portarti da zero ad avere un sito Web funzionante il più facilmente possibile. Tuttavia, puoi fare molto di più per ottimizzare design, velocità, SEO, sicurezza, navigazione, tipografia del tuo sito … le tue opzioni sono infinite.

Ecco perché voglio mostrarti alcune delle cose che puoi fare per portare il tuo sito al livello successivo. Ti indicherò anche alcune risorse che puoi utilizzare per iniziare!

SEO personale del sito web: assicurati di mostrarti in Ricerche Google

Una delle domande più comuni che mi vengono in relazione con la creazione di un sito Web è:

“Come posso visualizzare il mio sito nelle ricerche di Google?”

Questo ci porta al tema dell’ottimizzazione per i motori di ricerca o SEO. Ora sarò onesto: la SEO può essere un’attività complessa. Dopotutto, stiamo parlando del tentativo di rendere i nostri siti Web belli con un algoritmo incredibilmente complicato, che ha dettagli che Google tiene attentamente sotto controllo. Oh, e ovviamente, milioni e milioni di altri siti stanno cercando di fare la stessa cosa.

La buona notizia è che l’algoritmo di Google (così come gli algoritmi di altri motori di ricerca) è diventato molto,  molto  meglio nel tempo. La sua missione è sempre stata quella di fornire i risultati più  pertinenti  per ciò che una persona cerca, ed è diventato abbastanza bravo a farlo.

È anche molto più veloce  nell’indicizzazione di  nuovi siti che compaiono; quando ho iniziato a costruire siti Web, ricordo di doverli inviare manualmente ai motori di ricerca e quindi a volte aspettare  mesi  per vederli apparire. Ora, Google indicizzerà automaticamente il tuo sito, spesso in un paio di giorni.

Detto questo, voglio condividere alcune cose che puoi fare per migliorare il SEO del tuo sito web. Per semplificare le cose, adotteremo qui un approccio 80/20, poiché nell’80% dei risultati proviene dal 20% degli sforzi. Sì, ci sono molte piccole modifiche che puoi apportare per migliorare marginalmente il SEO – e se sei curioso di farlo, potresti voler dare un’occhiata a questo set di tutorial .

Quello che sto per raccomandare è una serie di tre semplici passaggi, che possono avere ciascuno un  grande  impatto:

  1. Avere i contenuti giusti sul tuo sito
  2. Ottieni collegamenti da altri siti autorevoli e altamente trafficati
  3. Assicurati che il tuo sito sia ottimizzato per dispositivi mobili

Cominciamo con il contenuto del tuo sito  web. Il modo principale in cui Google capisce cosa c’è sul tuo sito – e quindi quanto sia rilevante per i termini di ricerca di una persona – è piuttosto semplice:  legge il tuo sito! Google utilizza piccoli pezzi di codice chiamati  ragni  per “eseguire la scansione” del contenuto di Internet e indicizzarlo.

Di conseguenza, la domanda principale che devi porsi quando crei le pagine, i titoli e la biografia del tuo sito è:

“A cosa voglio essere associato?”

Chiaramente, la cosa principale a cui vuoi essere associato è il tuo  nome . Tuttavia, molte persone condividono lo stesso nome – in effetti, sono un ottimo esempio.

Sono Thomas Frank, ma Thomas Frank è anche un noto autore politico con diversi libri pubblicati, sottotitoli in siti Web e giornali di alto profilo e una voce di Wikipedia.

Fino a poco tempo fa, la sua fama ha assicurato che non mi fossi presentato da  nessuna parte  sulla prima pagina di Google quando hai cercato “Thomas Frank”!

Tuttavia …  se cercassi “Thomas Frank YouTube” o “Thomas Frank college”, mi  è  venuta in mente. Spesso prima.

Questo perché ho lavorato per associarmi a termini che descrivono la mia carriera, industria e interessi – e  mi sono assicurato che il mio sito Web li menzionasse. 

Ecco il primo paragrafo sul mio sito Web :

“Sono un autore, YouTuber e un oratore appassionato nell’aiutare gli studenti ad avere successo. Gran parte del mio lavoro oggi viene svolto presso College Info Geek, un sito che ho creato nel 2010 per condividere i miei esperimenti per diventare uno studente più efficace. “

Si noti che elenca l’  autore, YouTuber e le parole  “studenti” e  “college”. Google raccoglie questi termini e li inserisce nel suo algoritmo. Non garantiscono che classificherò molto per loro, ma aiutano.

Supponiamo che tu sia una graphic designer come la mia ragazza Anna. In tal caso, naturalmente vorrai menzionarlo sul tuo sito Web, idealmente sulla home page. Ma non limitarti a “graphic designer” – in cosa ti specializzi di cui potresti parlare? Può essere:

  • Illustrazione
  • Progettazione dell’interfaccia utente
  • Inviti di nozze

E la tua posizione? Se vivi a Portland e speri di ottenere un lavoro o un concerto freelance a livello locale, allora faresti bene ad elencarti come un “graphic designer e illustratore con base a Portland”.

In secondo luogo, è necessario comprendere il ruolo svolto  dai collegamenti di altri siti  nella classifica del proprio sito. Per dirla semplicemente, il tuo sito sarà classificato più in alto quando ha:

  1. Collegamenti da  molti  siti (se sono stati ottenuti in modo legittimo, non in modalità a pagamento o spam)
  2. Collegamenti da  siti autorevoli  (in genere siti con molto traffico o siti gestiti da istituzioni come governi o università)

Più un termine di ricerca è competitivo, più link autorevoli dovranno essere classificati per il tuo sito. Classificare per “baseball” sarebbe  davvero  difficile, mentre classificare per “gorilla ingoiare 18 baseball” sarebbe più facile (e sì, lo guarderei).

Ecco perché è importante collegarsi al tuo sito Web personale da altri siti, se possibile. Ciò comprende:

  • Siti web per i team di cui fai parte (organizzazioni scolastiche, ecc.)
  • Profili social – LinkedIn, Twitter, Goodreads, ecc.

Noterò che molti siti Web di social media sono impostati in modo da non consentire a un link sul tuo profilo di  aumentare direttamente  la tua classifica; tuttavia, assicurarsi di averlo lì può portare altre persone ad esso (poiché Twitter e LinkedIn hanno  molto  più traffico rispetto al tuo sito Web) e potrebbero finire per collegarsi ad esso da altri siti.

Se vuoi andare oltre, prendi in considerazione di scrivere articoli per gli ospiti per siti nel tuo settore o per il giornale della tua scuola. I collegamenti da questi siti possono aiutare, soprattutto se il tuo nome ha molta concorrenza come il mio!

Infine, desidero menzionare che  Google attribuisce un’alta priorità alla compatibilità con i dispositivi mobili. 

Oltre il 50% del traffico Internet proviene ora da telefoni cellulari e dispositivi mobili e Google lo ha notato. Fortunatamente, la maggior parte dei buoni temi di WordPress oggi sono ottimizzati per la reattività mobile immediatamente, il che significa che probabilmente non dovrai fare molto lavoro per assicurarti che il tuo sito sia ottimizzato per i dispositivi mobili.

Tuttavia, non sarebbe male controllare il tuo sito sul telefono dopo averlo creato per garantire che sia facile da navigare e leggere.

Aggiornamento del tuo cervello

Ho iniziato a costruire siti Web a 12 anni. All’inizio, stavo solo usando lo strumento di costruzione di siti Geocities della super vecchia scuola per trascinare e rilasciare elementi. È stato divertente, ma non è bastato. Alla fine ho scoperto che avevo bisogno di imparare un po ‘di codice e ho iniziato a insegnare a me stesso HTML.

Fortunatamente, il web è arrivato molto lontano negli ultimi anni. Con i sistemi di gestione dei contenuti come WordPress, chiunque può creare un bellissimo sito Web (come hai appena fatto) senza conoscere alcun codice.

Tuttavia, fare clic su WordPress può solo arrivare fino ad ora. Arriva un punto in cui vuoi portare il tuo sito al livello successivo e avrai bisogno di alcune conoscenze di sviluppo web per farlo. Con questo in mente, ecco alcune risorse che puoi usare per dare il via alla tua educazione allo sviluppo web.

Per mantenere le cose gratuite, attenersi a queste risorse online:

  • DevDocs – un  fantastico  wiki pieno zeppo di tutorial e riferimenti. Se sei uno studente basato sulla lettura, questo è un ottimo punto di partenza.
  • Mozilla Doc Center – un altro posto fantastico per imparare le basi. Preferisco i DevDocs, ma questa è un’ottima alternativa.
  • Codecademy – un sito che offre corsi interattivi su HTML, CSS, programmazione e altro. Sicuramente una buona scelta per coloro che imparano facendo.
  • Code Combat – un sito in stile videogioco super divertente che può insegnarti Javascript o Python.
  • Design Tuts : il posto dove andare se stai cercando di migliorare le tue capacità di progettazione grafica. Hanno un sacco di fantastici tutorial.
  • Codecourse  – un fantastico canale per guardare tutorial video gratuiti su tutti i diversi tipi di linguaggi di programmazione, incluso PHP, che è ciò che guida WordPress.
  • Tutorial per il Web design – parte dell’enorme rete Tuts + gestita da Envato. Ho collegato a una delle loro grandi serie per principianti.
  • Codice WordPress – la documentazione ufficiale di WordPress. Ci sono molti ottimi tutorial qui, oltre a un riferimento completo alle funzioni per quando inizi a diventare davvero geek.
  • Smashing Magazine – una straordinaria rivista online con articoli su ogni aspetto dello sviluppo web.

Un’altra risorsa che consiglio, ma che non è gratuita, è Lynda.com . Questo è un  sito fantastico da visitare se stai cercando corsi video su qualsiasi argomento di sviluppo web. In effetti, molte università offrono ai loro studenti abbonamenti gratuiti a questo sito. Chiedi al dipartimento IT della tua scuola di scoprire se il tuo è uno di questi.

Un’altra grande biblioteca di apprendimento basata su video è Treehouse . La loro biblioteca non è estesa come quella di Lynda, ma hanno ancora molto da offrire, specialmente nell’area dello sviluppo web. In realtà preferisco Treehouse  rispetto a Lynda, in quanto includono sfide e quiz sul codice con i loro progetti basati su video. In effetti, ho imparato a costruire un’app per iPhone in soli  due giorni  usando Treehouse. Sfortunatamente, devo ancora vedere le scuole che offrono abbonamenti gratuiti ai loro studenti, ma ciò non impedisce che te lo chieda!

Naturalmente, un altro ottimo modo per imparare lo sviluppo web è semplicemente guardare il codice. Se stai usando Google Chrome , puoi premere CTRL + U (o se sei su un Mac, vai su Visualizza -> Sviluppatore -> Sorgente ) per vedere l’HTML della pagina in cui ti trovi. Puoi anche utilizzare l’ estensione Web Developer per approfondire ulteriormente. Questo metodo non funzionerà per visualizzare codice lato server come PHP, ma è ottimo per scavare in HTML, CSS e Javascript.

Se sei uno studente di libri, ho alcuni consigli per la tua biblioteca:

  • HTML e CSS: progettare e costruire siti Web di Jon Duckett – un bellissimo libro che fornisce una grande introduzione alle basi dello sviluppo web. Questo è un ottimo punto di partenza per qualsiasi educazione allo sviluppo web.
  • Trainer di 24 ore di WordPress di George Plumley – se stai cercando un libro per iniziare WordPress. Onestamente, penso che tu possa imparare abbastanza bene usando il Codice e solo giocando con le cose. Se vuoi davvero un libro, però, questo è tutto.
  • WordPress professionale: progettazione e sviluppo  di Hal Stern – solo per i geek seri. Questo libro approfondisce WordPress. Compralo solo se sei interessato a scoprire come funzionano Core e Loop o come iniziare a creare temi e plugin.
  • Non farmi pensare di Steve Krug – la guida introduttiva all’usabilità del web. Un ottimo modo per imparare a rendere i siti Web utilizzabili e accessibili.

L’educazione allo sviluppo web è un campo enorme e non pretendo di poterlo coprire in un solo post. Queste risorse ti faranno iniziare, ma sappi che ce ne sono molte altre fantastiche là fuori. Uno dei modi migliori per imparare è semplicemente parlare con altri sviluppatori!

Aggiorna il tuo sito

Ora che ho studiato i modi in cui puoi imparare lo sviluppo web, completerò questo post con alcuni link che ti insegneranno cose specifiche che puoi fare per migliorare il tuo sito.

Ecco alcuni dei miei blog preferiti relativi a WordPress, che leggo regolarmente per imparare a rendere fantastici i miei siti :

E per iniziare, una cosa che potresti voler fare è  abilitare Google Analytics a tenere traccia delle statistiche dei visitatori (grazie a Shep McAllister per avermi ricordato di aggiungere questo)

Conclusione: dove andare da qui

Potresti non sentire il peso di quella parola, soprattutto se hai appena sfogliato questo articolo prima di iniziare. Per me, tuttavia, è fantastico guardare dopo aver trascorso oltre 15 ore a scrivere questo tutorial.

Si spera che ora abbiate un sito Web completamente funzionale e una conoscenza in erba e un interesse per lo sviluppo web. Se hai guadagnato una di queste cose, ho fatto il mio lavoro!

Ricorda, se hai bisogno di aiuto, puoi contattarmi . Ti aiuterò direttamente o ti indirizzerò verso persone o risorse che possono essere di aiuto. Puoi anche connetterti con me su Twitter senza bisogno di aiuto – mi piacerebbe conoscerti!

Puoi anche dare un’occhiata al nostro elenco di 50 fantastici esempi di siti Web personali se stai cercando idee su come migliorare ulteriormente il tuo sito.

In bocca al lupo!

Open

info.ibdi.it@gmail.com

Close