Se anche tu ti sei ritrovato a sviluppare templates di siti destinati ad un target piuttosto ampio o che comunque comprenda una larga fascia di utenti utilizzatori di Internet Explorer, sicuramente ti sarai imbattuto nei più comuni problemi di compatibilità uscendone magari con trick pazzeschi per riuscire a dare una parvenza di decenza al tutto. Premesso che è pressochè impossibile realizzare un layout visivamente identico su più comuni browser (Firefox, Chrome, Safari, Internet Explorer e Opera) e premesso che sia io sostenitore della teoria secondo cui finchè non si iniziano ad “ignorare” i browser obsoleti il trend stenterà a cambiare, cerchiamo di mettere a fuoco alcuni brevi punti da tenere a mente quando si lavora anche per Internet Explorer 6/7 in modo da risparmiare tempo e fatica prevenendo i problemi invece che curandoli. Sarebbe buona pratica iniziare lo sviluppo visualizzando il risultato direttamente su questi browser e poi ottimizzarne la resa visiva anche su browser più recenti, il tutto velocizza il lavoro ma non è indispensabile.
Di seguito, prendendo spunto da smashingmagazine.com, trovi una lista dei problemi più comuni che si incontrano in questo tipo di situazioni:
- IE6 impazzisce quando si inizia ad abusare della proprietà
float
. Paradossalmente i contenuti iniziano a sparire oppure i testi ad apparire duplicati - IE6 raddoppia il valore del margine su elementi con float dal lato stesso del float. Settare
display:inline
spesso risolve questo inconveniente - In IE6 e IE7, se un elemento non ha un contenitore può causare numerosi problemi quali il non apparire del background o il collasso errato dei margini.
- IE6 non supporta le proprietà min e max dei CSS come
min-height
omax-width
- IE6 non supporta il posizionamento fisso delle immagini di background
- IE6 e IE7 non supportano molti dei valori della proprietà
display
(es.inline-table
,table-cell
,table-row
, ecc.) - In IE6 non puoi utilizzare la pseudo-classe
:hover
ad eccezione delle ancore - Il supporto per i CSS3 di tutte le versioni di Internet Explorer, compresa la 8, è veramente ridotto
Per quanto riguarda i problemi legati al doppio margine o ad alcuni selettori vi consiglio di provare la fantastica libreria ie7.js con la quale è possibile espandere notevolmente le scarse possibilità di questi due browser obsoleti!
Questi sono solo alcuni dei numerosi problemi che incontrerete, condividerli penso sia il primo passo per evitare di commetterli e sperare che presto anche nel bel Paese l’utenza media di IE6 cali rapidamente è ciò che di altro ci resta da fare 🙂