[Accessibilita'] Layout liquido

[Immaginando]

Ciao a tutti!
mi piacerebbe avere la vostra opinione...
secondo il requisito 12 x l'applicazione della legge stanca i siti dovrebbero essere sviluppati in modo tale da potersi adattare alle dimensioni della finestra del browser, ma soprattutto non ci devono essere sovrapposizioni degli oggetti con conseguente perdita di info.
Questa e' quanto enunciato, in realta' pero' in rete ci sono tantissimi siti (parlo soprattutto di siti x la PA) che garantiscono la non sovrapposizione dei vari oggetti presenti, grazie ad un layout fisso.

Quindi mi chiedo e vi chiedo, visto che in giro c'è molta confusione al riguardo: e' consentito un layout fisso con la garanzia di non stravolgerlo in caso di ridimensionamento della finestra del browser, ma la necessita' di scorrere con le barre x visualizzarlo oppure e'
meglio un layout liquido con certezza (causa immagini o parti con
misure fisse) di vederselo stravolgere in casi di ridimensionamento?!



ah un'ultima cosa:
con FF quando si ridimensiona la finestra del browser si
sovrapposiziona un po' tutto! Come fare x evitarlo?!

[bernabaus]

In effetti me lo chiedevo pure io... Sto facendo un sito con due colonne fisse e una liquida ma se rimpicciolisco la finestra sotto il 1024 i contenuti al centro tendono a sovrapporsi alla colonna fissa di sinistra...

Allora a sto punto era meglio se usavo tutte le 3 colonne fisse...

Oppure c'è un mezzo per impostare che la colonna centrale non vada mai sotto un certo numero di pixel?

min-width:500px;

questa istruzione non funge...

[atigra]

L'istruzione min-width: 500px; è standard W3C e quindi funziona, ma non sulle versioni di IE (nella versione 7 non lo so... nelle precedenti sono certo che non viene interpretata).

[Paola_pg]

Un ottimo metodo per evitare la sovrapposizione degli elementi anche a minori risoluzioni è quello di inserire tutte le misure usando la percentuale.
In questo modo si otterrà un layout fluido che si ridimensionerà a seconda della finestra.

[Immaginando]

Originariamente inviato da Paola_pg
Un ottimo metodo per evitare la sovrapposizione degli elementi anche a minori risoluzioni è quello di inserire tutte le misure usando la percentuale.
In questo modo si otterrà un layout fluido che si ridimensionerà a seconda della finestra.

Si ciao,
pero' a volte ci sono dei box che contengono delle immagini con misure fisse e quindi anche se al box metto una misura in percentuale, avro' cmq una sovrapposizione...

[Paola_pg]

Non è vero

Puoi fare così: imposti nel css un div e metti come sfondo l'immagine. In questo modo non imposti misure fisse e, al caso, non si sovrapporrà

[Immaginando]

Originariamente inviato da Paola_pg
Non è vero

Puoi fare così: imposti nel css un div e metti come sfondo l'immagine. In questo modo non imposti misure fisse e, al caso, non si sovrapporrà

si a questo avevo pensato... ma ho molte pagine con immagini diverse e dovrei fare una classe diversa x tutte le pagine!
A meno che ci sia un altro metodo...

[Paola_pg]

Beh... si si tratta di fare una classe per ogni pagina non mi sembra un gran lavoro
Magari impostarle ti risulta una pizza, ma poi non avresti problemi...

[Mich_]

Prima di pensare al CSS, occorre pensare a creare un (X)HTML corretto anche semanticamente.
Se l'immagine fa parte del contenuto va inserita in un tag <img>; se invece e` abbellimento va inserita come sfondo.

Poi ci sono vari modi di gestire gli spazi.
Nei vari blocchi puoi definire anche un min-width (*): in tal caso gli oggetti float quando non ci stanno vanno a capo.
A quel punto e` importante inserire gli oggetti nell'ordine logico, in modo che vengano visualizzati in un ordine che abbia senso.
Riassumento: se la finestra e` sufficientemente larga, i blocchi vengono affiancati; quando diventa troppo stretta (eventualmente anche in funzione del carattere usato) i blocchi vengono messi uno sotto l'altro. E` un comportamento ragionevole, ed in molti casi atteso dai navigatori, per cui non comporta perdita di accessibilita`: i contenuti devono essere sempre visibili e accessibili, il layout puo` subire modifiche (l'estetica deve cedere il passo alla fruibilita`).


(*) se usi min-width, devi tener conto che in IE6 non viene riconosciuto; quindi devi usare l'hack opportuno: e` un hack che non pregiudica la visualizzazione in altri browser, compreso IE7, per cui puo` essere usato tranquillamente.

[Immaginando]

Ciao!
allora, le img che ho usato sono inerenti alle pagine in cui sono inserite anche se non sono indispensabili per la loro comprensione... ma non le definirei di abbellimento.

Grazie x avermi ricordato dei min-width!
ne ho usato qualcuno insieme alla proprieta' clear e qualcosina e' migliorato.

l'hack di cui parli e' quello presente nei link css di qs forum?!
ancora non l'ho sperimentato su IE xche' nn lo conoscevo, ma me lo studiero' e provero' ad applicarlo!
Grazie.


@Paola_pg: purtroppo le pagine sono + di 100 e quindi dovrei fare 100 classi...
almeno che trovo un altro stratagemma!