Errori che molto probabilmente hai già commesso come web designer
Tutti i web designer vogliono la perfezione. Tuttavia, sono solo esseri umani e gli errori possono sempre apparire. È così facile semplicemente trascurare alcuni dettagli. Non c’è designer al mondo che non abbia commesso errori ed evitarli è una cosa che normalmente accade dopo un po’ di tempo.
Parleremo ora di alcuni degli errori più comuni che i web designer commettono costantemente, quelli che molto probabilmente hai già fatto almeno una volta. Correggi le tue cattive abitudini e supera gli ostacoli di cui sei attualmente colpevole in modo che il tuo lavoro sia migliore che mai.
L’uso del flash
Nella moderna progettazione di siti Web raramente vediamo Flash utilizzato anche se è piuttosto sorprendente in quello che può fare. Siamo di fronte alla possibilità di offrire al visitatore un’esperienza animata che è impressionante ma c’è un bagaglio associato.
Ci sono diversi problemi che appaiono con l’utilizzo di Flash nel web design. Hai un tempo di caricamento più lungo, problemi con gli utenti mobili a causa della mancanza di supporto e del diverso linguaggio di programmazione utilizzato. Il numero di dispositivi che attualmente supportano Flash è molto basso. Inoltre, in futuro non prevediamo un maggiore supporto. Le nuove librerie appaiono più forti e più popolari, specialmente quelle basate su JavaScript come AngularJS e jQuary.
Utilizzo di immagini davvero grandi
La tendenza moderna nel web design è quella di utilizzare immagini di grandi dimensioni in tutto il sito. Ciò renderà sicuramente l’esperienza più piacevole e l’utente avrà qualcosa di bello da vedere, ma ci sono alcune complicazioni di cui il progettista e lo sviluppatore devono essere consapevoli.
Il caricamento della pagina viene aumentato automaticamente ogni volta che vengono utilizzate immagini più grandi. Questo può portare a uno scenario molto negativo per il visitatore del sito. La buona notizia è che abbiamo accesso a vari strumenti diversi che aiutano molto con l’ottimizzazione delle immagini. Quelli che potresti prendere in considerazione includono:
App come PrePros possono aiutare a ottimizzare automaticamente le immagini all’interno delle applicazioni. Il problema è che gli strumenti aiuteranno i flussi di lavoro ma non risolveranno l’enorme problema associato al tempo di caricamento, almeno non completamente.
Molti designer ora usano SVG. Usano codici per animare e disegnare grafica in un ambiente browser. Ci ritroviamo quindi con un caricamento della pagina accelerato e vari elementi che catturano l’attenzione.
Dovremmo anche evidenziare il fatto che le immagini più grandi complicheranno il web design a causa del fattore non reattivo. Stiamo parlando di un elemento di design che ha fissato altezza e larghezza. I browser ridimensioneranno le immagini ma abbiamo le stesse dimensioni del file.
Il W3C ora lavora sull’utilizzo di " <picture>" come elemento HTML5. Ciò consentirebbe di richiamare immagini di dimensioni diverse in base alla larghezza dello schermo di visualizzazione. Quando ciò accade, l’esperienza sarebbe molto migliore per lo spettatore ma fino all’implementazione, dovresti evitare le immagini più grandi.
Utilizzo di larghezza e altezza fisse
L’adattamento viene automaticamente limitato per gli utenti quando vengono codificate dimensioni fisse. Abbiamo soluzioni alternative, ma dobbiamo sempre pensare a creare un modello di web design che sia reattivo al 100%. L’altezza fissa impostata in CSS può limitare l’area visualizzabile per l’utente. Andare oltre è possibile attraverso gli aggiustamenti delle media query, ma il codice aggiuntivo che viene aggiunto porterà a problemi di prestazioni. Non ne hai davvero bisogno. Nella maggior parte dei casi non dovresti usare dimensioni fisse. Devono essere evitati il più possibile nel moderno ambiente di web design.
Fare ipotesi sugli adattamenti di progetto
I web designer normalmente lavorano con software come Adobe Photoshop o Sketch. Al termine del lavoro, il presupposto comune è avere un punto di interruzione specifico nel flusso di lavoro reattivo. Le larghezze dello schermo considerate standard copriranno molte dimensioni di schermi diverse, ma non è una certezza coprirle tutte. Abbiamo migliaia di dispositivi mobili disponibili sul mercato. Creare un design che funzioni per tutto è molto difficile.
Quando lavori su larghezze specifiche, devi pianificare e la lungimiranza diventa un’abilità importante per il web designer. Devi essere sicuro che non vengano fatte ipotesi e che lavorerai effettivamente all’interno del browser dopo che il normale lavoro dell’editor grafico è terminato.
Utilizzo di troppi effetti e animazioni
Puoi vedere questo problema anche su alcuni dei siti più popolari al mondo. Così tanti siti Web offrono un’esperienza mozzafiato, molti dei quali offrono qualcosa di veramente unico e sorprendente. Tuttavia, questo non significa aggiungere quanti più effetti e animazioni potresti. È molto importante coniugare i principi del web design con lo scopo di trovare il giusto mix tra funzionalità e impatto grafico.
Ci sono due grossi problemi associati a esagerare con animazioni ed effetti:
- Il tempo di caricamento della pagina è aumentato
- Gli effetti e l’animazione saranno problematici per i computer più vecchi
Gli hack e le animazioni popolari al momento sono quelli che aggiungono elementi di dissolvenza in entrata, su o giù. Possono avere un bell’aspetto e renderanno i siti fantastici, ma ciò non significa che dovresti sempre usarli. Verifica se il caricamento complessivo della pagina sarebbe eccessivo per i dispositivi utilizzati dalla maggior parte dei visitatori e non dimenticare mai la velocità di caricamento della pagina. Questi sono molto importanti e devono offrire sempre grandi esperienze ai visitatori.
Collegamenti di stile improprio
Questo è un errore molto più comune di quanto si possa pensare in questo momento. I collegamenti devono sempre fare quello che fanno. Ciò significa che quando un collegamento ha uno stile improprio, le persone non capiranno che si tratta di collegamenti. Dobbiamo sempre pensare ai visitatori, quindi i collegamenti devono sempre apparire come collegamenti. Puoi sperimentare e non attenersi alla sottolineatura blu standard, ma non dovresti mai esagerare.
Non usare DRY nei CSS
Nel caso non lo sapessi, DRY significa “Non ripeterti". È un metodo nel web design e in pratica significa che il progettista è aiutato a mantenere il codice conciso e clonare. Solo l’uso del codice necessario è sempre consigliato per lo stile del sito web.
Quando si utilizzano i CSS tradizionali, è necessaria molta ripetizione con elementi specifici utilizzati all’interno di altri elementi. I selettori finiscono per essere davvero grandi e ci vorrà molto tempo per scrivere effettivamente. Quando usi le classi nel design invece di dare uno stile a ogni singolo elemento nella pagina HTML, tutto diventa molto più semplice.
Un’ottima idea al momento è utilizzare linguaggi di pre-elaborazione come Sass. Sono piuttosto utili in termini di tecnologia CSS necessaria. I linguaggi utilizzati accelereranno lo sviluppo e la progettazione grazie al fatto che includono funzionalità come variabili, funzioni, mixin, annidamenti e molto altro ancora. Il codice prodotto verrà quindi compilato nel codice CSS. Gli sviluppatori Web e i web designer possono ora utilizzare meno righe di codice e la ripetizione può essere facilmente evitata grazie ai linguaggi.
Grazioso Degrado
Possiamo definire Graceful Degradation come una pratica di creazione di funzionalità Web in grado di offrire un livello di esperienza utente specifico in un browser moderno mentre si degrada a livelli di esperienza utente inferiori nei browser precedenti. Sembra un po’ complesso ma, ad esempio, possiamo parlare del supporto di Internet Explorer 8 e 7. Saresti sorpreso di apprendere che la maggior parte degli utenti semplicemente non aggiornerà i browser per lunghi periodi di tempo. Per questo motivo, è necessario aggiungere un grazioso degrado in modo che sia presente un supporto adeguato per entrambe le versioni del browser.
I siti Web moderni sono facili da sviluppare, ma in un secondo momento potresti finire per notare il fatto che in un browser più vecchio le pagine sembrano davvero brutte a causa di dipendenze specifiche.
Miglioramento progressivo
Questo è qualcosa che è simile al Grazioso Degrado di cui sopra. La differenza è che il processo viene gestito al contrario partendo dal livello di esperienza di base supportato in ogni singolo browser web. Quindi, il progettista/sviluppatore aggiunge una maggiore funzionalità disponibile per i browser che potrebbero utilizzarla.
Sia questa opzione che quella sopra sono complicate. Normalmente sono usati solo dai designer davvero bravi. Tuttavia, con molti browser attualmente disponibili, dobbiamo considerare seriamente le opzioni. I web designer normalmente faranno decidere ai clienti esattamente cosa verrà supportato. Tuttavia, devi provare a utilizzare questi approcci per offrire un’esperienza davvero eccezionale agli utenti particolarmente attivi e all’interno del pubblico di destinazione.
Una delle parti più importanti di qualsiasi sito web là fuori è la navigazione. Il designer deve essere in grado di rendere naturale l’esperienza del visitatore. Lo scopo è rendere la navigazione davvero semplice ed intuitiva. Un utente capirà automaticamente che l’esperienza è corretta quando il design ha preso in considerazione questo elemento.
Ogni volta che l’esperienza utente è scarsa, vediamo i visitatori frustrati. Semplicemente non visitano più un sito specifico e cercano in altre pagine le soluzioni ai loro problemi. L’usabilità deve essere sempre considerata dal progettista. Il design deve avere un bell’aspetto, ma non bisogna mai dimenticare la funzionalità. La facilità d’uso è necessaria e la sua mancanza renderebbe inutile l’intero progetto.
Mancanza di concentrazione sui contenuti
“Form Follows Function” è un principio di architettura molto comune che è apparso nel XX secolo, proprio durante la fase del design industriale dell’architettura moderna. Questo è un principio che devi sempre ricordare nel web design.
Il web e il design grafico sono molto simili all’architettura moderna in termini di funzionalità necessarie. La forma dell’oggetto deve prima essere basata sullo scopo o sulla funzione previsti. In termini di siti Web, possiamo vederli come database di informazioni diffusi su Internet. L’utente visiterà un sito Web per ottenere dati specifici. È qui che interviene il contenuto per offrire quei dati. Quando il visitatore finisce su un sito e non trova i dati, li cercherà da qualche altra parte, senza nemmeno guardare il design. Allo stesso tempo, nel caso in cui il design renda davvero difficile individuare o digerire i dati, si verifica lo stesso risultato.
Gli utenti di Internet ora vogliono l’accesso alle informazioni e vogliono che questo accesso sia veloce. La funzione Form Over finisce per essere davvero importante nel web design. Non tener conto di questo principio significa che l’attenzione viene posta sull’aspetto piuttosto che sul contenuto offerto. Di conseguenza, i siti Web non saranno molto popolari. Il contenuto deve distinguersi in ogni momento.
Conclusioni
Alla radice, gli errori di web design più comuni sono legati al tentativo di inventare qualcosa di veramente bello e unico senza tener conto del motivo per cui i visitatori visitano effettivamente un sito. Per questo motivo, devi avere sempre la pazienza necessaria per combinare un ottimo design con una funzionalità completa.
Crea sempre siti web funzionali e continua ad apprendere nuove tecnologie con il passare del tempo. I migliori web designer del mondo continuano a imparare e restano sempre aggiornati su tutto ciò che si può e non si può fare. Vuoi creare il tuo web design, parlare con il cliente e poi assicurarti che i visitatori apprezzeranno ciò che viene offerto. Questo è molto più facile a dirsi che a farsi, ma col tempo tutto diventa molto più semplice.
Assicurati di dedicare sempre tutto il tempo necessario per creare qualcosa di veramente eccezionale. Un altro errore non menzionato nel web design è non concedersi il tempo necessario per creare effettivamente quel perfetto design del sito web. Ciò accade normalmente poiché i clienti hanno bisogno di lavoro da svolgere nel più breve periodo di tempo. Assicurati di avere sempre abbastanza tempo per creare quel web design stellare che sai di poter fare.