Come aggiungere un ridimensionamento dei caratteri in WordPress per l’accessibilità

State lottando per rendere il vostro sito WordPress veramente accessibile a tutti gli utenti? Probabilmente chi siamo ha sentito parlare di ridimensionamento dei font, ma implementarne uno che funzioni davvero senza rompere il layout del sito può essere una vera sfida.

Molti proprietari di siti WordPress pensano che le funzioni di zoom del browser siano sufficienti, ma spesso distorcono gli elementi della pagina e creano una cattiva esperienza per l’utente. Quello che vi serve è un ridimensionatore di font che permetta ai vostri visitatori di regolare facilmente la dimensione del testo, senza influenzare gli altri componenti della pagina.

Dopo anni di gestione di WPBeginner, abbiamo visto in prima persona che senza caratteristiche di accessibilità adeguate si rischia di allontanare una parte significativa del pubblico. Ecco perché abbiamo ideato due modi infallibili per aggiungere un ridimensionatore di font al vostro sito web WordPress.

Perché aggiungere testo ridimensionabile al vostro sito web?

Trovare il font giusto per il vostro sito WordPress è importante perché svolge un ruolo fondamentale nel rendere il vostro sito attraente e aiuta i visitatori a leggere i vostri contenuti.

Tuttavia, a volte potrebbe non essere sufficiente selezionare il font migliore per il vostro sito web. Se la dimensione dei caratteri è piccola, le persone avranno difficoltà a leggere i vostri articoli e finiranno per abbandonare il vostro sito.

Un modo più semplice per migliorare la leggibilità è offrire ai visitatori la possibilità di ridimensionare il testo principale del vostro sito. In questo modo gli utenti possono regolare le dimensioni del testo secondo i loro gusti e trascorrere più tempo sul vostro sito.

Anche se è possibile utilizzare la funzione di zoom integrata nel browser premendo i tasti “CTRL e +”, questa aumenta le dimensioni di tutti gli elementi della pagina e non solo del testo. Questo potrebbe rompere il layout del sito web e non fornire un’ottima esperienza all’utente.

Detto questo, vediamo come aggiungere facilmente del testo ridimensionabile per i vostri visitatori in WordPress.

Video tutorial

Se preferite le istruzioni scritte, continuate a leggere. Per passare a un metodo specifico, potete usare i collegamenti rapidi qui sotto:

Metodo 1: Aggiungere testo ridimensionabile in WordPress (solo per i temi WordPress classici)

Il modo più semplice per consentire agli utenti di ridimensionare il testo sul vostro sito web è utilizzare un plugin di WordPress come Accessibility Widget.

È un plugin gratuito per WordPress che consente di aggiungere un’opzione alla barra laterale del sito per modificare le dimensioni del testo. Il plugin è leggero e molto facile da usare.

Detto questo, si noti che il plugin Accessibility Widget non è compatibile con i temi Full Site Editing e a blocchi, quindi funzionerà solo se si utilizza un tema classico. Saprete che state usando un tema a blocchi se il personalizzatore di temi è assente nell’amministrazione di WordPress.

La prima cosa da fare è installare e attivare il plugin Accessibility Widget sul vostro sito web. Se avete bisogno di aiuto, consultate la nostra guida su come installare un plugin di WordPress.

Dopo l’attivazione, basta andare su Aspetto ” Widget dal pannello di amministrazione di WordPress. Successivamente, è possibile fare clic sul pulsante “+” e aggiungere il blocco “Accessibility Widget” alla barra laterale.

Successivamente, è possibile inserire un titolo per il widget, ad esempio “Cambia dimensione del testo” o “Ridimensiona testo”.

Successivamente, è necessario selezionare quali elementi HTML o classi CSS saranno influenzati dal widget. Le opzioni predefinite sono contenuto, paragrafo, elementi di elenco e celle di tabella. Queste opzioni dovrebbero andare bene per la maggior parte dei siti web.

Il widget consente fino a quattro opzioni di ridimensionamento. Le opzioni predefinite sono 90%, 100%, 110% e 120%. È possibile aumentare o diminuire le dimensioni dei caratteri inserendo le cifre nel campo “Imposta su queste dimensioni”.

L’ultima impostazione del widget è il testo del controllore, che verrà visualizzato dagli utenti. È possibile mantenere le percentuali predefinite per la dimensione del testo o utilizzare una lettera per mostrare diverse dimensioni di carattere.

Una volta terminato, basta fare clic sul pulsante “Aggiorna” per memorizzare le impostazioni del widget.

Ora potete visitare il vostro sito web per vedere il widget in azione. Ecco come dovrebbe apparire il widget nella barra laterale del vostro sito web:

Se si ritiene che il testo del controllore non sia evidente, è possibile modificarlo utilizzando i CSS.

Per farlo, basta accedere all’amministrazione di WordPress e selezionare Aspetto “ Personalizza.

A questo punto dovrebbero comparire alcune opzioni per personalizzare il tema classico.

Qui, selezionare “CSS aggiuntivi”.

Ora è possibile aggiungere del codice CSS per dare stile al widget. Ecco cosa abbiamo aggiunto:

.widget_accesstxt a {
border: 2px solid #000;
padding: 2px;
font-weight: bold;
}

Questo CSS aggiungerà un bordo intorno al testo del controllore, lo renderà grassetto e aggiungerà una piccola spaziatura interna. Una volta soddisfatto dell’aspetto del widget, basta fare clic su “Pubblica”.

Per maggiori dettagli, consultare la nostra guida su come add-on i CSS personalizzati in WordPress.

Metodo 2: Aggiungere testo ridimensionabile in WordPress (tutti i temi WordPress)

Un altro modo semplice per consentire agli utenti di ridimensionare il testo sul vostro sito web è utilizzare WP Accessibility. Questo plugin consente di aggiungere al sito una barra degli strumenti per modificare le dimensioni del testo, indipendentemente dal tema utilizzato.

La prima cosa da fare è installare e attivare il plugin WP Accessibility sul vostro sito web. Se avete bisogno di aiuto, potete consultare la nostra guida su come installare un plugin di WordPress.

Dopo l’attivazione, basta andare alla pagina WP Accessibility dal pannello di amministrazione di WordPress.

Nella sezione “Barra degli strumenti di accessibilità”, fare clic sull’opzione “Attiva barra degli strumenti di accessibilità” e selezionare “Dimensione carattere”. Questo aggiungerà un ridimensionamento dei caratteri alla barra degli strumenti.

Se necessario, è possibile attivare anche le opzioni Contrasto e Scala di grigi.

Inoltre, è possibile modificare la dimensione dei caratteri del contenuto quando si fa clic sulla barra degli strumenti. È anche possibile selezionare “Dimensione predefinita” nel menu a discesa, se non si è sicuri di cosa scegliere.

A parte questo, si consiglia di attivare l’opzione “Usa foglio di stile alternativo per il ridimensionamento dei caratteri”. Quando questa opzione è attivata, gli utenti possono facilmente passare dalle dimensioni predefinite dei caratteri a una versione più grande e leggibile del testo.

Sentitevi liberi di attivare altre impostazioni nel plugin.

Una volta fatto, basta fare clic sul pulsante “Aggiorna le impostazioni della barra degli strumenti”.

Ecco fatto!

Ecco come appare la nostra barra degli strumenti per il ridimensionamento dei caratteri sul front-end:

Per ulteriori informazioni, potete leggere la nostra guida su come migliorare l’accessibilità del vostro sito WordPress.

Con questi suggerimenti rendete il vostro sito WordPress ancora più facile da usare

Volete rendere il vostro sito più facile da usare e più bello? Selezionate queste utili guide:

• Come aggiungere la navigazione da tastiera con i tasti freccia in WordPress – Rendete più facile la navigazione all’interno del vostro sito.
• Come personalizzare i colori sul vostro sito web WordPress – Scegliete i colori giusti per dare al vostro sito un aspetto gradevole e facile da leggere.
• Come aggiungere un’animazione di precaricamento a WordPress (passo dopo passo) – Aggiungete una bella schermata di caricamento al vostro sito.
• Come aggiungere facilmente la modalità scura al vostro sito web WordPress – Permettete agli utenti di passare a un tema più scuro se lo preferiscono.
• Modi per creare un sito WordPress Mobile-Friendly – Assicuratevi che il vostro sito funzioni bene su telefoni e tablet.
• Come ottenere feedback sul design del sito web in WordPress (passo dopo passo) – Imparate a chiedere alle persone cosa pensano del design del vostro sito.
• Come evidenziare il testo in WordPress (Guida per principianti) – Imparate a far risaltare le parole importanti sulle vostre pagine.

Speriamo che questo articolo vi abbia aiutato ad aggiungere testo ridimensionabile al vostro sito WordPress. Potreste anche voler selezionare i nostri esperti tra i migliori builder per pagine WordPress trascina e rilascia e la nostra guida definitiva su come aggiornare il vostro tema WordPress senza perdere la personalizzazione.

Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.