Progetti Content First e Mobile First: qual è la differenza?

I termini Content First e Mobile First nella progettazione di un Sito Web si riferiscono alla scelta di dare la precedenza alla visualizzazione da Device Mobili (Mobile First), oppure ai Contenuti (Content First): vediamo insieme qualche esempio.

Le immagini dell’articolo sono tratte da www.pexels.com

Mobile First: come progettare un Sito per Smartphone e Tablet

Dai Dispositivi Mobili può capitare spesso di non avere a disposizione una buona connessione Internet, è quindi importante adattare gli elementi del sito a questo aspetto, ad esempio comprimendo i file delle Immagini, limitando l’uso dei Video e delle animazioni, ed eliminando tutti gli elementi superflui che possono rallentare la navigazione da Mobile.

Può essere invece utile inserire la Geolocalizzazione del dispositivo per ottenere ad esempio le indicazioni stradali per raggiungere la Nostra Attività, oppure posizionare la barra di Ricerca in alto nello schermo, per essere immediatamente raggiungibile.

Anche il Menu di navigazione verrà adattato alle dimensioni ridotte del Dispositivo Mobile: le voci di menu non saranno visibili da subito, ma al tocco della “Burger Icon”.

Content First: diamo spazio alla Creatività

Il Content First generalmente è destinato ai Dispositivi fissi come PC Desktop e Smart Tv, che dispongono di Connessioni Internet veloci e schermi ad Alta Risoluzione.

Via libera quindi a Video e Immagini HD, ad effetti grafici e di navigazione più elaborati: tutte le sezioni e gli elementi del sito vengono arricchiti di contenuti per rendere più gradevole la User Experience.

Content First, Mobile First e Accessibilità da parte degli Utenti

Nello sviluppo di un progetto Web non bisogna dimenticarsi che gli Utenti che lo visiteranno possono avere particolari caratteristiche come ridotte capacità cognitive, difficoltà fisiche, disabilità, disturbi della vista o cecità.

I nostri Progetti devono trattare anche questo aspetto: esistono ad esempio delle Media Queries dedicate a dispositivi a Sintesi Vocale (“speech”), a supporti basati sull’uso del Braille (“braille”), e alle stampanti Braille (“embossed”).

Alcuni Utenti possono avvalersi degli Screen Reader, speciali software che “leggono” il contenuto dei Siti Web a chi non può vederli. Il Web Designer dovrà tenere a mente alcuni aspetti per rendere il proprio Sito compatibile con questi programmi, usando, dove possibile, Testi Alternativi e Link descrittivi che possono essere letti e compresi dallo Screen Reader. Un esempio è il Captcha per testare se un utente che compila un form è un umano o un bot: se scegliamo un’operazione aritmetica al posto di un file audio o un’immagine, sarà accessibile a tutti i navigatori del nostro Sito.

Nel codice HTML di sviluppo del Sito è importante compilare correttamente gli Attributi Alternativi delle Immagini, i Title dei link e i tag Label dei Form di contatto non solo per migliorare il posizionamento nella SERP di Google, ma anche per rendere queste informazioni accessibili a tutti gli Utenti che navigheranno nel nostro Sito.

E’ molto importante che Web Designer e Cliente decidano fin da subito se optare per un approccio Mobile First o Content First per ottenere il massimo dal proprio progetto Web e ottimizzare le tempistiche di sviluppo.