Newsgroup: it.lavoro.professioni.webmaster
Titolo: Interfaccia accessibile, DIV, Table, e quant'altro...

Salve a tutti...
Sebbene con Google si trovi un'infinità di materiale mi piacerebbe avere
qualche vostro suggerimento.
Per anni ho progettato l'interfaccia dei fornt end che sviluppo, o semplici
siti web imprigionando il layout in rigide tabelle. Credo sia giunto il
momeno (sono in ritardo...lo so) di abbandonare questo approccio a favore di
una metodologia più accessibile.
Concettualmente, come si progetta un layout tramite i DIV? Ad esempio, se vi
va, aiutatemi con questo caso pratico.
Struttura standard di un portale old-style:
 HEADER, COLONNA1,COLONNA2,COLONNA3,FOOTER
Creo essenzialmente 4 DIV, uno per ognuna di queste sezioni... poi come vado
a posizionarli? Con i CSS, lo so, ma vorrei sapere il posizionamento con i
CSS è solo assoluto o può essere anche relativo? Con le tabelle l'uso di
Width ed Heigth in percentuale mi dave una certa garanzia di "uniformità"
dell'interfaccia alle varie risoluzioni, esiste un qualcosa di analogo?
Grazie a chi vorrà perdere un po' del suo tempo!

 dell'interfaccia alle varie risoluzioni, esiste un qualcosa di analogo?
Detto semplicemente:
Fai un div principale
Dentro ci metti header
Poi un altro div contenitore che conterrà le 3 colonne
Poi div Colonna 1 con float:left; impostato
Poi div Colonna 2 con float:left; impostato
Poi div Colonna 3 con float:left; impostato
Poi un div con clear:left; impostato per ripristinare da proprietà float
Chiudi il secondo div contenitore
Ci metti Footer
Chiudi Div principale
Questo è un tipo di posizionamento, quello che ho trovato migliore per le
mie esigenze.
Trovi maggiori informazioni su 
www.constile.org
.
Giansimon Diblas
http://www.webimmagine.com

 Poi un div con clear:left; impostato per ripristinare da proprietà float
Ciao, grazie per l'aiuto. Non ho capito esattamente a cosa serve
quest'ultimo DIV

 quest'ultimo DIV
Quando imposti float:left il div successivo viene allineato alla sinistra di
quest'ultimo. Se non ripristini la condizione iniziale con clear:left hai un
effetto indesiderato che puoi vedere con mozilla. Explorer invece lo
gestisce "correttamente" anche se, in realtā per lo standard, la gestione
esatta č quella di mozilla. Se tu usassi float:right dovresti fare un
clear:right. Esiste un articolo dedicato a questo argomento nel sito che ti
ho segnalato.
Giansimon Diblas
http://www.webimmagine.com

 quest'ultimo DIV
Per il footer, credo
Ma ci sono altri metodi per far quello che ti serve. Ad esempio 
impostare le larghezze in modo assoluto o relativo.
<div style="position:absolute">
<div style="position:relative;width:570px; background:#f00;">header</div>
<div style="position:absolute; width:100px; background:#0f0;">left</div>
<div style="position:absolute; width:370px; left:100px; 
background:#00f;">middle</div>
<div style="position:relative; width:100px; left:470px; 
background:#0ff;">right</div>
<div style="width:570px; background:#f0f;">footer</div>
</div>
Puoi inotre usare le percentuali...
<div style="position:absolute">
<div style="position:relative; width:100%; background:#f00;">header</div>
<div style="position:absolute; width:20%; background:#0f0;">left</div>
<div style="position:absolute; width:60%; left:20%; 
background:#00f;">middle</div>
<div style="position:relative; width:20%; left:80%; 
background:#0ff;">right</div>
<div style="width:100%; background:#f0f;">footer</div>
</div> o fare quello che ti pare.
E' più semplice a fare che a spiegare, imho.
-- 
Massy