L'utilizzo di un sito Web reattivo non è più un'opzione per la creazione di siti Web. In parole povere, la progettazione di un sito web reattivo rende il tuo sito un bell'aspetto, indipendentemente dal dispositivo utilizzato dai visitatori per visualizzare e interagire con il contenuto.
Considerando che oltre l'80% delle persone possiede uno smartphone, è essenziale assicurarsi che il sito Web sia reattivo. Secondo le statistiche sul marketing mobile del 2016, il 57% degli utenti afferma di non consigliare un'azienda con un sito mobile mal progettato e l'88% dei consumatori che cercano un tipo di attività locale su un dispositivo mobile finisce per chiamare o andare a quello affari entro 24 ore.
Quando prendi in considerazione quanto sopra, è facile capire perché i contenuti del tuo sito web devono essere accessibili su una varietà di dispositivi. Per fortuna, rendere il tuo sito Web WordPress reattivo è facile grazie a una miriade di temi reattivi.
In questo tutorial ti mostreremo come scegliere un tema WordPress reattivo, come utilizzare un tema reattivo per il tuo sito e fornirti le risorse per saperne di più sul design reattivo e creare il tuo tema WordPress reattivo.
Quando decidi di trovare un tema reattivo per il tuo sito, ci sono alcune cose che devi considerare. A seconda del tuo settore, è importante scegliere un tema che non abbia solo un design accattivante ma funzioni necessarie che consenta ai tuoi visitatori di conoscere meglio la tua attività e passare da potenziali clienti a clienti paganti.
Ecco alcune cose chiave da cercare quando acquisti un tema WordPress reattivo per il tuo sito.
Quando si tratta di funzionalità, ti consigliamo di cercare un tema che abbia caratteristiche in linea con il tuo settore. Ad esempio, se sei un'agenzia creativa o un designer, ti consigliamo un tema che abbia la capacità di mostrare il tuo portfolio e le testimonianze dei clienti precedenti.
Se vendi prodotti, cerca un tema che si integri bene con un plug-in di e-commerce o ti consenta di visualizzare tabelle dei prezzi. Allo stesso modo, se ti affidi alla possibilità di prenotare i clienti dal tuo sito, cerca un tema che abbia un modulo di prenotazione incorporato.
Fortunatamente, ci sono molti temi WordPress specifici del settore che hanno tutte le caratteristiche necessarie e sono reattivi.
Ti consigliamo di cercare un tema che abbia opzioni di personalizzazione flessibili. Nella maggior parte dei casi, il tema viene fornito con un pannello delle impostazioni del tema che consente di personalizzare colori, caratteri, caricare il logo e molto altro. Se ti piace sperimentare con diversi layout, scegli un tema che si integra con un generatore di pagine o ha un modo alternativo di configurare diversi layout per le tue pagine.
Infine, cerca un tema che abbia un design accattivante simile a quello che vuoi che il tuo sito web guardi. Ciò elimina il tempo necessario per modificare o creare il layout delle tue pagine da zero e sarà più semplice personalizzarlo.
Una volta trovato un tema WordPress reattivo che ti piace, tutto ciò che devi fare è acquistarlo e scaricare il file zippato sul tuo computer. Scopri i temi reattivi di WordPress su ThemeForest o Envato Elements:
Ora che hai il tuo tema, è ora di iniziare a costruire il tuo sito web reattivo. Dovrai acquistare un nome di dominio e un piano di hosting in cui installerai WordPress e il tuo tema preferito.
È anche una buona idea preparare il contenuto che andrà sul tuo sito in modo da poter semplicemente copiare e incollare i contenuti quando è il momento di caricarlo, piuttosto che passare il tempo a cercarlo.
Il primo passo è acquistare un nome di dominio per il tuo sito web. Permetterà ai tuoi visitatori e clienti di trovare il tuo sito web sul web. Quindi, è importante scegliere un nome che rappresenti la tua attività o il tuo marchio. Se possibile, prova ad abbinare il tuo nome di dominio con un'estensione .COM. Puoi scegliere di nominare il tuo sito web come il nome della tua attività o puoi scegliere il tuo nome se stai costruendo un portfolio personale, un blog o un sito Web di curriculum.
Una volta stabilito il nome del dominio, devi scegliere un piano di hosting in modo che le persone possano accedere al tuo sito. Ci sono molte opzioni quando si tratta di hosting, da piani economici, condivisi a piani di hosting WordPress più costosi e gestiti.
Se non sei sicuro di dove cominciare, considera Envato Hosted. Envato Hosted offre un hosting WordPress gestito premium, ma il vero vantaggio è che possono installare e configurare WordPress insieme al tema scelto e occuparsi dei dettagli tecnici della configurazione del sito.
Il piano Envato Hosted comprende inoltre:
Infine, prenditi del tempo per preparare tutto il contenuto che andrà sul tuo sito web. Questo di solito include immagini, copia che andrà sulle tue pagine più importanti come la Di, Servizi o Lavora con noi pagine. Se hai diversi reparti, prendi in considerazione la possibilità di includere biografie e headshots delle persone che gestiscono ciascun dipartimento in modo che i tuoi visitatori sappiano chi contattare.
Preparare in anticipo i tuoi contenuti ti consente semplicemente di copiarli e incollarli al posto del contenuto demo disponibile con i temi più moderni.
Ora che hai tutto a posto, è il momento di creare il tuo sito. La prima cosa che devi fare è installare WordPress. Quindi, è possibile installare il tema, i plugin necessari e continuare con la configurazione e la personalizzazione del tema.
Ai fini di questo tutorial, utilizzeremo il tema WordPress reattivo di Oshine. Il tema Oshine presenta un design moderno e reattivo e può essere utilizzato per una varietà di nicchie. Include oltre 30 demo che possono essere importati con un solo clic e utilizzati per configurare rapidamente il tuo sito web.
Tema di OshineCome accennato in precedenza, il primo passo è installare WordPress. La tua società di hosting ti invierà un'e-mail di benvenuto contenente il link alla dashboard del tuo account di hosting o al pannello di controllo insieme al tuo nome utente e password. Fare clic sul collegamento e inserire le informazioni fornite.
Una volta effettuato l'accesso, sarà possibile cercare una sezione etichettata Installazione di WordPress, Installer con un clic, Installatori Softaculous, o qualcosa di simile. Trovare la WordPress icona, fare clic su di esso e seguire le istruzioni.
Nella maggior parte dei casi, verrai accolto da una schermata che ti chiederà di inserire il nome e la descrizione del tuo sito, il nome utente e la password desiderati, nonché la tua email. Compila i campi con le tue informazioni quindi premi il tasto Installare pulsante.
Dopo pochi minuti, verrà installato WordPress, il che significa che ora puoi accedere al tuo dashboard WordPress. Basta visitare www.yoursitename.com/wp-admin (sostituisci youritename.com con il tuo nome di dominio effettivo) e inserisci il nome utente e la password che hai creato durante l'installazione.
Nel tuo pannello di WordPress, vai a Aspetto> Temi> Aggiungi nuovo. Quindi, fare clic Carica tema.
Installazione del tema Oshine.Trova la cartella zip scaricata che contiene i file del tema e caricala. Al termine dell'installazione, fare clic su Attivare.
Dopo aver attivato il tema, noterai una notifica nella dashboard con un messaggio che indica che alcuni plugin sono necessari per il tema per avere tutte le sue funzionalità. Clicca il Inizia l'installazione dei plugin link da portare direttamente alla schermata di installazione.
Installare i plugin richiesti.Seleziona tutti i plugin e clicca Installare. Dopo, vai a Plugin> Tutti i plugin> Inattivo e selezionare tutti i plugin inattivi quindi scegliere il Attivare opzione dal menu a discesa.
La parte successiva della configurazione del sito Web prevede l'importazione di contenuti dimostrativi, la sua sostituzione con la tua e la modifica delle impostazioni del tema per includere font, colori, logo e altro ancora.
Il modo più veloce per configurare il tuo sito è installare il contenuto demo. Questo renderà il tuo tema simile alla tua demo scelta, con tutte le pagine create e impostate, quindi tutto quello che dovrai fare è sostituire il contenuto.
Per iniziare, vai al tema WordPress reattivo di Oshine e naviga verso Importare scheda. Seleziona la versione demo preferita e scegli i contenuti che desideri installare. Nel nostro caso, ho selezionato tutti i contenuti e ho fatto clic su Installare pulsante. Attendere il completamento del processo e il sito sarà pronto per la personalizzazione. Controllalo per assicurarti che il processo di importazione abbia avuto successo.
Importazione di contenuti dimostrativi in Oshine.Procediamo con la sostituzione del contenuto della demo. Nel tuo pannello di WordPress, vai a pagine e fare clic su modificare pulsante sulla pagina con cui vuoi lavorare. In questo esempio, modificheremo la home page.
Il tema WordPress reattivo di Oshine usa il generatore di pagine Tatsu per creare il layout per tutte le pagine del tuo sito che rende davvero facile modificarle. Basta fare clic sul Modifica con Tatsu pulsante e sarai in grado di modificare il layout, aggiungere moduli aggiuntivi e altro ancora.
Tatsu EditorPer modificare elementi sulla tua pagina, fai semplicemente clic sulla parte della pagina che desideri modificare, inserisci il tuo testo e regola le impostazioni a tuo piacimento. Puoi anche aggiungere altri elementi come caselle di testo, pulsanti, icone, video, immagini e altro.
Aggiunta di moduli al tema WordPress reattivo.Una volta che hai finito di sostituire il contenuto con il tuo, è il momento di modellare l'aspetto visivo del tuo sito. Vai a Opzioni di Oshine per iniziare a personalizzare il tuo sito. Noterai che ci sono alcune opzioni qui.
Puoi caricare il tuo logo e l'immagine di sfondo, personalizzare i caratteri utilizzati sul tuo sito, controllare gli stili mobili, impostare le informazioni che vengono visualizzate nel piè di pagina e nell'intestazione, e altro ancora. Puoi anche personalizzare le impostazioni predefinite per gli stili globali, inserire le tue informazioni di contatto e tracciare script come il codice di Google Analytics e ottimizzare le prestazioni del tuo sito riducendo al minimo i fogli di stile e gli script.
L'utilizzo di un tema WordPress premed è un ottimo modo per risparmiare tempo e garantire la reattività del tuo sito. Tuttavia, puoi portare il tuo sito al livello successivo creando da zero il tuo tema WordPress reattivo.
Anche se questo può sembrare scoraggiante, ti dà il massimo controllo sul design e sulle funzionalità del tuo sito. Se sei curioso di sapere come creare il tuo tema reattivo o vuoi saperne di più sul design del sito reattivo, ecco alcuni tutorial per aiutarti a iniziare.
Questo corso ti guida attraverso le basi del responsive design, spiega l'approccio mobile-first e i diversi layout utilizzati nel responsive web design e affronta argomenti più avanzati come ad esempio assicurarti che le tue immagini siano reattive e che utilizzino le media query per controllare il layout del tuo sito Web per una varietà di dispositivi.
Questo tutorial passo dopo passo ti guida attraverso il processo di utilizzo di un tema di partenza e trasformandolo in uno reattivo, tenendo presente l'approccio mobile-first. Imparerai come aggiungere stili per dispositivi mobili e passare allo styling del tema per i dispositivi desktop.
In questo post scoprirai sette utili plugin per WordPress che ottimizzeranno il tuo sito per i dispositivi mobili; assicurandoti che le tue immagini e i tuoi widget siano reattivi alla copertura di plugin specifici per garantire che il tuo sito abbia un bell'aspetto sui dispositivi mobili, anche se il tuo tema non è ancora reattivo.
La creazione di un sito Web reattivo può sembrare scoraggiante, ma i temi reattivi di WordPress rendono questo compito molto più semplice, anche per i principianti assoluti. Utilizza il nostro tutorial sopra come punto di riferimento ed esplora risorse aggiuntive sul responsive web design. E se hai bisogno di un tema WordPress reattivo, consulta la nostra collezione di temi WordPress reattivi e di alta qualità per qualsiasi settore.
SaveSave