Le tabelle sono da sempre un modo fondamentale per organizzare le informazioni. Consentono di presentare più serie di informazioni in un formato chiaro e strutturato, in modo che i lettori possano analizzarle, interpretarle e prendere decisioni rapidamente.
Se gestite un'attività SaaS, vendete corsi online, offrite livelli di iscrizione o fornite servizi con pacchetti diversi, alla fine avrete bisogno di una tabella dei prezzi. È uno dei modi più efficienti per presentare i vostri piani in un formato affiancato che mostra cosa comprende ciascuna opzione e quanto costa.
Una tabella prezzi reattiva si adatta alle diverse dimensioni dello schermo. Su un computer portatile, potrebbe mostrare tutti i piani in colonne; su un telefono, potrebbe impilare le colonne in righe o permettere di scorrere tra di esse. L'idea è che il layout rimanga leggibile e facile da usare, indipendentemente dal dispositivo utilizzato.
Ecco perché abbiamo preparato questo articolo con l'obiettivo di mostrarvi come creare una perfetta tabella prezzi responsive in WordPress. Abbiate pazienza.
- Cosa rende perfetta una tabella dei prezzi?
- Perché saltare il blocco tabella predefinito per le tabelle dei prezzi?
- Creare una tabella prezzi reattiva in WordPress
- Passo 1: installare e attivare l'Tableberg
- Passo 2: aggiungere il blocco Tableberg
- Fase 3: Compilazione dei dettagli dei prezzi
- Passo 4: personalizzare gli stili di tabella
- Fase 5: Evidenziare il piano di miglior valore
- Fase 6: messa a punto della tabella per la reattività
- Fase 7: Anteprima e pubblicazione
Cosa rende perfetta una tabella dei prezzi?
Una tabella prezzi perfetta non si limita a elencare i prezzi. Guida gli utenti nel processo decisionale con chiarezza, struttura e la giusta dose di enfasi visiva. Ecco cosa dovrebbe includere:
1. Layout chiaro e focalizzato
Utilizzate titoli brevi e mantenete la struttura facile da scansionare. Evitate di riempire troppo il documento. Evidenziate solo le differenze principali che interessano agli utenti.
2. Prezzi onesti e anticipati
Mostrate sempre il prezzo esatto e la modalità di fatturazione. Chiarite se è mensile o annuale. Evitate frasi come "a partire da" o qualsiasi altra cosa che nasconda il costo reale.
3. Confronto delle caratteristiche fianco a fianco
Elencate ciò che è incluso in ciascun piano e rendete evidenti le differenze. È possibile utilizzare indicazioni visive come icone o testo sbiadito, ma è bene mantenere un'impostazione pulita e coerente.
Tagline di piccoli benefici
Una breve riga come "Meglio per i freelance" o "Ideale per i team" sotto ogni piano può portare i vostri utenti a prendere una decisione senza pensarci troppo.
Pulsanti guidati dall'azione
Ogni piano dovrebbe avere un pulsante chiaro che invita all'azione. Ma non dimenticate di utilizzare un colore distintivo, una dimensione unica o l'etichetta "Il più popolare" per far risaltare il vostro piano più conveniente.
Layout pronto per i dispositivi mobili
La tabella deve adattarsi automaticamente a telefoni e tablet. Il requisito fondamentale è che rimanga leggibile senza costringere gli utenti a zoomare o scorrere lateralmente.
Componenti aggiuntivi opzionali ma utili
Le levette per passare dai prezzi mensili a quelli annuali, i tooltip rapidi o un link alle FAQ nelle vicinanze aiutano a rispondere alle domande più comuni prima ancora che gli utenti le pongano.
Perché saltare il blocco tabella predefinito per le tabelle dei prezzi?
Quando avete intenzione di creare qualcosa in WordPress, la vostra prima intenzione potrebbe essere quella di farlo con le funzioni principali del costruttore. Perché perdere tempo con i plugin quando è possibile farlo con i blocchi principali, giusto? In alcuni casi, il vostro istinto vi sarà utile. Ma quando si tratta di costruire una tabella dei prezzi reattiva, il blocco Table predefinito non è sufficiente.
Va bene per la presentazione di dati semplici, ma non è così. Non è possibile inserire diversi tipi di contenuto all'interno delle celle, non è possibile stilizzarle o evidenziarle singolarmente e non c'è alcuna reattività integrata per i dispositivi mobili. Manca anche la funzionalità di selezione e si limita al testo semplice. Se si prova a usarlo per una tabella dei prezzi, il layout può sembrare buono su desktop, ma crolla rapidamente su schermi più piccoli. Non è possibile impilare le colonne, non c'è modo di aggiungere badge o icone, non ci sono pulsanti call-to-action e non c'è modo di enfatizzare visivamente un piano in evidenza.
In breve, manca la flessibilità e la reattività di cui ha bisogno una tabella prezzi adeguata. Ecco perché affidarsi esclusivamente ai blocchi principali non è sempre la scelta più efficiente.
Creare una tabella prezzi reattiva in WordPress
Molti plugin consentono di creare tabelle di prezzi, ma spesso sono dotati di impostazioni inutili o utilizzano interfacce complicate. Tavolo di lavoro è diverso. È stato realizzato per l'editor di blocchi, supporta più tipi di contenuto ed è costruito tenendo conto della reattività. Tableberg ha un'impressionante serie di funzionalità pronte ad essere utilizzate in base alle esigenze degli utenti.
|
Versione gratuita |
Versione Pro |
|---|---|
|
Blocchi di paragrafi, elenchi, pulsanti e immagini |
Valutazione a stelle, icona, barra multifunzione, blocchi HTML personalizzati |
|
Design reattivo con impilamento mobile |
|