Ie6 no grazie!

E’ da molto tempo che molti web designer fanno lotta per boicottare l’obsoleto IE6. Ho pensato di dare una mano anche io a questa causa scrivendo questa mia, personale, visione d’insieme.

Un sito molto interessante per questa “lotta” che vi invito a visitare è Ie6 no more. Il sito inizia, giustamente con  lo slogan: Quando è troppo è troppo. E ha ragione.

La “feccia” dei browser: IE6

Fin dalla sua nascita nel lontano 2001 IE6 non si presentava molto bene: Bug, rallentamenti improvvisi, crash, layout letteralmente messi sotto sopra nonostante rispettassero rigorosi standard…insomma un flop.

Tuttavia ancora molta gente (soprattutto neofiti o persone “anziane”) purtroppo non aggiorna il proprio browser rimanendo ancorato a questo pericoloso browser web.

Cosa devo fare  per debellare questa “malattia”?

La risposta che ti (e devi) porre è la seguente: Devo far pagare il sito due volte al mio cliente? Ebbene sì perchè progettare per Ie6 richiede tutta una serie infinita di accorgimenti, trucchi e tricks (talvolta molto duri da imparare) per far visualizzare bene il vostro sito. Insomma uno sforzo doppio che dovete valutare nel preventivo. Tuttavia sappiate che il 99.9% dei clienti non sarà molto contento di vedere alla voce Totale una somma troppo alta dovuta al doppio rifacimento.

Come aggirare il problema?

Come sempre la soluzione esiste, e vi permetterà di avvertire i visitatori che il loro browser è obsoleto. Dopo il tag body vi basterà incollare questo codice:

<!--ie6-7 basta grazie-->
  <!--[if lt IE 7]>
  <div style='border: 1px solid #F7941D; background: #FEEFDA; text-align: center; clear: both; height: 75px; position: relative;'>
    <div style='position: absolute; right: 3px; top: 3px; font-family: courier new; font-weight: bold;'><a href='#' onclick='javascript:this.parentNode.parentNode.style.display="none"; return false;'><img src='http://www.ie6nomore.com/files/theme/ie6nomore-cornerx.jpg' style='border: none;' alt='Close this notice'/></a></div>
    <div style='width: 640px; margin: 0 auto; text-align: left; padding: 0; overflow: hidden; color: black;'>
      <div style='width: 75px; float: left;'><img src='http://www.ie6nomore.com/files/theme/ie6nomore-warning.jpg' alt='Warning!'/></div>
      <div style='width: 275px; float: left; font-family: Arial, sans-serif;'>
        <div style='font-size: 14px; font-weight: bold; margin-top: 12px;'>Stai usando un browser obsoleto</div>
        <div style='font-size: 12px; margin-top: 6px; line-height: 12px;'>Per una migliore navigazione su questo sito, per cortesia passa ad un browser di ultima generazione.</div>
      </div>
      <div style='width: 75px; float: left;'><a href='http://www.mozilla-europe.org/it/' target='_blank'><img src='http://www.ie6nomore.com/files/theme/ie6nomore-firefox.jpg' style='border: none;' alt='Get Firefox 3.5'/></a></div>
      <div style='width: 75px; float: left;'><a href='http://www.microsoft.com/downloads/details.aspx?FamilyID=341c2ad5-8c3d-4347-8c03-08cdecd8852b&DisplayLang=it' target='_blank'><img src='http://www.ie6nomore.com/files/theme/ie6nomore-ie8.jpg' style='border: none;' alt='Get Internet Explorer 8'/></a></div>
      <div style='width: 73px; float: left;'><a href='http://www.apple.com/it/safari/download/' target='_blank'><img src='http://www.ie6nomore.com/files/theme/ie6nomore-safari.jpg' style='border: none;' alt='Get Safari 4'/></a></div>
      <div style='float: left;'><a href='http://www.google.com/chrome?hl=it' target='_blank'><img src='http://www.ie6nomore.com/files/theme/ie6nomore-chrome.jpg' style='border: none;' alt='Get Google Chrome'/></a></div>
    </div>
  </div>
  <![endif]-->

In questo modo SE (IF) viene rilevato una versione di IE inferiore alla 7 in alto al vostro sito apparirà un frame contenente informazioni utili per aggiornare il browser web. In questo modo i visitatori sapranno che sono loro a essere in torto !

Il consiglio che vi dò è di escludere anche IE7 (anche il 7 non è stato proprio una manna dal cielo), in questo modo:

 <!--[if lt IE 8]>

Ecco fatto! Molto facile e veloce. Cosa aspettate a debellare questa piaga! aiutatemi condividendo questo articolo!