Crei contenuti editoriali? Smettila di commettere alcuni degli errori comuni che vedo ancora troppo spesso tra i miei clienti, o nella mia vita quotidiana da lettore.

Ecco una guida pratica per creare contenuti accessibili e adatti a tutti i media. 

Perché oggi, affinché i tuoi contenuti vengono letti, compresi e apprezzati, La qualità editoriale non è più sufficiente. È anche necessaria prendersi cura del design dei contenuti : il suo formato, la sua struttura, la sua leggibilità e la sua capacità di adattarsi agli usi reali dei tuoi lettori.

Comprendere l'importanza dell'adattamento multischermo

Ancora oggi, vediamo troppi contenuti progettati principalmente per schermi desktop, mal strutturati, difficili da leggere e, paradossalmente, non sempre ottimizzati, nemmeno per schermi di grandi dimensioni. Eppure, entro il 2025, più di Il 70% del traffico web globale deriva dal mobile.

Sugli smartphone, questi articoli diventano infiniti, compatti, mal formattati e quindi rapidamente abbandonati.

L'obiettivo è scrivere e strutturare i contenuti in modo che siano adatti alla navigazione touch e allo scorrimento veloce, ma che siano anche ben visibili su schermi di grandi dimensioni. Per superare questi problemi, un approccio mobile-first è essenziale.

L'importanza di una buona definizione delle priorità con titoli chiari

Una buona gerarchia aiuta a scansiona velocemente e comprendere la struttura dell'articolo.

Per dispositivi mobili, favorire titoli brevi e incisiviUn buon titolo H2 o H3 dovrebbe permettere al lettore di comprendere l'articolo senza dover leggere il corpo del testo. Se estraessimo solo H1, H2 e H3 dal contenuto, otterremmo un riassunto chiaro dell'intero contenuto.

Gerarchia tipica:

• H1: Titolo univoco della pagina
• H2: Sezioni principali (ogni 300-500 parole)
• H3: Sottosezioni se necessario

È fondamentale differenziare visivamente i titoli in base alle loro dimensioni, rispettando un scala coerentePer questo puoi usare un scala modulare Spesso utilizzato durante la progettazione di un sistema di progettazione (ad esempio 1.250, 1.333, ecc.) per creare una progressione fluida tra i livelli.

Gestione del testo e dei paragrafi

Per una lettura fluida e piacevole, inizia con una griglia centrata con una colonna principale. Scegli una tipografia chiara con buon contrasto per evitare qualsiasi affaticamento visivo e non giustificare mai il testo, crea una spaziatura irregolare che rende difficile la lettura. 

Utilizzare il grassetto per le parole chiave e il corsivo per le sfumature; la spaziatura dovrebbe essere compresa tra 1.5 e 1.7 per rendere il testo più spazioso e facile da leggere, soprattutto sullo schermo.

Su dispositivi mobili: best practice per contenuti leggibili

Il mobile richiede più rigore nella strutturazione delle informazioni: i buoni contenuti devono essere fluidi, ariosi e veloci da navigare.

• Il testo non deve mai aderire ai bordi dello schermo, ricordarsi di aggiungere margini laterali di almeno 16 px
• Dimensione minima del carattere tra 14 e 16 px, per essere leggibile
• Evitate blocchi di testo troppo densi, poiché scoraggiano la lettura rapida durante lo scorrimento.
• Da 3 a 6 linee visive

Sul desktop: struttura, ventila, limita la larghezza

Anche su uno schermo di grandi dimensioni, il contenuto non dovrebbe occupare l'intera larghezza!

• Larghezza di lettura ideale tra 600 e 750 px massimo
• Dimensione del testo da 16 a 18 px
• Lunghezza della riga consigliata: da 60 a 75 caratteri per riga
• Da 2 a 4 righe massimo per paragrafo

Evidenziare l'essenziale senza sovraccaricare

Puoi strutturare il contenuto utilizzando elementi visivi discreti come elenchi puntati nel testo per evidenziare i punti chiave, incorniciato per segnalare ulteriori informazioni o avvertenze, e caselle di richiamo per evidenziare definizioni, dati importanti o riassunti. 

Questi elementi contribuiscono a dare ritmo alla lettura, a focalizzare l'attenzione su ciò che conta davvero e a migliorare la comprensione complessiva del contenuto. Tuttavia, troppi elementi visivi, come accennato in precedenza, possono compromettere la gerarchia.

Esempio di articolo NN/g https://www.nngroup.com/articles/ai-integration-condens/ su dispositivi mobili e desktop: struttura chiara, tipografia leggibile e layout arioso per una lettura confortevole.

Link e inviti all'azione (CTA)

Link nei contenuti editoriali

I link interni ed esterni arricchiscono un articolo, migliorano la navigazione, rafforzano la credibilità e contribuiscono alla SEO. Ma la loro integrazione deve essere attentamente valutata.

Gli utenti devono essere in grado di identificare rapidamente ciò che è interattivo, un collegamento deve essere chiaramente identificabile, per renderlo accessibile a tutti, comprese le persone ipovedenti o daltoniche, un collegamento deve essere identificabile in modo univoco, per convenzione spesso mettiamo un colore diverso con sottolineatura.

Si sconsiglia inoltre di trasformare un titolo (H1, H2, H3) in un link, a meno che non si tratti di un link interno a un'ancora. Inoltre, la formulazione del link deve essere descrittiva: evita affermazioni vaghe del tipo "clicca qui", preferendo invece ancore precise come "consulta la nostra guida completa all'UX editoriale".

CTA

Per essere efficace, una CTA deve utilizzare un verbo d'azione chiaro, conciso e coinvolgente per esempio: Scarica la guida, Richiedi un preventivo ou Visualizza l'articolo completoL'azione promessa dovrebbe sempre corrispondere al contenuto o alla pagina successiva, per evitare "trappole di clic", spesso frustranti per gli utenti.

Attenzione alle CTA camuffate da semplici link ipertestuali, perché rischiano di passare inosservate. Per massimizzare la loro efficacia, le CTA devono essere immediatamente identificabili, sia visivamente che semanticamente.

Posiziona le tue CTA in modo strategico, spesso dopo un blocco di informazioni o alla fine dell'articolo. Non esitare a ripeterle nei contenuti lunghi, nell'introduzione, nella parte centrale e nella conclusione, purché la loro presenza rimanga naturale e non invadente.

Elementi visivi

immagini

Le immagini svolgono un ruolo fondamentale nell'esperienza di lettura, ci permettono di rendere la lettura piacevole, rafforzare i messaggi e aggiungere informazioni visive.

Posiziona le immagini in modo strategico, dopo un paragrafo esplicativo, prima di un punto importante, per catturare l'attenzione. Tra i paragrafi consentono una pausa, una sorta di interruzione visiva o narrativa. Molto efficace per per riaccendere l'attenzione del lettore, illustrare un concetto forte o immergersi in un'atmosfera.

Evitate immagini "decorative" poco interessanti o immagini di repertorio eccessivamente generiche. Le immagini dovrebbero illustrare chiaramente l'idea o l'emozione del testo. Tuttavia, fate attenzione: troppe immagini rallentano il caricamento e distraggono dalla lettura. 

Per quanto riguarda l'accessibilità, non dimenticare di nominare le immagini in modo chiaro per renderle chiare e descrittive, e pensa al tag ALT descrittivo per gli screen reader.

Esempio di articolo NN/g https://www.nngroup.com/articles/ux-copy-sizes/ l'immagine rafforza la comprensione rispettando il ritmo della lettura, un elemento visivo pensato per tutti i media.

Infografica, illustrazioni e grafica

Questi elementi visivi svolgono un ruolo fondamentale: aiutano a riassumere efficacemente le informazioni chiave, semplificano concetti complessi, migliorano la memorizzazione e incoraggiano la condivisione dei contenuti.

Per renderli veramente utili, assicurati che siano progettati in modo chiaro e leggibile, con un testo sufficientemente ampio, soprattutto per la navigazione mobile. Ricorda che sugli smartphone l'immagine viene visualizzata in un formato ridotto, evita di forzare l'utente a ingrandire e assicurati che le informazioni siano visibili a prima vista, come su uno schermo desktop.

Tuttavia, il messaggio di un'illustrazione o di un'infografica non dovrebbe basarsi esclusivamente sull'aspetto visivo. Valuta la possibilità di accompagnarla con un testo descrittivo in modo che le informazioni siano accessibili anche a chi non può vedere l'immagine, soprattutto a chi utilizza uno screen reader. Se l'immagine contiene dati importanti, descrivili in modo chiaro e completo.

Video

Offrono un'alternativa interessante alla lettura tradizionale e possono aiutare a integrare le informazioni. Tuttavia, aggiungere un riepilogo o punti chiave Inoltre, questo è utile per gli utenti che preferiscono leggere o che non possono guardare il video.

Ospita video su piattaforme come YouTube o Vimeo per non aumentare il tempo di caricamento della tua pagina. Ricordati di attivare o disattivare i sottotitoli per migliorare l'accessibilità e consentire la visione senza audio.

Insomma

Un buon contenuto editoriale non riguarda più solo un buon testo. È un esperienza di lettura a sé stante, dove la forma è al servizio del contenuto, dove l'ergonomia contribuisce all'impatto tanto quanto la qualità editoriale. Si tratta di ricercare fluidità, gerarchia, equilibrio. In breve, si tratta di scrivere con chiarezza, ma anche con empatia.

Non dovresti trascurare l'esperienza desktop, ma i contenuti dovrebbero essere progettati in modo che siano pensati per i dispositivi mobili, per adattarsi a tutti i formati. Ricorda di testare il layout su dispositivi mobili reali, non solo con lo strumento di anteprima.

 

 

 

Anaëlle Staelen, progettista UX/UI e progettista di prodotto presso UX-Republic