Creare un tema per WordPress che sia bello e che funzioni in modo impeccabile è fondamentale per qualsiasi sviluppatore. Indipendentemente dalla propria esperienza, l’implementazione di una solida strategia di test dei temi può fare la differenza tra un prodotto mediocre e un prodotto di successo.

In questa guida parleremo del testing dei temi di WordPress ed esploreremo gli strumenti, le tecniche e le best practice che miglioreranno la qualità del vostro tema. Sarà la guida perfetta per garantire che il vostro tema soddisfi gli standard più elevati in termini di prestazioni, compatibilità ed esperienza utente (UX).

Come funziona il testing dei temi WordPress

La realizzazione di qualsiasi prodotto richiede un processo di testing che è più di un controllo finale prima del lancio. È una parte integrante del processo di sviluppo che può aiutare a identificare e correggere i problemi in anticipo, risparmiando tempo e risorse nel lungo periodo.

Eseguire test sui temi WordPress permette di assicurarvi che il vostro tema funzioni correttamente in diversi ambienti, browser e dispositivi. Può far emergere problemi che dovrete risolvere prima della pubblicazione:

  • Problemi di compatibilità con le diverse versioni di WordPress.
  • Conflitti con i plugin più diffusi.
  • Problemi di prestazioni.
  • Incongruenze UX e problemi di accessibilità.
  • Vulnerabilità di sicurezza.

Anche se il test di un tema WordPress può includere la correzione di bug, in generale il processo aiuta a creare un prodotto che si distingua sul mercato.

Gli standard dei temi WordPress in breve

WordPress dispone di una serie di standard di codifica per garantire la coerenza e la qualità dei temi. Questi standard non sono regole arbitrarie, ma il risultato di anni di esperienza e collaborazione della comunità.

Il team di Make WordPress Themes fa rispettare questi standard per i temi che potrebbero essere inclusi nella Directory dei temi WordPress:

La pagina principale della directory dei temi WordPress. Mostra una griglia di anteprime di temi, tra cui Twenty Twenty-Four, Hello Theme di Elementor e Astra. Ogni anteprima di tema mostra un'immagine in miniatura del design del tema e il suo nome. L'intestazione della pagina include le opzioni per inviare un tema, visualizzare le aziende di temi commerciali e accedere.
La Directory di temi WordPress.

I temi inviati alla directory sono sottoposti a un’accurata revisione per garantire che soddisfino i requisiti di qualità e sicurezza della piattaforma.

Dato che la Directory dei temi è il repository ufficiale, e il primo posto in cui molti si recano per trovare un nuovo tema, è fondamentale che ogni download funzioni come ci si aspetta, senza problemi di sicurezza o bug importanti. Questo elevato standard di qualità è solo uno degli aspetti che rendono WordPress la piattaforma che è.

Perché eseguire test in base agli standard di WordPress

Il rispetto degli standard di WordPress non riguarda solo l’approvazione per l’inclusione nella Directory dei temi. L’obiettivo più profondo è quello di creare un prodotto affidabile e sicuro che funzioni per l’utente.

Ci sono molti motivi validi per testare il vostro tema rispetto agli standard di WordPress, oltre al desiderio di trovare una casa tra i concorrenti:

  • A “prova di futuro”. WordPress si evolve costantemente. Per questo motivo, se aderite agli standard attuali, renderete più facile la manutenzione e l’aggiornamento del vostro tema in futuro.
  • Compatibilità. Se il vostro tema segue gli standard di WordPress, è più probabile che funzioni con un’ampia gamma di plugin e di funzioni principali di WordPress.
  • Prestazioni. Molti standard di WordPress si concentrano sulle prestazioni. Seguirli può aiutare a garantire che il vostro tema funzioni in modo più efficiente.
  • Sicurezza. Gli standard includono le best practice per la sicurezza, che aiutano a proteggere il vostro tema e i suoi utenti da potenziali vulnerabilità.

Il risultato netto di questi aspetti è importante: la fiducia degli utenti. La maggior parte degli utenti desidera un prodotto di qualità, sicuro, stabile e privo di bug.

Per coloro che hanno familiarità con WordPress, un tema che soddisfi questi standard rappresenta un’ulteriore conferma alla reputazione stellare della piattaforma. Per gli utenti che si avvicinano a WordPress per la prima volta, i temi di qualità danno un’aria di affidabilità. In quanto tale, potrebbe essere l’inizio di un rapporto duraturo con la piattaforma, tutto grazie al vostro tema.

Quali sono gli standard in base ai quali WordPress giudicherà il tema

Il team Make WordPress Themes è fondamentale per mantenere la qualità dei temi all’interno dell’ecosistema della piattaforma. Valuta i temi in base a una serie completa di criteri:

  • Qualità del codice. Non devono essere presenti errori JavaScript o PHP, segnalazioni o avvisi. Inoltre, il tema non può utilizzare costanti o funzioni deprecate. WordPress ha anche una serie separata di standard di codifica da rispettare.
  • Funzionalità. Non si possono “manipolare” le schermate di anteprima di modifica, mettere le funzionalità tipiche di WordPress dietro un paywall o effettuare reindirizzamenti all’attivazione. Esistono anche linee guida per la visualizzazione delle notifiche di amministrazione e per l’inclusione di funzionalità “non di presentazione”.
  • Accessibilità. I temi devono includere skip link e opzioni di navigazione da tastiera. Anche i link devono essere sottolineati.
  • Licenze. Ovviamente i temi devono essere compatibili con la GNU General Public License (GPL). Tuttavia, non è necessario utilizzare la stessa licenza di WordPress: qualsiasi licenza GPL compatibile è valida.

Esistono anche linee guida relative alla promozione e alla presentazione. Ad esempio, il team di Make WordPress Themes può decidere di rifiutare il vostro tema in base al suo nome. Ciò accadrà in caso di violazione del marchio o di scelta di un nome non appropriato.

Inoltre, ci sono delle restrizioni per quanto riguarda l’inserimento di crediti; anche in questo caso, potete aggiungerli solo a style.css:

Una finestra dell'editor di codice che mostra il file style.css del tema WordPress Twenty Twenty-Four. La finestra ha uno sfondo scuro con testo chiaro che mostra le informazioni sul tema, come il nome, l'autore, la descrizione e le varie caratteristiche e tag del tema.
Un file style.css.

Ci sono anche alcune indicazioni sull’account dell’autore, come il numero di account che potete avere e la frequenza di invio dei temi. La maggior parte degli elementi richiesti riguarda aspetti tecnici di sviluppo.

Standard tecnici di WordPress

Dei 14 requisiti per l’invio di un tema a WordPress, quelli relativi alle impostazioni del tema, ai file e all’utilizzo di blocchi costituiscono una buona parte.

Per quanto riguarda i temi classici e i temi a blocchi, le indicazioni sono maggiori per i primi:

  • Temi classici. È necessario includere molte funzioni, a volte in posizioni specifiche del codice. Lo stesso vale per le chiamate ai template.
  • Temi a blocchi. Rispettare gli standard per i temi a blocchi è più semplice, perché è necessario includere solo quattro file. Se anche i vostri template di blocchi sono completi, il vostro tema soddisferà gli standard tecnici per una serie di requisiti.

Ci sono molti requisiti relativi alle impostazioni. Ad esempio, dovrete utilizzare degli hook specifici per visualizzare gli avvisi e impostare la permanenza dell’avviso in base alle linee guida del processo di revisione.

Una parte della dashboard di amministrazione di WordPress che mostra la sezione Post. In alto è presente un banner blu che promuove il plugin Revive Old Posts. In basso sono presenti schede che visualizzano le statistiche dei post, tra cui 106 post totali, 103 pubblicati, uno sticky, due programmati e un post in bozza.
Una notifica dell’amministratore all’interno della dashboard di WordPress.

C’è uno stretto controllo sulla memorizzazione delle opzioni all’interno del database. Dovrete utilizzare un unico array, anche per più impostazioni, con le giuste convenzioni di denominazione. Per quanto riguarda la dashboard di WordPress, potete utilizzare solo elementi fondamentali dell’interfaccia utente (UI) e qualsiasi stile deve rimanere entro i confini della pagina di amministrazione del vostro tema.

La dashboard di amministrazione di WordPress mostra la pagina Generate Comments del plugin FakerPress. La pagina contiene vari campi per configurare la generazione dei commenti, tra cui il tipo, il tipo di post, la quantità, l'intervallo di date, la dimensione del contenuto e le opzioni HTML. La barra laterale sinistra mostra il menu di amministrazione standard di WordPress.
La schermata delle impostazioni dei Commenti di FakerPress.

Dovete anche controllare i file che includete nel vostro tema. Ogni tema deve includere un file readme.txt, ad esempio. La preparazione dei file (come la rimozione del codice premium o delle directory superflue) è un altro requisito, così come l’inclusione di tutti gli script e i media del tema oppure l’utilizzo di fonti remote. Questo vale anche per gli script minificati: è necessario includere anche il file originale completo.

Soddisfare tutti i requisiti di WordPress per il vostro tema può sembrare una seccatura, soprattutto se non avete intenzione di inviarlo alla directory ufficiale. Tuttavia, questi standard forniscono un quadro eccellente per aiutarvi a fornire un prodotto di qualità.

Perché rispettare gli standard di WordPress può aiutare la qualità del tema

Per inserire il vostro tema nella directory ufficiale, è necessario rispettare le linee guida di Make WordPress Theme. Tuttavia, pensate a un’agenzia che crea temi personalizzati per i clienti. Spesso questi temi non hanno bisogno di essere inviati alla Theme Directory, in quanto non vengono distribuiti in massa. Tuttavia, seguire le linee guida e i requisiti può comunque offrire vantaggi a tutti i temi WordPress, tra cui:

  • Coerenza. Gli standard forniscono un quadro comune, rendendo più facile per i team lavorare insieme su un progetto.
  • Efficienza. Potete accelerare i tempi di sviluppo seguendo gli standard stabiliti. In questo modo si può anche ridurre la necessità di effettuare personalizzazioni più estese.
  • Manutenibilità. Un codice standardizzato è più facile da mantenere e aggiornare. Questo è un altro modo per risparmiare tempo e risorse nel lungo periodo.
  • Soddisfazione del cliente. I temi che aderiscono agli standard di WordPress hanno maggiori possibilità di offrire ai vostri clienti un’esperienza fluida e priva di bug.

Oltre a tutto questo, il vostro tema permette di avere una certa flessibilità per il futuro. Pensate a una situazione in cui un cliente rifiuta un tema per un progetto o rescinde il contratto. Un tema che soddisfi gli standard e i requisiti di WordPress è un tema che potrete riutilizzare in un’offerta di prodotto senza dover fare molto lavoro in più.

In breve, anche se non volete puntare alla Directory dei temi di WordPress, soddisfare i requisiti della piattaforma può migliorare la qualità e la commerciabilità dei vostri temi. Come minimo, dimostrerete professionalità e attenzione ai dettagli, il che può essere un punto di forza per i potenziali clienti.

Gli strumenti essenziali che servono per testare i temi WordPress

Come ogni artigiano, gli sviluppatori di WordPress hanno bisogno di un kit di strumenti solido e adattabile che copra i vari aspetti della creazione di un tema e delle sue prestazioni.

Considerate gli standard di codifica di WordPress e i requisiti del team Make WordPress Themes come i vostri libretti di istruzioni. Non dovete nemmeno controllare manualmente ognuno di questi aspetti. Al contrario, i plugin Theme Check e Theme Sniffer possono automatizzare il tutto.

Immagine di intestazione del plugin Theme Check da WordPress.org. Mostra una checklist semplificata basata su icone o un tracker dei progressi su uno sfondo rosso scuro. La checklist mostra tre icone circolari allineate verticalmente sul lato destro dell'immagine. I due cerchi superiori contengono segni di spunta verdi, mentre il cerchio inferiore è vuoto, il che suggerisce due passi completati e uno ancora da compiere.
Il plugin Theme Check si trova su WordPress.org.

Entrambi eseguono dei test sul vostro tema e mostrano le aree che potrebbero non soddisfare i requisiti attuali. Theme Sniffer effettua alcuni test più completi e utilizza degli “sniff” personalizzati per lo script PHP_CodeSniffer per aiutare a rilevare le violazioni degli standard.

Dovrete anche affidarvi agli strumenti di sviluppo del vostro browser per ispezionare e fare il debug di HTML, CSS e JavaScript. Per il debug specifico di WordPress, è quasi impossibile fare a meno della modalità di debug della piattaforma. Il plugin Debug Bar aggiunge un menu di debug alla dashboard di WordPress che attinge da questa modalità.

L'immagine dell'header del plugin Debug Bar da WordPress.org. Mostra un pannello di debug che visualizza la versione 7.0.3 di PHP, la versione 5.5.5 di MySQL e l'utilizzo della memoria di 3.708.912 byte. Il pannello mostra anche le informazioni sulle query, con 12 query totali che richiedono 14,3 ms per essere eseguite. È visibile anche una query MySQL che seleziona dalla tabella wp_options.
Immagine dell’intestazione del plugin Debug Bar da WordPress.org.

Ci sono anche altri plugin che possono essere utili per testare il vostro tema:

  • Query Monitor. Questo pannello di strumenti fornisce informazioni sulle query del database, sugli hook, sui condizionali e molto altro.
  • Registro degli avvisi di deprecazione. Se il vostro tema utilizza file, funzioni e argomenti di funzioni deprecati, questo plugin li segnala. È un buon modo per mantenere il vostro tema aggiornato alle ultime versioni di WordPress.
  • Plugin Monster Widget. I temi classici utilizzano i widget e questo plugin aggiunge al vostro sito un singolo widget che contiene tutti i widget principali disponibili. L’obiettivo è quello di permettervi di testare le aree dei widget con efficienza.

Potreste non utilizzare tutti questi plugin e strumenti durante il vostro flusso di lavoro di test dei temi WordPress. Questo è lo scopo di una cassetta degli attrezzi: ogni componente ha uno scopo e aiuta a risolvere i problemi prima che diventino tali.

Test dei temi WordPress: configurare l’ambiente di test

Dopo aver preparato la vostra cassetta degli attrezzi, è il momento di impostare l’area di lavoro. Per il test dei temi WordPress, ciò significa creare un ambiente di test e di sviluppo adeguato. L’idea è quella di assicurarvi di poter ripetere qualsiasi test e ottenere risultati accurati.

Potreste già avere gran parte di questo processo pronto per l’uso senza il bisogno di ulteriori configurazioni. Sicuramente gli sviluppatori WordPress abituali avranno a disposizione uno dei seguenti strumenti senza alcuno sforzo:

  • Un ambiente di sviluppo locale. Una configurazione di WordPress sul vostro computer locale permette di eseguire test senza influenzare il vostro sito live. DevKinsta è una delle migliori opzioni disponibili per questo scopo.
  • Più versioni di WordPress. Per ottenere la massima compatibilità, dovreste eseguire dei test su diverse versioni precedenti di WordPress.
  • Diverse versioni di PHP. Per estensione, questi test dovrebbero essere eseguiti su diverse versioni di PHP o di qualsiasi altra tecnologia importante richiesta dal vostro tema.
  • Plugin popolari. Per assicurarvi di eseguire i test su una configurazione reale e realistica, è una buona idea installare e attivare alcuni dei più popolari plugin di WordPress. Questo può servire per verificare eventuali problemi di compatibilità o per vedere come si comporta il vostro tema con un carico tipico.
  • Dispositivi e browser multipli. Testare il vostro tema su diversi dispositivi e browser vi garantirà un aspetto eccellente e un funzionamento uniforme su tutte le piattaforme.

Quando i componenti del vostro ambiente saranno pronti, dovrete configurare WordPress per il debug. Per farlo, aprite il file wp-config.php utilizzando il metodo che preferite. L’ideale è il Secure File Transfer Protocol (SFTP) o il Secure Shell (SSH).

Una volta aperto wp-config.php, aggiungete le seguenti righe:

define( 'WP_DEBUG', true );
define( 'WP_DEBUG_LOG', true );
define( 'WP_DEBUG_DISPLAY', false );

In questo modo si attiva la modalità di debug di WordPress, si registrano gli errori in un file e si impedisce la loro visualizzazione sul frontend. Potete anche disattivarla di nuovo per caricare il sito di prova su un server live.

Il Theme Unit Test Data: il contenuto di aiuto di WordPress che aiuta a rispettare gli standard per i temi

C’è un altro elemento per il test dei temi WordPress che può essere cruciale per eliminare bug o problemi: i Theme Unit Test Data. Si tratta di un file XML che contiene un’ampia varietà di tipi di contenuti e di casi limite e che viene caricato sul vostro sito attraverso la dashboard di WordPress.

La dashboard di WordPress mostra la schermata Messaggi. L'interfaccia mostra una tabella che elenca i vari post del blog con colonne per titolo, autore, categorie, tag e data di pubblicazione. La barra laterale sul lato sinistro mostra le varie opzioni di navigazione dell'area di amministrazione di WordPress.
La schermata dei post di WordPress mostra i contenuti relativi ai Theme Unit Test Data.

Ecco perché è così prezioso:

  • Include vari tipi di contenuti, come post, pagine, commenti e media. Questo permette di testare come il vostro tema gestisce diversi scenari di contenuto.
  • I dati includono elementi come titoli molto lunghi, post senza titolo e commenti annidati. Tutti questi casi limite sono importanti da testare, perché volete che l’utente sia in grado di effettuare qualsiasi personalizzazione che lo riguardi.
  • Varie opzioni di formattazione assicurano che il tema applichi gli stili al contenuto come ci si aspetta. Il file XML include contenuti e media per testare questo aspetto.
  • Avete anche contenuti in diverse lingue, che includono scritte che potrebbero causare errori di formattazione.

Potete trovare il file XML Theme Unit Test Data nel repository ufficiale di WordPress GitHub o nel manuale Make WordPress Themes. Una volta scaricato, andate alla schermata Strumenti > Importa di WordPress:

La pagina delle opzioni di importazione di WordPress. La barra laterale di sinistra mostra varie voci di menu, come Dashboard, Post, Media e Strumenti. L'area principale del contenuto mostra un elenco di diverse piattaforme da cui gli utenti possono importare i contenuti, tra cui Blogger, LiveJournal, Movable Type, RSS, Tumblr e WordPress stesso. Ogni opzione è accompagnata dai link Installa ora e Dettagli.
La pagina di importazione nella dashboard di WordPress.

Verrà mostrato un elenco di opzioni di importazione per la piattaforma, per il quale dovrete scegliere Installa adesso per WordPress. In alternativa, potete installare il plugin WordPress Importer. Il link di installazione cambierà in Esegui Importer. Fate clic su questo link per aprire una finestra di dialogo per il caricamento. Scegliete quindi il vostro file XML e cliccate sul pulsante Carica file e importa:

La pagina Importa WordPress è specifica per l'importazione di contenuti WordPress. Mostra le istruzioni per caricare un file WordPress eXtended RSS (WXR). C'è un pulsante Scegli file per selezionare il file, con una dimensione massima di caricamento di 128 MB. Sotto c'è il pulsante blu Upload.
La schermata Importa WordPress mostra un file in attesa di essere importato.

I contenuti che verranno importati vengono forniti con altri profili utente. La schermata Importa WordPress permette di scegliere se importarli insieme al contenuto. In alternativa, potete creare un vostro utente o assegnare il contenuto a un utente già esistente sul vostro sito:

La schermata Importazione di WordPress per assegnare gli autori ai contenuti. Ci sono campi per creare nuovi utenti o assegnare post a utenti esistenti per due autori di importazione: Theme Buster e Theme Reviewer. In fondo c'è una casella di controllo per l'importazione di file allegati e un pulsante Invia.
La finestra di dialogo Importa WordPress mostra l’opzione per assegnare gli autori ai contenuti.

Consigliamo di selezionare la casella Scarica e importa gli allegati dei file. Questo rispecchia la tipica esperienza di WordPress. Una volta cliccato sul pulsante Invia, WordPress impiegherà qualche istante per importare i contenuti, gli utenti e i media. Da qui, potete testare come il vostro tema gestisce vari tipi di contenuti e scenari per assicurarvi che soddisfi i requisiti di visualizzazione e formattazione dei contenuti.

I fondamenti del testing dei temi

Il giusto flusso di lavoro è fondamentale per un’esperienza fluida e senza problemi. Questo è particolarmente vero con un lungo elenco di strumenti e plugin extra da gestire. Una volta che avrete un ambiente di test stabile, potete valutare le fasi necessarie per il test.

La chiave del testing dei temi WordPress è che è iterativo e fluido. Non c’è un flusso di lavoro fisso, lineare e graduale. Ci sono invece una serie di attività che potete completare nell’ordine che preferite.

Ad esempio, il vostro flusso di lavoro probabilmente includerà almeno uno o tutti i seguenti passaggi:

  • Abilitare la modalità di debug.
  • Eseguire i plugin Theme Check o Theme Sniffer.
  • Testare con i dati del Theme Unit Test.
  • Procedere con il troubleshooting dei problemi utilizzando i DevTools del browser.

Il test delle opzioni e delle personalizzazioni del tema può avvenire in diversi momenti. Quest’area verrà rivisitata nel corso del processo. Lo stesso vale per la verifica della compatibilità dei plugin. Queste due aree saranno valutate costantemente. Gli altri test che effettuerete saranno spesso incentrati su queste aree.

La fase di debugging seguirà spesso i test, anche se ci saranno degli incroci. In definitiva, il testing di un tema WordPress prende in esame le aree relative alla funzionalità, alle prestazioni, alla sicurezza, all’accessibilità e all’idoneità del codice

Una volta che avrete un tema che supera i test, soddisfa i requisiti ufficiali di WordPress e non presenta bug, inviarlo dovrebbe essere semplice.

Le aree principali del testing tecnico dei temi WordPress

Tenendo a mente i fondamenti, potete esaminare gli aspetti principali del testing del vostro tema. Come per le basi, queste aree principali sono fluide e iterative. Tuttavia, è una buona idea iniziare confermando che il tema gestisce le funzionalità di base.

Test di funzionalità

In generale, i test di funzionalità assicurano che tutti gli aspetti del tema funzionino come previsto. Un tema che non è in grado di supportare le funzionalità predefinite di WordPress non è utilizzabile. I dati dei test unitari del tema sono fondamentali per questo scopo, in quanto potete verificare come il vostro tema gestisce le situazioni tipiche e i casi limite.

Ad esempio, avrete già post e pagine con contenuti tipici e atipici, quindi non è necessario crearne altri. Il test di questi contenuti è soggettivo e dipende dai vostri obiettivi, dal brief di progettazione, dai desideri del cliente e altro ancora.

Per la maggior parte dei casi d’uso, è utile testare quanto segue:

  • Per tutti i blocchi tipici e più diffusi (Paragrafo, Elenco, Immagine, Header, per fare degli esempi) verificate come appaiono nel frontend. Controllate l’allineamento, la spaziatura e la presentazione generale per individuare eventuali incongruenze.
  • Le opzioni multiple dovranno essere sottoposte a test di compatibilità. Potrebbe trattarsi delle impostazioni principali di WordPress, dei vari blocchi disponibili e persino delle impostazioni di terze parti per altri plugin.
  • Se il tema gestisce un blog, verificate che la sezione dei commenti mostri tutti i contenuti. È inoltre fondamentale testare i commenti annidati per verificare che il design e la funzionalità funzionino come previsto.
  • A questo punto, cercate tutti i blocchi che si integreranno con il vostro tema e testateli. Ad esempio, il blocco Commenti potrebbe necessitare di ulteriori adattamenti. I plugin di terze parti per la raccolta dei blocchi potrebbero richiedere un test di compatibilità.

Per quanto riguarda i temi classici, dovete testare le aree dei widget, la funzionalità degli shortcode, la navigazione e altri elementi distinti dai temi a blocchi. Tuttavia, la maggior parte dei temi dovrebbe funzionare con l’Editor a blocchi come standard, dato che è quello il futuro di WordPress.

Test dell’editor a blocchi

Il vostro tema dovrà essere pienamente compatibile con gli editor a blocchi e del sito. Un ottimo punto di partenza sono i template, che potete trovare nella schermata Design > Template dell’Editor del sito:

L'interfaccia dell'Editor del sito WordPress mostra la pagina Templates. Viene visualizzata una griglia di miniature di template, tra cui Tutti gli archivi, Home del blog, Indice e altri template di pagina. Ogni miniatura mostra un'anteprima blu in stile wireframe del layout del template.
La schermata Template dell’editor del sito WordPress.

Qui dovete verificare che i vostri template vengano visualizzati e che sia possibile modificarli senza errori. Gli utenti potrebbero voler personalizzare i template del vostro tema e persino crearne di propri.

L’interfaccia Stili è un altro strumento di personalizzazione fondamentale all’interno dell’Editor del sito, quindi è anche un fattore importante per determinare la qualità del vostro tema.

L'interfaccia Stili dell'editor del sito WordPress. L'area del contenuto principale mostra uno sfondo blu con testo bianco. La barra laterale di destra rivela l'editor degli stili del sito, in particolare le impostazioni della palette di colori.
L’interfaccia Stili dell’editor del sito WordPress.

Potreste giocare con le impostazioni per vedere se riuscite a realizzare le tipiche personalizzazioni. In altri casi, potreste lavorare con le impostazioni del layout per far sì che tutto funzioni bene insieme.

Altri elementi dei temi a blocchi che richiedono considerazione:

  • Theme.json. Testate accuratamente il vostro file theme.json per assicurarvi che configuri correttamente gli stili e le impostazioni globali.
  • Variazioni di blocco. Se il vostro tema utilizza variazioni di blocco personalizzate, è importante testarle in diversi modi.
  • Template di blocchi personalizzati. Per questo e per tutte le parti di template rilevanti, fate un doppio controllo man mano che procedete, in modo da non introdurre ulteriori bug o errori.

Questo test va ad aggiungersi alle funzionalità tecniche, come ad esempio assicurarsi che tutti gli hook per le azioni e i filtri funzionino correttamente. Se necessario, testate il tema con WooCommerce o altri plugin di e-commerce. Infine, molti clienti vorranno che i solo siti si integrino anche con i social media. Verificate che i pulsanti di condivisione o i feed funzionino secondo i requisiti del cliente.

Compatibilità dei plugin

Un sito WordPress probabilmente utilizzerà diversi plugin nel corso della sua vita. Dato che ci sono così tanti plugin e combinazioni, è difficile tenere conto di tutti i casi d’uso.

Questo può essere un problema. Anche se è chiaro che dovrete testare il vostro tema con alcuni plugin, è difficile sapere quali. Il nostro consiglio è di fare dei test utilizzando un po’ di tutto:

  • I più popolari plugin per la creazione di pagine, come Elementor, Beaver Builder, Bricks, Brizy e Divi.
  • La maggior parte dei siti avrà un plugin per l’ottimizzazione dei motori di ricerca (SEO) come Yoast SEO. Vi consigliamo anche di dare un’occhiata a SEOPress e a molti altri.
  • Anche i plugin di caching sono piuttosto comuni. WP Super Cache, W3 Total Cache e WP Rocket sono tutti leader del settore.
  • Potete trovare diversi plugin per i moduli, ma Ninja Forms, Contact Form 7, WPForms e Gravity Forms compaiono spesso.
  • I plugin di Automattic e del team Make WordPress Core dovrebbero essere presenti nella vostra lista di soluzioni di prova. Akismet, Jetpack e persino il plugin Classic Editor dovrebbero essere testati a fondo.

Dovete cercare conflitti evidenti e poi lavorare sui problemi minori. Molti temi utilizzano la compatibilità dei plugin nei loro materiali di marketing, quindi dedicare del tempo a quest’area può aumentare la vostra credibilità.

Test di accessibilità

Non tutti gli utenti hanno il privilegio di avere una vista perfetta o arti funzionanti. Questo non deve essere un ostacolo all’utilizzo del vostro tema, quindi dovrete eseguire dei test di accessibilità prima di lanciarlo.

WordPress ha le sue linee guida sull’accessibilità per gentile concessione del team Make WordPress Accessible. Un approccio corretto da adottare per i vostri test è quello di studiare le pratiche di accessibilità più vantaggiose. Ce ne sono molte da prendere in considerazione e sono suddivise in diverse categorie:

  • Sviluppo. Si tratta di aspetti come l’uso della paginazione o dello scorrimento infinito, l’etichettatura corretta dei moduli web, l’uso di HTML semantico, l’implementazione della corretta gerarchia delle intestazioni e molto altro ancora.
  • Contenuto. Si tratta di pratiche semplici, come l’apertura dei link nella stessa scheda, l’aggiunta di descrizioni con testo ALT e l’applicazione della leggibilità.
  • Design. Il dimensionamento dei caratteri e il contrasto dei colori sono argomenti importanti quando si parla di accessibilità, quindi dovreste concentrarvi su di essi durante lo sviluppo. La fase di test serve più che altro a perfezionare il sito.

Molte di queste pratiche saranno compatibili e allineate con le Linee Guida per l’Accessibilità dei Contenuti Web (WCAG) 2.0. Potete trovare delle checklist per individuare e testare gli elementi legati all’accessibilità del web. Le verifiche dello sviluppo, dei contenuti e del design daranno al vostro tema un’ottima base. Esistono anche corsi completi per imparare ad applicare i test di accessibilità del web ai vostri progetti.

Strumenti di verifica dell’accessibilità

Per quanto riguarda gli strumenti adatti, ci sono due raccomandazioni:

  • axe. Axe di Deque funziona come parte dei DevTools del vostro browser e automatizza una serie di test (a seconda del vostro account) in pochi secondi.
  • WAVE. WAVE di WebAIMs è uno strumento che potete utilizzare sia nel browser che attraverso un’estensione.

L’utilizzo congiunto di questi due strumenti è un modo eccellente per testare l’accessibilità. Ad esempio, potete iniziare con una rapida prova di accessibilità:

Una schermata di un sito web WordPress che mostra i risultati dei test di accessibilità nel browser DevTools. Sotto l'area del contenuto principale, un report mostra 34 problemi totali di accessibilità, tra cui 24 problemi di contrasto cromatico e nove problemi di ruolo ARIA.
Lo strumento Ascia si trova nel pannello di ispezione degli sviluppatori del browser.

Basta fare clic per avviare una scansione dell’intera pagina. I risultati evidenziano le aree da considerare e i potenziali modi per risolverle.

WAVE può sembrare complicatissimo, soprattutto se avete un gran numero di problemi da risolvere. Tuttavia, la sua sintesi dell’ordine e della struttura dei contenuti è preziosa per valutare come il vostro tema funzionerà con gli screen reader:

L'interfaccia dello strumento di valutazione dell'accessibilità web WAVE per un sito web WordPress. Il pannello di sinistra mostra le informazioni sull'accessibilità, con la scheda Ordine selezionata. Elenca gli elementi della pagina in ordine di lettura. Il pannello di destra mostra la homepage del sito web.
Lo strumento di accessibilità WAVE visualizzato nella barra laterale di sinistra.

Risolvere i problemi più generali con axe, come ad esempio gli avvisi generali sul contrasto dei colori, e poi approfondire i problemi di accessibilità con WAVE è un’ottima maniera di procedere. In questo modo, dovreste avere contenuti con la giusta gerarchia e struttura dei titoli, input accessibili nei moduli ed etichettatura.

Potreste anche testare la navigazione da tastiera e utilizzare il tema con uno screen reader per verificare la User Experience. In ogni caso, testare l’accessibilità del vostro tema non è semplicemente “un punto in più”, ma è essenziale per creare un web inclusivo.

Verifica delle prestazioni

La verifica delle prestazioni del tema garantisce un buon funzionamento per gli utenti. Può anche essere un elemento chiave per il vostro marketing. Molti temi promuovono prestazioni stellari, a dimostrazione dell’importanza di questo aspetto.

La stessa metodologia per testare le prestazioni del web si applica anche al test dei temi WordPress. Esiste un metodo completo per raggiungere questo obiettivo, anche se i vostri strumenti possono essere diversi.

Ad esempio, PageSpeedInsights o Lighthouse di Google sono ideali. Uno strumento come WebPageTest può essere una buona alternativa se volete un secondo parere. In ogni caso, ci sono molti strumenti di verifica delle prestazioni che possono adattarsi alle vostre esigenze.

Per quanto riguarda gli aspetti da testare, ci sono alcune aree chiave su cui concentrarsi:

  • Il Core Web Vitals deve essere sempre in buona salute, perché è la base delle prestazioni del vostro tema.
  • Ridurre al minimo le richieste HTTP e ottimizzare il caricamento delle risorse vi aiuterà a gestire meglio le risorse.
  • Query Monitor vi aiuterà a identificare e ottimizzare le query del database.
  • Se il vostro tema include immagini in bundle, assicuratevi che abbiano le dimensioni ottimali e che vengano compresse prima di impacchettarle.

La scelta di un design reattivo o adattivo deve essere fatta all’inizio dello sviluppo del tema. Qualunque sia la vostra scelta, dovete testarla per verificare che funzioni come desiderate. Non consigliamo di introdurre lo scorrimento orizzontale, la necessità di zoomare i contenuti, piccoli target touch o layout di visualizzazione che non si adattano alle dimensioni dello schermo.

A questo punto, potete intraprendere un test cross-browser. BrowserStack è un ottimo strumento per procedere con questo punto:

La homepage di BrowserStack, una piattaforma di test cross-browser. L'intestazione comprende i link di navigazione. Il titolo principale recita App and Browser Testing Made Easy con un sottotitolo che parla di test su oltre 20.000 dispositivi reali. In basso sono presenti sezioni per i diversi prodotti di test, tra cui Live, Automate, Percy e Accessibility Testing.
Il sito web di BrowserStack.

Infine, anche se i tempi di risposta del server non sono direttamente collegati al test dei temi, saranno importanti per i vostri utenti finali. Potreste consigliare dei provider adatti all’interno della vostra documentazione o della vostra sezione dedicata al marketing. Naturalmente Kinsta è velocissimo, robusto e sicuro.

Test di sicurezza

I test di sicurezza di WordPress dovrebbero essere una priorità assoluta. Il team di WordPress fornisce un’ampia documentazione per assicurarsi che il vostro tema sia sicuro da usare.

Tenete a mente questi principi:

  • Convalidate e sanificate tutti i dati che accettate attraverso il vostro tema. È una buona idea adottare un approccio cauto quando si tratta di input dell’utente e preferire la validazione alla sanificazione.
  • Per le fonti non attendibili, eseguite l’escape di tutto il più tardi possibile, di solito nella fase di output.
  • Affidatevi alle API di WordPress, che rappresentano un modo sicuro per gestire i dati all’interno del vostro tema.
  • I nonces di WordPress sono hash che aiutano a proteggere, convalidare e autenticare le richieste. Non sono un metodo di protezione di prima linea, ma possono contribuire a rafforzare le misure di sicurezza che avete già in atto.

Cross-Site Scripting (XSS), Cross-Site Request Forgeries (CSRF) e iniezioni SQL rappresentano alcune delle vulnerabilità più comuni per i siti web WordPress. Il vostro tema deve essere a prova di bomba quando si tratta di protezione. Seguendo questi principi fondamentali di sicurezza dei temi vi avvicinerete il più possibile a questo obiettivo.

Pratiche tipiche per rendere più fluido il flusso di lavoro per lo sviluppo di un tema

Lo sviluppo di temi all’interno di un’agenzia richiede un approccio diverso rispetto ai progetti singoli o piccoli. Avete bisogno di maggiore struttura, coerenza ed efficienza. Questo può essere ottenuto sviluppando i vostri standard di codifica interni per integrare quelli di WordPress. Per tenere traccia di problemi e bug si possono utilizzare flussi di lavoro collaborativi con Jira o Trello.

L'interfaccia di gestione dei progetti di Jira mostra una task board con tre sezioni principali: Lancio marketing, Sprint iOS e Backlog. Ogni sezione contiene le attività con il loro stato (Da fare, In corso, Fatto) e i membri del team assegnati, rappresentati da immagini circolari del profilo. La lavagna mostra un approccio strutturato all'organizzazione e al monitoraggio delle attività del progetto.
L’interfaccia di Jira.

Per garantire che il vostro team sia in linea con l’esigenza generale di qualità, ci sono alcune pratiche che possono aiutarvi:

  • Implementare un processo di revisione tra pari. Può trattarsi di una semplice revisione del codice da parte dei membri del team prima delle fusioni. In altre situazioni, potreste anche prendere in considerazione la programmazione in coppia.
  • Sviluppare componenti riutilizzabili. La creazione di una libreria di componenti e frammenti di codice riutilizzabili può dare la carica ai tempi di sviluppo. In alcuni casi, potete anche creare un framework completo per la creazione di temi futuri.
  • Implementare procedure di test complete. Potreste voler sviluppare una lista di controllo standardizzata per i test o includere i test di accettazione dell’utente (UAT) nel vostro flusso di lavoro.

Alcune di queste implementazioni riguardano pratiche DevOps tipiche e possono migliorare la qualità del lavoro della vostra agenzia. Ad esempio, il processo di Continuous Integration and Continuous Deployment (CI/CD) è una delle migliori implementazioni che possiate fare. Con gli strumenti giusti nella vostra pipeline, può aiutarvi ad automatizzare il processo di testing in molti modi. Il CI/CD è anche facile da inserire in un flusso di lavoro esistente e può farvi risparmiare ore preziose di test.

Riepilogo

Testare i temi WordPress è un passaggio necessario per garantire che il vostro prodotto sia robusto, affidabile e funzionante per i vostri utenti. L’adesione agli standard e ai requisiti ufficiali di WordPress non è negoziabile se volete pubblicare il tema nella Directory dei temi di WordPress. Queste linee guida sono valide anche per lo sviluppo di temi da parte di agenzie e altri soggetti che non pubblicano per il pubblico.

In ogni caso, un test completo dei temi WordPress è un investimento che richiede tempo e impegno. Se coprirete le aree principali che contano (funzionalità, accessibilità, prestazioni, sicurezza e qualità del codice) otterrete risultati soddisfacenti per i vostri clienti. Il rispetto degli standard di WordPress potrebbe rendere più facile il riutilizzo di un tema in futuro, una volta terminato il rapporto con il cliente.

Avete qualche consiglio su come testare un tema WordPress in base alla vostra esperienza personale? Condividetelo nella sezione commenti qui sotto!

Jeremy Holcombe Kinsta

Content & Marketing Editor presso Kinsta, web developer di WordPress e content writer. Al di fuori di tutto ciò che riguarda WordPress, mi piacciono la spiaggia, il golf e il cinema. Ho anche i problemi di tutte le persone più alte della media ;).