Migliori Pratiche di Web Design per il Vostro Prossimo Progetto Web

A cosa si deve la grande discrepanza tra il prezzo che alcuni sviluppatori WordPress applicano rispetto ad altri? Per rispondere a questa domanda è necessario considerare il motivo per cui si desidera un sito web in primo luogo.

Alcuni sviluppatori si concentrano sul prodotto finale in senso letterale: la combinazione di codice che si traduce in un design del sito web abbastanza piacevole.

Ma gli sviluppatori con un buon senso del marketing non si preoccupano solo di costruire qualcosa di bello. Agiscono come consulenti per i clienti che cercano di raggiungere obiettivi specifici con i loro siti web.

Tenendo questo a mente, quando assumete qualcuno per costruire un sito web e questa persona non sembra interessata o non fa domande sui vostri obiettivi finali, dovete sentire un campanello d’allarme. È importante sottolineare il fatto che anche il più bel web design può non essere l’ideale quando si tratta di far convertire i visitatori in clienti.

Detto questo, il 94% delle persone giudica la vostra credibilità in base al design del vostro sito web.

Dovete quindi concentrarvi sull’utilizzo del vostro progetto per offrire all’utente l’esperienza ideale. Dovete rendere più facile per i visitatori trovare le informazioni che cercavano visitando il vostro sito web e guidarli verso le attività di conversione degli obiettivi.

Queste best practice di web design si concentrano sull’intersezione tra la creazione di un bel sito web e quello che serve al vostro business.

Preferite guardare la versione video?

Cosa Definisce le Migliori Pratiche di Web Design?

Se state a sentire, tutti hanno un’opinione su ciò che costituisce un sito web ben progettato.

Ma lasciamo da parte le opinioni di tutti e basiamoci solo su quello che dicono gli esperti.

Secondo Orbit Media, è possibile raggruppare le migliori pratiche di web design in queste tre categorie fondamentali di standard:

• Standard di marca: Forse vi suona più familiare sentir parlare di “branding”, “guide di stile” o “mood board”. Questi standard includono tutto ciò che ha a che fare con l’aspetto di un sito web e comporta l’uso di colori, tipografia ed elementi specifici per un business specifico.
• Standard di codifica: I siti web dovrebbero essere costruiti secondo gli standard di codifica concordati dal W3C, la comunità internazionale che lavora insieme per sviluppare standard web.
• Standard di accessibilità: L’accesso all’informazione è un diritto umano fondamentale, riconosciuto dalla Convenzione ONU per i diritti delle persone con disabilità. Oltre a questo, rendere il vostro sito accessibile ha effetti positivi non solo sulle vendite ma anche sulla SEO. Il W3C condivide un elenco di base di standard da seguire per progettare un sito web accessibile. Più avanti in questo articolo descriveremo in dettaglio le migliori pratiche di web design correlate.

Vediamo come sviluppare pratiche di web design basandoci su ciascuno di questi standard:

Standard di Brand

I siti web che mancano di un branding coerente possono generare stress e confusione durante l’interazione e la navigazione. Non dovrebbe quindi sorprendere che circa il 38% dei visitatori abbia dichiarato che smetterà di interagire con un sito web se il contenuto o il layout non è attraente.

Tenendo presente che l’aspetto non è tutto, ecco alcuni principi di base di progettazione da considerare per la creazione di un sito web che la gente amerà usare:

Equilibrio

L’equilibrio è il principio del design che prescrive come distribuire efficacemente gli elementi visivi. In generale, un design equilibrato appare pulito e naturale e ha una buona simmetria (anche se non è necessariamente una condizione per ottenere l’equilibrio).

È possibile incorporare l’equilibrio nel web design lavorando sul layout di pagina.

Centrare il testo o altri elementi in tutta la pagina è un modo semplice per farlo. In generale, le pagine web sono costruite su un sistema a griglia, che crea una forma di equilibrio. È possibile utilizzare la proprietà float del CSS per posizionare gli elementi e bilanciarli in tutta la pagina.

L’equilibrio può essere raggiunto in 3 modi:

1. Design Simmetrico

Significa disporre gli elementi in modo uniforme su tutta la pagina web. Ad esempio, se avete un elemento pesante a sinistra, dovreste avere un elemento pesante anche a destra. Come detto, la centratura è il modo più semplice per raggiungere la simmetria, ma a volte può risultare piatta o noiosa.

Per evitare di rendere la pagina monotona, potete creare un equilibrio utilizzando diversi elementi, come ad esempio il bilanciamento di un’immagine di grandi dimensioni con un blocco di testo. Esiste anche un tipo di equilibrio simmetrico chiamato equilibrio radiale, dove gli oggetti si irradiano da un punto centrale.

2. Design Asimmetrico

Più impegnativo del precedente, il design asimmetrico comporta la distribuzione irregolare degli elementi su una pagina. Per esempio, si può avere un elemento grande al centro bilanciato da uno più piccolo più lontano.

È possibile utilizzare altri elementi di design, come il colore o la texture, per bilanciare un design asimmetrico.

3. Sbilanciato

Questi tipi di design suggeriscono movimento e azione, ma possono mettere le persone a disagio. Se il vostro sito web intende far riflettere, allora un design sbilanciato può fare per voi.

Composizione

Il termine composizione si riferisce alla collocazione e all’organizzazione degli elementi di design.

La regola dei terzi è comunemente usata per creare una composizione equilibrata, soprattutto con le foto.

Spaziatura

Gli elementi devono essere equamente distanziati in modo che gli utenti possano differenziare sezioni o blocchi.

Dovreste anche introdurre lo spazio negativo o lo spazio tra e intorno al soggetto di un’immagine. Lo spazio negativo può ridurre il rumore visivo, aumentare la leggibilità e portare equilibrio.

È possibile introdurre lo spazio negativo aggiungendo margini e padding intorno agli elementi di design.

Punto Focale

Serve a creare un’area di attenzione laddove volete attirare l’attenzione. Dovrebbe essere la parte più importante della vostra pagina e, idealmente, ogni pagina dovrebbe concentrarsi su un solo punto focale.

Colore

Il colore è un elemento di design importante quando si tratta di branding. Idealmente, si entra nel processo di web design con la comprensione dei colori che si desidera associare al proprio marchio.

Per il web design in particolare, è molto d’aiuto partire con una moodboard per il vostro marchio.

Scegliere un colore primario e secondario (il colore secondario può completare o contrastare il colore primario), e una tonalità più chiara e più scura per ciascuno. Limitate l’uso del colore in modo che i vari accenti non diventino un pugno in un occhio.

Adobe Color fornisce un eccellente strumento gratuito per testare varie combinazioni di colori per creare una tavolozza di lavoro per gli elementi del sito web.

Inoltre, quando prendete decisioni sul colore è importante considerare coloro che sono daltonici, gruppo in cui rientra fino al 4,5% della popolazione mondiale.

Ci sono tre tipi di daltonismo (daltonismo totale, visione a due colori e visione dei colori carente), quindi assicuratevi che il vostro progetto sia ancora utilizzabile in considerazione di coloro che potrebbero non essere in grado di differenziare i colori.

Contrasto

Nella scelta del colore, è importante essere consapevoli dei rapporti di colore e del contrasto.

Il contrasto di colore si riferisce alla differenza di luce tra il primo piano e lo sfondo. L’utilizzo di colori sufficientemente contrastanti permette di distinguere facilmente la visibilità del sito web. In generale, utilizzate opzioni di colore ad alto contrasto (come il testo nero su sfondo bianco) per rendere il vostro sito leggibile.

Il rapporto di contrasto è il valore numerico assegnato alla differenza di contrasto tra gli elementi della pagina.

Le World Content Accessibility Guidelines (WCAG) 2.0 raccomandano un rapporto di contrasto di 4,5:1 per il testo normale. WebAIM condivide alcune combinazioni predeterminate che si adattano al rapporto di contrasto ideale per aiutarvi a visualizzare questa buona pratica di web design.

Per aiutare la navigazione usando questo rapporto, assicuratevi che, quando progettate il vostro sito web, stiate tenendo in considerazione tutto il vostro pubblico (comprese le persone con problemi di accessibilità). È più facile fare così piuttosto che affrontare questi problemi dopo.

Considerate tutti gli aspetti del sito web con cui le persone interagiranno, comprese le intestazioni, il footer, i menu: tutti devono essere facilmente visibili per essere utilizzabili.

Alcuni strumenti che potete utilizzare per controllare i rapporti di contrasto del colore includono:

• Color contrast checker di by Level Access..
• Contrast Ratio.
• WCAG 2.0 AA & AAA color contrast checker , che si basa sulle linee guida WCAG 2.0.

Tipografia

La tipografia del sito è un’altra importante considerazione in termini di branding.

Anche se ci sono molte risorse diverse in cui trovare potenziali font da utilizzare sul vostro sito web, vi conviene prima considerare le opzioni che verranno visualizzate in modo coerente indipendentemente dai font che l’utente finale ha installato sul proprio computer.

Google Fonts offre un’ampia varietà di font gratuiti e sicuri per il web su cui contare perché offrono una corretta visualizzazione, indipendentemente dai font/programmi installati dall’utente. Assicuratevi di includere i font nella vostra moodboard per vedere se corrispondono alla vostra estetica dei colori.

Se avete problemi a trovare delle combinazioni, Google Fonts può suggerirvi degli abbinamenti popolari. È inoltre possibile utilizzare un sito come FontPair per ottenere suggerimenti.

Cercate di limitare i pesi dei font che usate, poiché il dover caricare troppi file può contribuire a rallentare la velocità della pagina. A questo proposito, considerate la possibilità di ospitare Google Fonts a livello locale per introdurre ulteriori vantaggi in termini di prestazioni.

Quando si tratta di selezionare gli elementi tipografici in base alle migliori pratiche di web design, come regola generale, utilizzayr i font sans-serif per le intestazioni e i font serif per i contenuti. Non usate caratteri decorativi per il corpo del testo, perché sarà difficile da leggere.

Inoltre, non siate tentati di utilizzare una grande varietà di font diversi sul vostro sito web. Una buona regola empirica è quella di utilizzare un font per il vostro logo, un altro per i vostri menu/intestazioni e un altro ancora per il corpo del testo. Su questa nota, provate ad accoppiare i font che si completano a vicenda, come quelli della stessa famiglia di font.

Gerarchia degli Elementi

La gerarchia si riferisce alla disposizione degli elementi di design che mostrano l’importanza relativa. Questo si ottiene manipolando elementi come il contrasto visivo, le dimensioni e i posizionamenti per richiamare l’attenzione.

Ad esempio, il contenuto deve essere suddiviso in blocchi logici in modo che gli utenti possano distinguere una dall’altra le sezioni.

Potete farlo attraverso l’uso di content headers, che non solo rendono facile per gli utenti saltare alle parti che vogliono leggere, ma anche spezzare grandi quantità di testo in pezzi leggibili in modo che i lettori siano in grado di determinare il contesto di ogni sezione.

Se siete alla ricerca di alcune utili illustrazioni visive di questi concetti di design e non solo, il blog di The Tilda Publishing copre alcuni dei più comuni errori di progettazione di pagine web e come correggerli.

Migliori Pratiche di Design/Formattazione sul Web

Secondo una ricerca di Orbit Media, ci sono alcuni standard comuni di web design osservati nei primi 50 siti web di marketing.

Per “standard” si intende che l’80% dei siti web utilizza un approccio progettuale simile:

• Logo in alto a sinistra.
• Navigazione orizzontale principale nella parte superiore di ogni pagina.
• Proposta di valore in alto sulla homepage situata nella parte alta dello schermo (il “taglio”). Si noti che la maggior parte dei web designer vi dirà che non c’è un’altezza standard dei pixel per i browser, e tecnicamente non esiste un “taglio”, come nelle pagine cartacee. Ma, in generale, gli elementi di design importanti dovrebbero apparire in alto sulle pagine che sono generalmente visibili alla maggior parte dei visitatori, anche senza scorrere.

Ecco alcune best practice di web design per gli elementi comuni del sito:

Immagini

Le migliori pratiche di web design per l’utilizzo delle immagini potrebbero ispirare molti tomi di consigli, ma concentriamoci sul minimo indispensabile in questa discussione sulle migliori pratiche di web design:

• Aggiunta dell’ALT text. Le immagini non possono essere elaborate con i lettori di schermo a meno che non venga utilizzato l’ALT text. L’aggiunta di un ALT text migliora anche la SEO, ma alcune persone lo usano solo per integrare la loro strategia di parole chiave. Un uso più utile del testo ALT sarebbe quello di descrivere l’immagine, cosa che potrebbe certamente soddisfare i crawler di ricerca e i lettori di schermo allo stesso tempo, se fatto con il giusto approccio.
• L’utilizzo di immagini con volti umani tende ad essere più efficace di altri grafici o animazioni. Rende le persone più propense a immedesimarsi nell’immagine, poiché gli esseri umani sono attratti da ciò che percepiscono come vera empatia ed emozioni.
• Utilizzare immagini responsive, che crescono o si restringono a seconda delle dimensioni del browser. Questo aiuta sia con la velocità del sito che con la SEO.
• Non dimenticate mai le favicon. Le favicon sono quelle piccole icone che appaiono accanto al titolo del sito e anche nei risultati di ricerca. Aiutano il tuo marchio a farsi riconoscere e migliorano la UX del sito.

Navigazione del Sito Web

Gli utenti si aspettano di poter trovare facilmente i contenuti che stanno cercando su un sito. Pertanto, è importante che la navigazione sul sito web sia semplice e diretta.

Navigazione del sito web è un termine generale che si riferisce all’architettura interna dei link di un sito web. Non dimenticate che lo scopo principale della navigazione è quello di aiutare gli utenti a trovare facilmente contenuti rilevanti sul vostro sito.

L’architettura dei link interni del vostro sito costituisce la base della vostra sitemap, che aiuta i motori di ricerca ad accedere più facilmente ai vostri contenuti. Si è scoperto che avere un sito ben progettato in cui i contenuti sono facili da trovare influenza positivamente il traffico del sito web che otterrete dai motori di ricerca (insieme ad una maggiore possibilità di ottenere sitelink di Google).

Navigazione del Menu

Ci sono diversi aspetti che compongono la navigazione di un sito web, ma il vostro menu principale dovrebbe essere un punto focale primario in quanto sarà una delle prime cose con cui gli utenti interagiranno visitando il vostro sito web.

Ci sono diverse euristiche di design del menu del sito web, ma le più popolari includono:

Menu di Navigazione

Idealmente, questo si trova nella parte anteriore e al centro di un sito web. Questo potrebbe comportare l’uso di un menu a tendina se ci sono diverse categorie. Tuttavia, i menu a tendina non sono consigliati, soprattutto quando si tratta di SEO tecnica (sono più difficili da scansionare). Inoltre, si è scoperto che la maggior parte delle persone non ama i menu a tendina.

Questo perché l’occhio umano lavora più velocemente della mano, e quindi la gente trova fastidioso vedere altri elementi a discesa quando ha già deciso dove vuole fare clic: questo può portare a una diminuzione delle visite alle pagine.

Hamburger Menu

Utilizzato principalmente per un design ottimizzato per i cellulari, l’hamburger menu si trova di solito in alto a sinistra o a destra della pagina. Si presenta come un quadrato con tre linee che possono essere espanse con un clic. Tuttavia, molti designer non amano l’hamburger menu, cosa che ha ispirato chi si occupa di sviluppo web a considerare nuovi modi per rendere divertente e funzionale la navigazione dei siti per cellulari.

Ecco alcuni consigli per progettare la navigazione basata sulle migliori pratiche di web design:

• Aggiungete una barra di ricerca per aiutare gli utenti a trovare facilmente i contenuti (ecco come migliorare la funzionalità di ricerca di WordPress). Questo è particolarmente utile per i siti web che hanno molti contenuti, come un blog di notizie.
• Progettate il vostro sito seguendo la regola dei tre clic, secondo la quale gli utenti devono essere in grado di trovare le informazioni desiderate in non più di tre clic del mouse. Questo perché in realtà gli utenti preferiscono navigare in un sito piuttosto che cercare tra i risultati della ricerca, quando possibile.
• Rendete i titoli dei vostri menu descrittivi (tenendo conto delle parole chiave), il che aiuta gli utenti a trovare le voci più facilmente e contribuisce anche positivamente alla SEO.
• La posizione delle voci di menu è importante. Mettete le pagine più importanti nella parte anteriore del vostro menu in modo che siano facilmente accessibili.
• Mantenete al massimo 7 voci di menu, non solo per mantenere pulito il design del sito, ma anche perché avere troppe categorie di voci di menu può potenzialmente influenzare la vostra capacità di posizionamento nella ricerca. Google può interpretare queste categorie apparentemente non correlate come un segno che il vostro sito web non ha scelto una nicchia specifica.

Per un formato più comodo, ecco una pratica infografica:

Standard di Codifica

Con così tanti siti web creati e consumati a livello globale, c’è certamente bisogno di un insieme standardizzato di principi di codifica. Alcuni aspetti di questi standard web includono:

SEO

La SEO può essere utilizzata per aumentare il numero di visitatori del vostro sito in modo organico (senza l’uso di annunci). Poiché è troppo complicato approfondire adeguatamente nella SEO in una piccola sottosezione di un articolo, date un’occhiata alla nostra checklist SEO e ai nostri suggerimenti per i migliori plugin SEO WordPress per familiarizzare con questo aspetto delle migliori pratiche di web design.

Tenete a mente che i seguenti suggerimenti per gli standard di codifica lavorano di pari passo con la SEO.

Responsività da Dispositivi Mobili

Il design responsivo si occupa di creare un’ottima esperienza utente, indipendentemente dal dispositivo o dal browser utilizzato per accedere al vostro sito web.

Oggi più che mai è importante progettare il proprio sito web in modo che sia responsive, dato che oltre il 60% degli utenti di Internet vi accede tramite cellulare e metà delle transazioni di ecommerce avviene tramite piattaforme mobili. Inoltre, il nuovo algoritmo di ricerca di Google dà priorità anche ai siti mobile.

Avere un sito responsive non solo aiuta gli utenti a navigare più facilmente nel vostro sito, ma contribuisce anche ad aumentare l’engagement e le conversioni. Gli utenti raccomandano i brand con i quali hanno un’esperienza positiva sul sito mobile e, al contrario, non solo smetterebbero di acquistare da brand che offrono una cattiva esperienza da mobile, ma scoraggerebbero attivamente gli altri a farlo.

Tuttavia, nonostante avere un sito responsive sia ormai cruciale, si stima che il 91% delle piccole imprese non ne abbia uno. Eppure dovrebbero, visto che la progettazione di un sito responsive paga. Il 62% delle aziende ha registrato un aumento delle vendite dopo la progettazione di un sito web responsive.

Leggete questa guida di Kinsta su come rendere il vostro sito più mobile-friendly, nella quale abbiamo incluso anche un elenco dei migliori plugin WordPress per dispositivi mobile da scaricare, e assicuratevi di dare un’occhiata a questa lista sui migliori temi WordPress, dove potrete trovare un sacco di temi responsive.

Anche Google offre alcuni suggerimenti per la progettazione di un sito web responsive.

Sicurezza del Sito Web

Un’altra importante buona pratica di codifica? Creare software e siti web sicuri a cui gli utenti possano affidare le loro informazioni personali sensibili. Contrariamente a quanto si crede, gli hacker non cercano attivamente siti web specifici da hackerare, motivo per cui anche i siti web più piccoli sono vulnerabili agli attacchi.

Nel complesso, WordPress è generalmente sicuro, ma prendere ulteriori precauzioni per mantenere il vostro sito web sicuro è sicuramente meglio.

Ecco alcune delle migliori pratiche di sicurezza per un sito web:

• Ottenere un certificato SSL, cosa particolarmente importante per i siti che si occupano di pagamenti e informazioni personali. Il certificato SSL codifica le informazioni inviate attraverso le reti in modo che gli hacker abbiano difficoltà a decodificarle. Si tratta inoltre di uno standard di settore. Chrome avvisa i visitatori quando il sito che stanno visitando non possiede un certificato SSL. Oltre a questo, Chrome sta ora deprezzando le versioni precedenti di TLS e ha iniziato a mostrare ulteriori avvertimenti.
  L’abilitazione dell’HTTPS (parte dell’installazione di un certificato SSL) è anche un fattore di ranking ufficiale di Google.
• Mantenete le vostre credenziali di accesso al sicuro. Diversi attacchi sono causati da hacker che cercano di accedere con la forza a un sito web. Aiuta avere una pagina di login separata/nascosta (utilizzando per esempio il plugin WP Hide Login) e limitare il numero di tentativi di login. Utilizzando il plugin Login LockDown potete registrare l’indirizzo IP e il timestamp di ogni tentativo di login fallito e bloccare la funzione di login se il numero di tentativi falliti dallo stesso intervallo IP viene raggiunto in un breve periodo di tempo. Inoltre, create una password sicura che contenga più di 6 caratteri e che sia un mix di lettere maiuscole e minuscole, numeri e caratteri speciali. Cambiate spesso la vostra password. È inoltre possibile utilizzare l’autenticazione a due fattori per il login se desiderate una maggiore sicurezza.
• Mantenete aggiornati il core di WordPress, i plugin e i temi. Non dimenticate di scaricare plugin o temi da una fonte affidabile. Un buon segno è quando il plugin/tema è stato installato molte volte ed è stato recentemente aggiornato. Dovreste anche leggere le recensioni per valutare l’affidabilità del plugin (assicuratevi di controllare quelli elencati qui). Scaricate quindi un plugin di sicurezza per WordPress come Wordfence, Sucuri, o Defender, in quanto il 73,2% delle vulnerabilità WordPress può essere rilevato utilizzando strumenti automatici gratuiti. Ecco un elenco più completo dei migliori plugin di sicurezza.
• Utilizzate un web host sicuro. Potrebbe sembrare che il vostro web host non abbia nulla a che fare con la sicurezza del sito, ma il 41% degli attacchi avviene attraverso una vulnerabilità di sicurezza sulla piattaforma di hosting. Cercate un provider di hosting che includa caratteristiche come firewall e crittografia lato server, server web NGINX o Apache, software antivirus e anti-malware, sistemi di sicurezza in loco e la disponibilità di certificati SSL e di un CDN.

Per ulteriori informazioni sulla sicurezza di WordPress, consultate la nostra risorsa completa su come mantenere il vostro sito WordPress sicuro.

Velocità della Pagina

Circa la metà degli utenti si aspetta che un sito si carichi in 2 secondi o meno, e quando ci vuole più tempo, il 40% delle persone non esiterà a lasciare la pagina e (probabilmente) non tornare mai più.

Oltre alle visite al sito web, la velocità delle pagine è importante in quanto influisce anche sulla conversione e sulle entrate. Per ogni secondo di velocità di caricamento delle pagine aggiunte, le vendite diminuiranno fino al 27%. L’aumento della velocità del sito web può prevenire la perdita del 7% delle possibili conversioni.

Ecco alcuni modi per velocizzare il caricamento delle vostre pagine web:

• Utilizzate una Content Delivery Network (CDN), che prende file statici come immagini, CSS e JavaScript e li distribuisce sui server più vicini alla posizione fisica dell’utente.
• Considerate il modo in cui usate le immagini. Un sito web utilizza in media 1,8MB di immagini, che rappresentano il 60% delle dimensioni di un sito. Per aiutarvi, ripensate a come allestire la vostra pagina web. Se volete mantenere la velocità della pagina, cercate di ridurre il numero di immagini di grandi dimensioni utilizzate nel vostro progetto e assicuratevi di ottimizzarle.
• Se il vostro sito web ha bisogno di utilizzare molte immagini di grandi dimensioni, utilizzate i plugin che includono funzionalità per la compressione GZIP, il caching o l’ottimizzazione delle immagini, come WP Rocket e Imagify. Possono aiutare a rendere i vostri file più piccoli (senza sacrificare la qualità) in modo che si carichino più velocemente.
• Considerate il numero di plugin e file che tenete nel vostro database WordPress, poiché possono anche influenzare la velocità di caricamento delle pagine. Rimuovete quelli che non usate. Già che ci siete, tenete il vostro PHP, il core di WordPress e i plugin aggiornati alle loro ultime versioni.

Date un’occhiata alla nostra risorsa guida per l’ottimizzazione della velocità del sito web.

Standard di Accessibilità

Internet è stato progettato per essere usato da tutte le persone, indipendentemente dall’hardware specifico, dal software, dalla lingua che utilizzano, dalle loro capacità o dalla loro posizione. Tuttavia, molti sacrificano l’accessibilità per un bel design.

Oltre che alle persone con disabilità che hanno problemi di accesso al web, il W3 ricorda che curare l’accessibilità del sito web è anche vantaggiosa per:

• Coloro che utilizzano dispositivi con schermi piccoli, diverse modalità di input, ecc.
• Le persone anziane.
• Persone con “disabilità temporanea”, come un braccio rotto, occhiali persi o una specifica condizione medica.
• Utenti con “limitazioni di circostanza”, come le persone che accedono a Internet su dispositivi in pieno sole o in un ambiente in cui non possono ascoltare l’audio, come i mezzi di trasporto pubblico.
• Individui con una connessione Internet lenta.

L’accessibilità dovrebbe essere una preoccupazione di tutti, perché tutti ne siamo in qualche modo interessati.

Ragioni per Rendere il Vostro Sito Accessibile

Non siete ancora sicuri che valga la pena spendere tempo sull’accessibilità quando si parla delle migliori pratiche di web design?

Considerate questi motivi:

• È un requisito dell’ADA. L’Americans with Disabilities Act (ADA) è stato approvato nel 1990 per proteggere i diritti civili delle persone con disabilità dalla discriminazione. Riguarda settori come i trasporti, le telecomunicazioni, l’occupazione e persino le norme edilizie. Poiché questa legge è stata approvata quasi 30 anni fa, in un’epoca in cui internet non era così onnipresente, i legislatori stanno cercando di modificarla.
• Favorisce l’inclusività. Un’indagine del Pew Research Center mostra che le persone con disabilità hanno tre volte meno probabilità di andare online rispetto alle loro controparti senza disabilità, il che è un peccato poiché le statistiche mostrano che circa il 30% dei professionisti ha una disabilità, con il 62% di quelli con disabilità “che volano basso” per paura di pregiudizi negativi.
• Vi aiuterà a migliorare gli affari. Essendo più inclusivi, vi avvicinerete a una rete di persone con disabilità, che rappresenta 7 miliardi di dollari di reddito disponibile (negli Stati Uniti).
• Vantaggi SEO. I motori di ricerca premiano i siti web che sono conformi all’accessibilità per incoraggiare un maggior numero di siti web ad essere accessibili.

Come Rendere il Vostro Sito Più Accessibile

Un modo semplice per rendere il vostro sito web più accessibile è quello di installare il plugin WP Accessibility, che aggiunge funzionalità di accessibilità tra cui:

• Una barra degli strumenti dove gli utenti possono ridimensionare i font e visualizzare il vostro sito con alto contrasto e in scala di grigi.
• Confrontare il contrasto di colore per verificare se si adatta agli standard di accessibilità.
• Rimozione degli attributi titolo dalle immagini inserite nel contenuto. La maggior parte dei lettori di schermo non è in grado di percepirli e leggono invece l’anchor text.
• Abilitazione dei link di skip, ovvero i link interni alla pagina che permettono agli utenti di saltare direttamente al contenuto, utile per chi usa gli screen reader.

Qualche passo in più da fare:

• Aggiungete sottotitoli o una trascrizione se il vostro sito produce media come audio, audiolibri, video, podcast e così via, a beneficio sia dei sordomuti sia delle persone che vogliono consumare i vostri contenuti ma non possono vedere i media in pubblico.

• Creare link e menu accessibili da tastiera per le persone con disabilità motorie e che possono utilizzare solo una tastiera (non il mouse) per navigare nel vostro sito. I menu a tendina sono sconsigliati, ma si può rimediare assegnando delle scorciatoie per ogni voce a tendina (ad esempio: premere “1” per l’homepage, “2” per la pagina di approfondimento, ecc.)
• Infine, provate il vostro sito per verificare l’accessibilità del sito. La Web Accessibility Initiative non sostiene alcuno strumento specifico, ma offre invece un elenco di strumenti che potete utilizzare per verificare il risultato dei vostri sforzi.

Pensieri Finali: Migliori Pratiche di Web Design per il Vostro Prossimo Progetto Web

I buoni siti web non dovrebbero limitarsi a essere definiti da un design oggettivamente buono. Altrettanto importanti sono l’usabilità del sito, la facilità di navigazione e l’accessibilità. Armati di queste best practice di web design, avete tutto ciò che vi serve per creare qualcosa che abbia un bell’aspetto e funzioni bene.

Tenete presente che queste sono le migliori pratichedi web design. A seconda della natura del vostro sito web, è probabile che non sarete in grado di metterle tutte in pratica. Ma prima di poter infrangere le regole, è utile essere almeno consapevoli del perché esistono.

Ci siamo persi qualcosa di importante? Condividete le vostre migliori pratiche di web design nei commenti qui sotto!

Lettura consigliata: I Migliori Corsi di Web Design Online