In maniera superficiale si può affermare che per creare un sito web è sufficiente avere un'editor Html WYSIWYG e cercare sul mercato un server dove poterlo pubblicare.Effettivamente le cose non stanno proprio in questo modo, perchè nella progettazione e nella realizzazione di un sito web bisogna prendere decisioni con cognizione di causa, e questo è possibile soltanto conoscendo i concetti fondamentali del web design. Le 3 variabili di un progetto Web: La risoluzione dello schermo: Indipendentemente della cura che si pone nella progettazione, a causa delle varie risoluzioni disponibili non si può mai sapere il modo in cui gli utenti visualizzeranno le pagine. La gamma di risoluzioni visualizzabili dipende dalla caratteristiche del monitor e della scheda video installata nel computer.Le tre risoluzioni più utilizzate sono: 640x480, 800x600 e 1024x768 pixel. La risoluzione di 640x480 pixel è tipicamente usata da chi possiede monitor da 14 pollici, mentre chi ha un monitor da 15 pollici potrebbe utilizzare la risoluzione di 800x600 pixel.Considerando che oggi i prezzi dei monitor sono notevolmente scesi rispetto ad alcuni anni fa, si può affermare che la maggior parte degli utenti avranno almeno un monitor da 15 pollici se non addirittura un monitor da 17 pollici.Aldilà di queste considerazioni, la risoluzione dello schermo scelta dagli utenti è un fattore su cui il progettista web non ha alcun controllo. Bisogna allora decidere di realizzare il sito in modo da gestire più risoluzioni.Realizziamo una pagina web per 800x600 pixel e visualizziamola ad una risoluzione di 640x480 pixel. Saremo costretti a eseguire continui scorrimenti a destra e sinistra per leggere il testo.La presenza della barra di scorrimento orizzontale, al contrario della barra di scorrimento verticale, è considerata negativa e scomoda da molti utenti.Alcuni progettisti sostengono che si dovrebbero sviluppare le pagine basandosi sul minimo comune denominatore che attualmente è rappresentato dalla risoluzione di 640x480 pixel ed, in effetti, molti importanti siti seguono questa impostazione. Si capisce però che utilizzando questa risoluzione per progettare le pagine web, si ha a disposizione meno spazio per gestire i contenuti di una pagina.È anche possibile progettare una pagina web che si adatti alle varie risoluzioni dello schermo.Adottare questa tecnica è un'ottima soluzione ma è sicuramente più impegnativo che sviluppare un layout dalle dimensioni "fisse".Si può anche pensare di realizzare diverse versioni delle vostre pagine per ogni risoluzione e fare scegliere all'utente quale versione utilizzare, ma si tratta di una tecnica troppo laboriosa e poco usata. La velocità di connessione: La velocità di connessione è una variabile che influenza notevolmente la progettazione delle pagine web. La maggior parte degli utenti non sopporta che il caricamento di una pagina richieda più di 20-25 secondi e quindi se la vostra pagina viene caricata lentamente il visitatore potrebbe andarsene prima ancora di iniziare a visualizzare i contenuti del sito. È necessario quindi eseguire il collaudo del sito a varie velocitàdi connessione per verificare che i tempi di caricamento delle pagine non superino i 20-25 secondi evitando di perdere potenziali visitatori.Come velocità di connessione base, per effettuare il collaudo delle vostre pagine, si può considerare 28.8 Kbps, tipica degli utenti che utilizzano vecchi modem. Per poter effettuare un giusto collaudo delle nostre pagine dobbiamo sapere in che modo le pagine vengono inviate all'utente.Quando si digita l'indirizzo web nel proprio browser, questo si connette al server web appropriato e richiede il file specificato. Il server, allora, fornisce il file in modo che il browser possa prelevarlo. La prima volta che si visita un sito, sarà necessario caricare sia il file Html che ogni immagine cui fa riferimento il codice Html.Se successivamente si ritorna a visitare lo stesso sito, il browser preleva e analizza il file Html. Poi il browser controlla se le immagini specificate nel file Html sono già memorizzate nell'area cache del nostro computer.La cache è un'area di memorizzazione temporanea delle pagine web e delle immagini, ed il browser tenta sempre di caricare le immagini dall'area cache piuttosto che ricaricarle dal web.Questa breve spiegazione ci fa capire che dobbiamo stare attenti quando collaudiamo il nostro sito alle diverse velocità di connessione, poiché dobbiamo immaginare di essere un utente che visita il sito la prima volta. Proprio questo è il momento in cui l'utente sperimenta i tempi di prelevamento più lunghi.Allora per effettuare un collaudo che ci dia realmente il tempo di caricamento è necessario svuotare ogni volta l'area cache del proprio browser. La velocità di visualizzazione delle pagine è maggiormente influenzata dal numero e dalle dimensioni delle immagini contenute nelle pagine web.Bisogna quindi non complicare troppo il progetto delle pagine riducendo il numero immagini. Considerando come connessione base 28.8 Kbps, nessuna immagine del sito web dovrebbe superare i 10-15 KB.In fase di progetto, teniamo anche conto della funzionalità cache del browser, riutilizzando le immagini e la grafica quanto più possibile all'interno del sito.Questo ci permetterà di avere oltre ad un aspetto uniforme delle pagine, anche un caricamento più rapido delle pagine. Infatti una volta che un'immagine è stata prelevata, questa permane nell'area cache per il numero di giorni specificato nelle apposite impostazioni del browser.La maggior parte degli utenti non cambia queste impostazioni ed è quindi probabile che le immagini rimarranno nel disco fisso dell'utente per qualche tempo. Ogni volta che l'utente torna a visitare il nostro sito, verrà utilizzata la copia locale delle immagini, evitando di prelevare nuovamente le immagini dal server web. Browser: Il browser è definito come un’applicazione client che utilizza il protocollo http per inoltrare le richieste dell’utente ad un web server.Esempi: Internet Explorer, Netscape Navigator e Opera.Ogni browser contiene un programma chiamato parser, che interpreta i tag contenuti in un file Html e visualizza i risultati sulla finestra del browser.Purtroppo la logica di interpretazione dei tag Html varia da browser a browser e questo ha come conseguenza interpretazioni differenti e talvolta in conflitto fra loro per il modo in cui deve essere visualizzato il file Html.A questo punto, viene da chiedersi per quale motivo si deve rendere il proprio lavoro compatibile con più browser. Il motivo è molto semplice, infatti, per un autore web l'obiettivo principale dovrebbe essere la realizzazione di pagine accessibili dal maggior numero possibile di utenti.Un modo efficace per creare pagine visibili correttamente dai diversi browser consiste nell'usare l'approccio a "minimo comune denominatore". Questo approccio offre un'ampia accettabilità da parte dei browser in quanto l'autore web sceglie di utilizzare la penultima release di Html. Ad esempio quando furono introdotti i browser che supportavano Html 4.0, molti continuarono a lavorare in Html 3.2, confidando sul fatto che il codice sarebbe stato visualizzato in modo più uniforme in quanto tutti i tipi di browser l'avrebbero riconosciuto.L'approccio a minimo comune denominatore è il metodo di programmazione più sicuro ed è ampiamente utilizzato nei siti interessati alla massima diffusione possibile delle informazioni.Un altro modo per aggirare il problema è quello di includere nelle pagine del proprio sito web un avviso del tipo: "Questo sito è ottimizzato per Internet Explorer 5.0". Ciò significa utilizzare alcune estensioni specifiche di un browser ed essere consapevoli che il proprio sito non viene visualizzato correttamente da altri browser e non voler risolvere il problema. Adottare questo tipo di tecnica è sicuramente un metodo molto rapido di progettare pagine web ma potrebbe avere come conseguenza l'allontanamento di un significativo numero di lettori che se ne andranno immediatamente solo perché ritengono di non avere un browser adatto. L'uso di questa tecnica è indicato nel caso in cui si deve progettare un sito per un'intranet aziendale e quindi si conosce quale browser verrà utilizzato.Rendere le pagine accessibili al maggior numero possibile di utenti è abbastanza difficile; allora è compito del progettista web fare le giuste scelte per garantire una buona visibilità a tutti. TIPI DI BROWSER Internet Explorer con le sue caratteristiche è un browser tradizionale.In esso troviamo la barra del titolo, dei menù ed i vari pulsanti che ne consentono la gestione come: il pulsante indietro, avanti, preferiti.....ETC. Ci sono anche altri tipi di browser come per esempio gli screen-reader utilizzati dagli utenti non vedenti. Essi vengono chiamati anche lettori di schermo. Questi programmi lavorano in background ( residente in memoria) che veglia sul sistema operativo attendendo la pressione dei tasti, la focalizzazione di un oggetto, l’attivazione di eventi. Ogni volta che accade una di queste cose, si attiva, prende visione di ciò che è accaduto, memorizza i dati che sono stati modificati, li trasferisce al sintetizzatore, software o hardware, il quale li riproduce vocalmente.Insieme alla funzione di sintesi vocale, presente in tutti gli screen-readers moderni, esiste anche un altro dispositivo hardware che può essere collegato al pc: display braille che riproduce in alfabeto braille ciò che appare sullo schermo.La tecnologia, comunque, si deve adeguare alle nuove regole di usabilità ed accessibilità anche per i nuovi browser creati sia per i cellulari sia per i palmari. USABILITA’ E I FOGLI DI STILE: I Fogli di stile (CSS, cascading style sheet) sono una tecnologia che si sta lentamente imponendo all'attenzione di coloro che realizzano siti. Si tratta di un linguaggio per il visual design, ovvero per controllare l'aspetto visivo degli elementi che costituiscono la vostra pagina HTML. I CSS sono una specifica diversa da HTML. HTML può contenere al suo interno delle istruzioni CSS associate ai tag HTML, oppure può fare riferimento, con un'apposita dichiarazione, ad un foglio di stile separato.L'uso dei CSS può contribuire a rendere l'interazione più ricca e il sito più usabile. Ciò è possibile in diversi modi:Innanzitutto, rendendo l'HTML più leggero, e dunque facendolo caricare più velocemente. In questo sito, ogni pagina ridisegnata con i CSS ha 3-4 Kbyte in meno della versione precedente. Una media del 15-20% in meno per ogni documento! Questi Kilobyte sono a carico dei CSS, che vanno caricati assieme all'HTML, ma è bene notare che vengono caricati una volta sola: tutte le pagine sono infatti controllate dagli stessi CSS. Le pagine successive alla prima rimangono più leggere. Migliorando l'interazione attraverso l'ampliamento della zona sensibile dei link. Un esempio sono i menu a destra in questo sito. In questa pagina (in alto) potete provare a ingrandire il testo con le tre opzioni offerte. Un tempo, la zona sensibile (quella in cui si attiva la "manina") sarebbe stata solo quella del testo. Con i CSS è possibile ampliarla a tutta la larghezza della colonna, rendendo più comodo il click (ai test di usabilità è frequente incontrare utenti che SBAGLIANO a cliccare perché mancano il link senza accorgersene, a causa dello scarso controllo che hanno sul mouse e dell'area insufficiente del link). Sfruttando al meglio effetti di rollover senza l'uso di javascript. Dando la possibilità di ingrandire il testo e di modificare le impostazioni anche del design senza ricorrere a Javascript e ad applicazioni server-side. Eliminando la necessità di una versione stampabile separata. L'utente può stampare direttamente dal browser. Arricchendo l'interazione con la creazione di menu contestuali a scomparsa attivabili solo con i CSS, con un uso minimo di eventi javascript. In alcuni siti, infatti, avere molte voci di menu può comportare un elevato aumento della complessità della pagina. Questi menu possono essere organizzati in gruppi e resi disponibili alla pressione di un link utilizzando la proprietà display dei CSS. (Attenzione: questi espedienti non sono usabili in sè, ma vanno valutati caso per caso. Contribuiscono comunque a rendere più divertente la navigazione, anche se a volte questo può andare a scapito dell'efficacia). Migliorando la coerenza visiva delle pagine. Basandosi su regole che valgono per l'intero sito, i CSS aiutano a dare coerenza visiva alle diverse pagine, e un senso di ordine che contribuisce a rendere la visita più piacevole. Inoltre i CSS consentono di modificare in meglio il design con prove successive in maniera economica, anche mentre il sito è online, accorciando di fatto i tempi e i costi del processo di miglioramento e modifica. Poiché la modifica di un sito per sopperire a problemi di usabilità riscontrati dagli utenti o nei test è il processo fondamentale in un design centrato sull'utente, i CSS, consentendo di svolgere questo processo senza toccare l'html, si dimostrano una tecnologia particolarmente utile e orientata all'usabilità.Naturalmente, non basta usare i CSS per dire di aver fatto un sito usabile. Un buon uso dei colori, dei posizionamenti, degli spazi bianchi dipende dalla capacità del designer. Una navigazione coerente e un labeling system adeguato all'utenza, delle procedure che supportino il compito che l'utente vuole svolgere, sono tutti aspetti cruciali, che i CSS possono contribuire a rendere al meglio, ma che non possono certo prescindere dalle capacità del progettista e dai risultati dei test di usabilità. Ci sono molti siti brutti o mediocri realizzati con i CSS, così come con le tabelle. Ma questo dipende dall'uomo, come sempre, e non dalla tecnologia.
Post N° 6
In maniera superficiale si può affermare che per creare un sito web è sufficiente avere un'editor Html WYSIWYG e cercare sul mercato un server dove poterlo pubblicare.Effettivamente le cose non stanno proprio in questo modo, perchè nella progettazione e nella realizzazione di un sito web bisogna prendere decisioni con cognizione di causa, e questo è possibile soltanto conoscendo i concetti fondamentali del web design. Le 3 variabili di un progetto Web: La risoluzione dello schermo: Indipendentemente della cura che si pone nella progettazione, a causa delle varie risoluzioni disponibili non si può mai sapere il modo in cui gli utenti visualizzeranno le pagine. La gamma di risoluzioni visualizzabili dipende dalla caratteristiche del monitor e della scheda video installata nel computer.Le tre risoluzioni più utilizzate sono: 640x480, 800x600 e 1024x768 pixel. La risoluzione di 640x480 pixel è tipicamente usata da chi possiede monitor da 14 pollici, mentre chi ha un monitor da 15 pollici potrebbe utilizzare la risoluzione di 800x600 pixel.Considerando che oggi i prezzi dei monitor sono notevolmente scesi rispetto ad alcuni anni fa, si può affermare che la maggior parte degli utenti avranno almeno un monitor da 15 pollici se non addirittura un monitor da 17 pollici.Aldilà di queste considerazioni, la risoluzione dello schermo scelta dagli utenti è un fattore su cui il progettista web non ha alcun controllo. Bisogna allora decidere di realizzare il sito in modo da gestire più risoluzioni.Realizziamo una pagina web per 800x600 pixel e visualizziamola ad una risoluzione di 640x480 pixel. Saremo costretti a eseguire continui scorrimenti a destra e sinistra per leggere il testo.La presenza della barra di scorrimento orizzontale, al contrario della barra di scorrimento verticale, è considerata negativa e scomoda da molti utenti.Alcuni progettisti sostengono che si dovrebbero sviluppare le pagine basandosi sul minimo comune denominatore che attualmente è rappresentato dalla risoluzione di 640x480 pixel ed, in effetti, molti importanti siti seguono questa impostazione. Si capisce però che utilizzando questa risoluzione per progettare le pagine web, si ha a disposizione meno spazio per gestire i contenuti di una pagina.È anche possibile progettare una pagina web che si adatti alle varie risoluzioni dello schermo.Adottare questa tecnica è un'ottima soluzione ma è sicuramente più impegnativo che sviluppare un layout dalle dimensioni "fisse".Si può anche pensare di realizzare diverse versioni delle vostre pagine per ogni risoluzione e fare scegliere all'utente quale versione utilizzare, ma si tratta di una tecnica troppo laboriosa e poco usata. La velocità di connessione: La velocità di connessione è una variabile che influenza notevolmente la progettazione delle pagine web. La maggior parte degli utenti non sopporta che il caricamento di una pagina richieda più di 20-25 secondi e quindi se la vostra pagina viene caricata lentamente il visitatore potrebbe andarsene prima ancora di iniziare a visualizzare i contenuti del sito. È necessario quindi eseguire il collaudo del sito a varie velocitàdi connessione per verificare che i tempi di caricamento delle pagine non superino i 20-25 secondi evitando di perdere potenziali visitatori.Come velocità di connessione base, per effettuare il collaudo delle vostre pagine, si può considerare 28.8 Kbps, tipica degli utenti che utilizzano vecchi modem. Per poter effettuare un giusto collaudo delle nostre pagine dobbiamo sapere in che modo le pagine vengono inviate all'utente.Quando si digita l'indirizzo web nel proprio browser, questo si connette al server web appropriato e richiede il file specificato. Il server, allora, fornisce il file in modo che il browser possa prelevarlo. La prima volta che si visita un sito, sarà necessario caricare sia il file Html che ogni immagine cui fa riferimento il codice Html.Se successivamente si ritorna a visitare lo stesso sito, il browser preleva e analizza il file Html. Poi il browser controlla se le immagini specificate nel file Html sono già memorizzate nell'area cache del nostro computer.La cache è un'area di memorizzazione temporanea delle pagine web e delle immagini, ed il browser tenta sempre di caricare le immagini dall'area cache piuttosto che ricaricarle dal web.Questa breve spiegazione ci fa capire che dobbiamo stare attenti quando collaudiamo il nostro sito alle diverse velocità di connessione, poiché dobbiamo immaginare di essere un utente che visita il sito la prima volta. Proprio questo è il momento in cui l'utente sperimenta i tempi di prelevamento più lunghi.Allora per effettuare un collaudo che ci dia realmente il tempo di caricamento è necessario svuotare ogni volta l'area cache del proprio browser. La velocità di visualizzazione delle pagine è maggiormente influenzata dal numero e dalle dimensioni delle immagini contenute nelle pagine web.Bisogna quindi non complicare troppo il progetto delle pagine riducendo il numero immagini. Considerando come connessione base 28.8 Kbps, nessuna immagine del sito web dovrebbe superare i 10-15 KB.In fase di progetto, teniamo anche conto della funzionalità cache del browser, riutilizzando le immagini e la grafica quanto più possibile all'interno del sito.Questo ci permetterà di avere oltre ad un aspetto uniforme delle pagine, anche un caricamento più rapido delle pagine. Infatti una volta che un'immagine è stata prelevata, questa permane nell'area cache per il numero di giorni specificato nelle apposite impostazioni del browser.La maggior parte degli utenti non cambia queste impostazioni ed è quindi probabile che le immagini rimarranno nel disco fisso dell'utente per qualche tempo. Ogni volta che l'utente torna a visitare il nostro sito, verrà utilizzata la copia locale delle immagini, evitando di prelevare nuovamente le immagini dal server web. Browser: Il browser è definito come un’applicazione client che utilizza il protocollo http per inoltrare le richieste dell’utente ad un web server.Esempi: Internet Explorer, Netscape Navigator e Opera.Ogni browser contiene un programma chiamato parser, che interpreta i tag contenuti in un file Html e visualizza i risultati sulla finestra del browser.Purtroppo la logica di interpretazione dei tag Html varia da browser a browser e questo ha come conseguenza interpretazioni differenti e talvolta in conflitto fra loro per il modo in cui deve essere visualizzato il file Html.A questo punto, viene da chiedersi per quale motivo si deve rendere il proprio lavoro compatibile con più browser. Il motivo è molto semplice, infatti, per un autore web l'obiettivo principale dovrebbe essere la realizzazione di pagine accessibili dal maggior numero possibile di utenti.Un modo efficace per creare pagine visibili correttamente dai diversi browser consiste nell'usare l'approccio a "minimo comune denominatore". Questo approccio offre un'ampia accettabilità da parte dei browser in quanto l'autore web sceglie di utilizzare la penultima release di Html. Ad esempio quando furono introdotti i browser che supportavano Html 4.0, molti continuarono a lavorare in Html 3.2, confidando sul fatto che il codice sarebbe stato visualizzato in modo più uniforme in quanto tutti i tipi di browser l'avrebbero riconosciuto.L'approccio a minimo comune denominatore è il metodo di programmazione più sicuro ed è ampiamente utilizzato nei siti interessati alla massima diffusione possibile delle informazioni.Un altro modo per aggirare il problema è quello di includere nelle pagine del proprio sito web un avviso del tipo: "Questo sito è ottimizzato per Internet Explorer 5.0". Ciò significa utilizzare alcune estensioni specifiche di un browser ed essere consapevoli che il proprio sito non viene visualizzato correttamente da altri browser e non voler risolvere il problema. Adottare questo tipo di tecnica è sicuramente un metodo molto rapido di progettare pagine web ma potrebbe avere come conseguenza l'allontanamento di un significativo numero di lettori che se ne andranno immediatamente solo perché ritengono di non avere un browser adatto. L'uso di questa tecnica è indicato nel caso in cui si deve progettare un sito per un'intranet aziendale e quindi si conosce quale browser verrà utilizzato.Rendere le pagine accessibili al maggior numero possibile di utenti è abbastanza difficile; allora è compito del progettista web fare le giuste scelte per garantire una buona visibilità a tutti. TIPI DI BROWSER Internet Explorer con le sue caratteristiche è un browser tradizionale.In esso troviamo la barra del titolo, dei menù ed i vari pulsanti che ne consentono la gestione come: il pulsante indietro, avanti, preferiti.....ETC. Ci sono anche altri tipi di browser come per esempio gli screen-reader utilizzati dagli utenti non vedenti. Essi vengono chiamati anche lettori di schermo. Questi programmi lavorano in background ( residente in memoria) che veglia sul sistema operativo attendendo la pressione dei tasti, la focalizzazione di un oggetto, l’attivazione di eventi. Ogni volta che accade una di queste cose, si attiva, prende visione di ciò che è accaduto, memorizza i dati che sono stati modificati, li trasferisce al sintetizzatore, software o hardware, il quale li riproduce vocalmente.Insieme alla funzione di sintesi vocale, presente in tutti gli screen-readers moderni, esiste anche un altro dispositivo hardware che può essere collegato al pc: display braille che riproduce in alfabeto braille ciò che appare sullo schermo.La tecnologia, comunque, si deve adeguare alle nuove regole di usabilità ed accessibilità anche per i nuovi browser creati sia per i cellulari sia per i palmari. USABILITA’ E I FOGLI DI STILE: I Fogli di stile (CSS, cascading style sheet) sono una tecnologia che si sta lentamente imponendo all'attenzione di coloro che realizzano siti. Si tratta di un linguaggio per il visual design, ovvero per controllare l'aspetto visivo degli elementi che costituiscono la vostra pagina HTML. I CSS sono una specifica diversa da HTML. HTML può contenere al suo interno delle istruzioni CSS associate ai tag HTML, oppure può fare riferimento, con un'apposita dichiarazione, ad un foglio di stile separato.L'uso dei CSS può contribuire a rendere l'interazione più ricca e il sito più usabile. Ciò è possibile in diversi modi:Innanzitutto, rendendo l'HTML più leggero, e dunque facendolo caricare più velocemente. In questo sito, ogni pagina ridisegnata con i CSS ha 3-4 Kbyte in meno della versione precedente. Una media del 15-20% in meno per ogni documento! Questi Kilobyte sono a carico dei CSS, che vanno caricati assieme all'HTML, ma è bene notare che vengono caricati una volta sola: tutte le pagine sono infatti controllate dagli stessi CSS. Le pagine successive alla prima rimangono più leggere. Migliorando l'interazione attraverso l'ampliamento della zona sensibile dei link. Un esempio sono i menu a destra in questo sito. In questa pagina (in alto) potete provare a ingrandire il testo con le tre opzioni offerte. Un tempo, la zona sensibile (quella in cui si attiva la "manina") sarebbe stata solo quella del testo. Con i CSS è possibile ampliarla a tutta la larghezza della colonna, rendendo più comodo il click (ai test di usabilità è frequente incontrare utenti che SBAGLIANO a cliccare perché mancano il link senza accorgersene, a causa dello scarso controllo che hanno sul mouse e dell'area insufficiente del link). Sfruttando al meglio effetti di rollover senza l'uso di javascript. Dando la possibilità di ingrandire il testo e di modificare le impostazioni anche del design senza ricorrere a Javascript e ad applicazioni server-side. Eliminando la necessità di una versione stampabile separata. L'utente può stampare direttamente dal browser. Arricchendo l'interazione con la creazione di menu contestuali a scomparsa attivabili solo con i CSS, con un uso minimo di eventi javascript. In alcuni siti, infatti, avere molte voci di menu può comportare un elevato aumento della complessità della pagina. Questi menu possono essere organizzati in gruppi e resi disponibili alla pressione di un link utilizzando la proprietà display dei CSS. (Attenzione: questi espedienti non sono usabili in sè, ma vanno valutati caso per caso. Contribuiscono comunque a rendere più divertente la navigazione, anche se a volte questo può andare a scapito dell'efficacia). Migliorando la coerenza visiva delle pagine. Basandosi su regole che valgono per l'intero sito, i CSS aiutano a dare coerenza visiva alle diverse pagine, e un senso di ordine che contribuisce a rendere la visita più piacevole. Inoltre i CSS consentono di modificare in meglio il design con prove successive in maniera economica, anche mentre il sito è online, accorciando di fatto i tempi e i costi del processo di miglioramento e modifica. Poiché la modifica di un sito per sopperire a problemi di usabilità riscontrati dagli utenti o nei test è il processo fondamentale in un design centrato sull'utente, i CSS, consentendo di svolgere questo processo senza toccare l'html, si dimostrano una tecnologia particolarmente utile e orientata all'usabilità.Naturalmente, non basta usare i CSS per dire di aver fatto un sito usabile. Un buon uso dei colori, dei posizionamenti, degli spazi bianchi dipende dalla capacità del designer. Una navigazione coerente e un labeling system adeguato all'utenza, delle procedure che supportino il compito che l'utente vuole svolgere, sono tutti aspetti cruciali, che i CSS possono contribuire a rendere al meglio, ma che non possono certo prescindere dalle capacità del progettista e dai risultati dei test di usabilità. Ci sono molti siti brutti o mediocri realizzati con i CSS, così come con le tabelle. Ma questo dipende dall'uomo, come sempre, e non dalla tecnologia.