I dieci errori più comuni di un webdesigner
Questo articolo di Noupe ce li riassume, ed io prendo le singole intestazioni per commentarli a modo mio:
- Pagine piene e affollate.
Ricordate sempre che gli spazi “bianchi” non sono sempre sinonimo di vuoto, ed inserire troppe informazioni, soprattutto se formattate tutte in modo simile, rendono difficile trovare cosa si sta cercando e soprattutto la navigazione
Nuovi contenuti difficili da trovare.
Si commenta da sola, noi creiamo siti per mettere online delle informazioni, e se il sito è frequentemente aggiornato non possiamo non inserirli in homepage come primo richiamo- Links difficili da trovare.
Come ben sapete è anche buona regola di accessibilità: dimenticate i link super cool fatti in grassetto colorato e senza sottolineatura o ancora peggio che non differenziano assolutamente dal testo normale se non passandoci sopra. A che pro? Rendere sempre visibili i link tramite la classica sottolineatura, a meno che non si tratti di liste o menu che per loro natura sono normalmente dei link cliccabili. - Immagini dal formato errato.
Inutile dirvi che inserire una .bmp non sarà visibile, nè tantomeno una jpg salvata in formato cmyk che è per la stampa. Le png non sono supportate da Explorer6, ma un piccolo javascript di Unit, recentemente aggiornato, lo fixa in modo eccellente, io lo uso nel mio personale framework xhtml+css. - Lasciare il titolo di default della pagina, o peggio il classico “Documento senza titolo”. Da uccidersi!
Navigazione difficile da trovare.
Ok l’innovazione, ok la creatività, ma un menu dovrebbe assomigliare ad un menu
- Font dalla grandezza fissa.
Errore di accessibilità che non permette di ridimensionare il testo a chi ne ha la possibilità o la necessità. Usate sempre gli em o le misure in percentuale. - Una poco chiara mission del sito.
Appena si giunge sul sito bisogna capire di cosa si tratta: basta farlo testare ad un vostro amico che non l’abbia mai visto e chiedergli se capisce di che azienda/servizio si tratti
- Usare colori abbaglianti.
Penso ve l’abbiano insegnato da subito: sul monitor i colori sono più brillanti che sulla carta, pertanto non scegliete colori che abbagliano la retina o rendano difficile la lettura. Un buon contrasto è ammesso per rendere più leggibile i testi, ma non esagerate! - Sull’ultimo punto non sono molto d’accordo perchè non è un principio di webdesign ma di web marketing, e non coincide con quanto ho studiato finora


















Add to Google

16 Commenti
Per quanto riguarda il testo in dimensione fissa (pixel)… si tratta di un problema ormai relegato solo al vecchio macinino IE6 se non sbaglio… tutti i browser recenti hanno lo zoom o il ridimensionamento funzionante anche con i pixel (anche sul mobile).
Per questo ultimamente non mi sto più preoccupando troppo di usare i pixel per il testo… perchè a volte usare em o perecentuali diventa un po’ un incubo per via degli effetti a cascata… o mi sfugge qualcos’altro oltre a IE6?
Per me fai molto male ad usare i px per il testo, basta essere un pò + accorti nella progettazione e non avrai nessun effetto a cascata se non lo vuoi tu.
L’elenco mi pare abbastanza esaustivo, sul primo punto io farei + attenzione proprio su IWD, mi sembra che la home (e non solo) abbia questo problema, soprattutto la dx della home.
@manuxxon: poni una giusta questione, in ogni caso anche se fosse un problema SOLO di ie6 è meglio usare % e em. quando sarà scomparso dalla faccia della terra allora potremo tornare ai px.
@gase: lo so, immaginavo avreste obiettato
ma su IWD c’è veramente tanta carne al fuoco che non saprei dove metterla
i font in px sono una di quelle cose che per pigrizia non ho mai abbandonato…
)
ma il problema sul ridimensionamento riguarda solo IE6? (nel qual caso me ne sbatto
Il tempo di caricamento dell’home page è a mio avviso spesso sottovalutato. Oltre alle immagini fare attenzione alle animazioni e all’uso eccessivo di javascript.
uno dei miei errori che faccioooo spesso, penso, e’ mettere multipli H2 in una pagina. H1 e’ sempre solo 1, ma l’H2 lo uso spesso per il titolo di multipli paragrafi nella pagina.. mi sembra sprecato fare lo stesso style per h2,h3,h4 e poi utilizzarli per vedere la stessa cosa… faccio male?
@mirkojax:
prova a guardare la pagina senza grafica, se regge la gerarchia visiva dei titoli, se il sito non perde significato e tutto sembra organizzato bene, allora non c’è pericolo
@mirkojax@diecimarzo: esatto, è come dice diecimarzo: non devi guardare alla grafica che è data dai css, ma dalla struttura. se un h2 ha senso perchè è il titolo di un lavoro elencato, devi riproporlo anche negli altri, anche se sono nella stesssa pagina. il numero di fianco alla “h” spiega la gerarchia, non una numerazione crescente
E’ un comune errore pensare che il problema delle font in px riguardi solo IE6. Non è così, nemmeno IE7 è in grado di ridimensionare il testo in px. Hanno ovviato con una funzione di zoom, ma è appunto uno zoom, non un ridimensionamento.
ecco, attendevo qualche voce in materia, grazie Livio per il chiarimento…conclusione: tutti con % o em mi raccomando!!
io personalmente dimensiono il testo del body in percentuale e il testo dei vari box in em , la resa è simile in tutti i browser. Inoltre avete pensato alle varie risoluzioni dello schermo? E’ utile in tal senso dimensionare tutti gli elementi di una pagina in maniera da dare una buona accessibilità su tutte le piattaforme e a tutte le risoluzioni
@diecimarzo@lauryn
ahh ok! ora ho capito!
Molto interessante, se posso aggiungerei anche il problema dell’ottimizzazione per monitor 1024×768, purtroppo mi capita spesso di vedere siti molto belli dal lato della grafica, ma con la scrollbar orizzontale
Riguardo l’ultimo punto penso che il titolo sia sbagliato, nel senso che il concetto dell’usare i contrasti è giusto, ma i colori abbaglianti proprio no.
@manuxxon: se sei un amante del pixel e della dimensione fissa, ma vuoi sforzarti di fare tutto in em, ti consiglio un ottimo “trucco” (non è un cheat nè un hack!) ovvero impostare nell’elemento body, il font-size: 62.5%, questo in pratica permette di impostare 1em=10px.
Così quando vorrai utilizzare 12px, scriverai 1.2em, ecc…
Io ormai ci sono talmente abituata che a scrivere in px non ne sono più capace!
aggiungerei un errore…quello di lasciare la vecchia fotografia invece di sostituirla con quella comprata da istockphoto
http://www.italianwebdesign.it/wp-content/uploads/2009/07/ist2_42005-html-code-closeup-218×120.jpg
@giorgio: effettivamente è un grosso errore con cui concordo! Alla fine si perde di creatività propria e non è sempre detto che sia una cosa tua originale. Poi mi vien da chiedere per la visualizzazione. Qual’è ora lo standard? vedo 1024×768 come la risoluzione più piccola ora..e poi teniam da conto chi ha il widwscreen..