Share
Come web designer e sviluppatori, viviamo nell'era del mobile da alcuni anni. In questo tutorial, esamineremo sette plug-in che aiutano a rendere il tuo sito Web di qualità e prestazioni ottimali per i visitatori di dispositivi mobili.
I visitatori mobili di solito si riferiscono a coloro che visitano il sito tramite tablet o smartphone. Ovviamente, dobbiamo costruire siti web che rispondano e si adattino ai dispositivi mobili, o non raggiungeremo molti di quelli che visitano i nostri siti e / o le nostre applicazioni.
Ma come possiamo recuperare? Rendendo i nostri siti Web mobili pronti, naturalmente. In questo tutorial, esamineremo sette plug-in per aiutarti a migliorare l'aspetto del tuo sito web e ad ottenere buoni risultati per gli utenti di dispositivi mobili.
È improbabile che tu non abbia mai sentito parlare dei termini "responsive web design" o "adaptive web design" negli ultimi due anni. Lo scopo di questo approccio nel web design è di rendere le pagine web adatte entro i limiti degli schermi dei dispositivi mobili.
I quattro plug-in di WordPress riportati di seguito possono aiutarti a presentare pagine predisposte per dispositivi mobili nel tuo sito web.
Hammy è un pratico plugin che ridimensiona le immagini nel tuo sito web per dispositivi mobili. Sostituisce il
Per utilizzare il plug-in, è necessario impostare alcuni punti di interruzione e scegliere un elemento HTML del contenitore. Con i punti di interruzione specificati, il plug-in può ridimensionare le immagini quando la larghezza dello schermo raggiunge un punto di interruzione. È inoltre possibile impostare alcuni nomi di classe per impedire che determinate immagini vengano ignorate.
Responsive Widgets è un plugin che introduce nuovi widget di testo / HTML di WordPress che appaiono solo su dispositivi particolari come iPad, Nook, PlayStation Vitas e altri dispositivi generici come tablet o smartphone.
Per utilizzare il plugin, è sufficiente una conoscenza di base dei widget di WordPress. Apri la pagina Widget e vedrai molti nuovi widget per i seguenti dispositivi e tipi di schermo:
Molti dei widget hanno caselle di controllo che ti permettono di fare eccezioni. Ad esempio, se vuoi mostrare un widget su tablet ma non su iPad, puoi selezionare una casella di controllo e sei a posto.
WP Lightbox 2 è un plugin "lightbox" molto popolare che ti consente di utilizzare le immagini popup e le gallerie in-page con effetti di sovrapposizione. Non è un plugin che ti aiuta con un design web reattivo di per sé, ma è reattivo e pronto all'uso, quindi puoi usarlo con i tuoi siti web.
Per utilizzare il plugin, non devi fare altro che attivare il plugin. Ha alcune opzioni come l'attivazione di Lightbox nella sezione dei commenti o la modifica della durata dell'animazione, ma in pratica funziona in base all'attivazione senza alcuna configurazione aggiuntiva.
Responsabile è un plugin WordPress estremamente utile per testare al volo i tuoi responsive design nel tuo browser. Utilizza il segnalibro Viewport Resizer per posizionare una barra fissa nella parte superiore della pagina in cui è possibile ridimensionare la pagina in dimensioni specifiche come smartphone, tablet o schermi desktop e dimensioni personalizzate che è possibile impostare.
Per utilizzare il plugin, è sufficiente attivarlo e visitare una delle tue pagine. La barra apparirà su ogni pagina in modo da poter testare i tuoi disegni, completamente senza problemi.
Questi plugin funzionano in modo più specializzato: ti aiutano a mostrare un tema WordPress diverso se l'utente si connette al tuo sito Web con un dispositivo mobile. Ciò è particolarmente utile se hai un tema che non è pronto per i dispositivi mobili. Se non hai il tempo o l'energia per rendere pronto il tuo tema, puoi goderti questi fantastici plugin per fare il lavoro.
Con oltre cinque milioni di download e una valutazione di 3,9 su 5 stelle, WPTouch è probabilmente il più popolare plug-in per dispositivi mobili oggi. Offre uno dei modi più semplici per creare una versione mobile del tuo sito web, completamente pronta all'uso.
Per utilizzare il plugin, devi solo installare e attivare il plug-in. Mentre le sue impostazioni predefinite saranno sufficienti per molti utenti, puoi regolare una tonnellata di impostazioni nelle sue pagine di configurazione.
Un avvertimento: con una grande potenza derivano grandi responsabilità e con oltre cinque milioni di download ne arrivano ancora di più. A luglio 2014 è stato annunciato che le versioni di WPTouch 3.x avevano una vulnerabilità mortale che è stata risolta immediatamente, ma che potrebbe aver causato enormi problemi agli utenti del plug-in. È sempre una buona idea cercare gli aggiornamenti e questo vale per il core e tutti i tuoi plugin e temi.
WordPress Mobile Pack è un altro grande player che offre temi per dispositivi mobili per i siti Web WordPress. Per ora, ha oltre 600.000 download e una valutazione di 3,8 su 5 stelle. WordPress Mobile Pack offre un tema mobile davvero unico per te e i tuoi visitatori: un'interfaccia simile a un'app mobile invece di un classico design mobile.
Come WPTouch, WordPress Mobile Pack è pronto per l'uso quando si installa e si attiva il plug-in. Se lo desideri, puoi apportare alcune modifiche alla pagina di configurazione.
Jetpack non è solo uno dei plugin di WordPress più popolari mai, ma è anche supportato e gestito da WordPress.com e Automattic. E questo grande plugin ha anche una funzione "Tema Mobile" da cui possiamo trarne vantaggio.
Per utilizzare la funzione "Tema cellulare", devi andare al Jetpack "Impostazioni pagina di configurazione dopo l'installazione e l'attivazione di Jetpack. Nell'elenco dei moduli Jetpack, trova "Tema portatile" e attivalo. Non è molto, davvero, ma offre un design veloce e pulito per i dispositivi mobili. Una nota per esperienza personale: non funziona bene con il plugin ufficiale di Disqus.
Nel web, è sempre importante tenere il passo con le tendenze e offrire agli utenti ciò che vogliono, soprattutto se ci si aspetta qualcosa da loro in cambio (che si tratti di soldi o elogi). Ai nostri giorni, "mobile ready" sta diventando standard e sarebbe sciocco rimandare i propri utenti con un sito web che non si traduce bene in dispositivi mobili.
Conoscete altri buoni plugin che rendono i siti Web più accessibili per i dispositivi mobili? Si prega di condividere i vostri pensieri e conoscenze con noi commentando di seguito. E se ti è piaciuto questo articolo, non dimenticare di condividerlo con i tuoi amici!
Accentsconagua