IE9 e HTML5

Uno sguardo alle nuove caratteristiche di Internet Explorer 9 ed alle funzionalità supportate di HTML5.

La nuova versione di Internet Explorer si preannuncia molto interessante per gli sviluppatori, viste le numerose modifiche introdotte ed i miglioramenti al motore di rendering.

Si potrebbe discutere a lungo sui ritardi nell’introduzione di novità già presenti da tempo sui browser concorrenti, ma al momento la cosa più importante è capire cosa cambierà nel prossimo futuro.

Il supporto di HTML5

Seguendo la working draft del W3C, queste caratteristiche sono già state presentate come supportate da IE9:

Inoltre sono state introdotte altre novità interessanti, come il supporto a SVG.

Guida per sviluppatori

E’ stato realizzato anche un documento molto ben dettagliato destinato agli sviluppatori. Si tratta della Beta Guide for Developers, dove si parla di CSS3, DOM, SVG e HTML5.

La guida finché il browser non sarà rilasciato potrà subire dei cambiamenti, ma già adesso è un utile punto di riferimento.

E le vecchie versioni di IE?

Quello delle versioni obsolete non è un problema da sottovalutare. E’ difficile infatti trovare versioni obsolete di Firefox o Chrome, mentre è cosa nota l’incredibile resistenza di Explorer 6. Proprio per questo motivo conviene sfruttare JavaScript, scegliendo tra due soluzioni:

  • ie7.js: consente di adeguare IE6 agli standard, aggiungendo anche il supporto alle immagini png trasparenti
  • Modernizr: una libreria che individua le funzioni supportate dal browser utilizzato, aggiungendo all’elemento html delle classi (per esempio .borderradius, .audio, .opacity…). Non aggiunge nuove funzionalità ai browser obsoleti, ma permette di individuarne le mancanze e gestirli in maniera diversa.

Qualsiasi soluzione decidiate di adottare, è bene considerare le conseguenze: abbandonare il supporto a IE6 ormai non è una scelta sbagliata, ma significa escludere comunque una parte di utenti. Il mio consiglio è di fare le dovute considerazioni a seconda del target del vostro sito: se vi rendete conto che gli utenti di Explorer 6 sono ancora numerosi, un file JavaScript potrebbe salvarvi.

IE9 ed il supporto dei CSS3

IE9 potrà sfruttare tutti i selettori dei CSS3: solo Opera presenta ancora dei problemi.

La novità degli ultimi giorni riguarda Internet Explorer 9: la futura versione del browser Microsoft supporta infatti tutti i selettori dei CSS3.

Incredibile ma vero, nella tabella di compatibilità preparata in maniera eccellente da Quirksmode, IE9 entra infatti nel gruppo dei browser che possono utilizzare tutti i selettori più utili, compresi anche alcuni dei CSS 2.1.

I selettori supportati da Internet Explorer 9

CSS 2.1

  • :before e :after
  • :first-child
  • :focus

CSS 3

  • :empty
  • :enabled, :disabled e :checked
  • :first-of-type
  • :last-child
  • :last-of-type
  • :not
  • :nth-child()
  • :nth-last-child()
  • :nth-last-of-type()
  • :nth-of-type()
  • :only-child
  • :only-of-type
  • :root
  • ::selection
  • :target

In questa lista sono esclusi alcuni selettori che sono già supportati dalle versioni precedenti di IE.

Interessante notare che mentre le ultime versioni di Firefox, Safari e Chrome non hanno problemi, adesso è Opera l’unico browser ad essere rimasto indietro, con delle difficoltà di interpretazione dei selettori :nth-child() ed :nth-of-type(). Opera infatti non riesce ancora a capire il funzionamento di queste regole, utili ad esempio per evidenziare gli elementi pari di una lista, o dare alternativamente a delle immagini float:right e float:left.

Implicazioni future

Questo ovviamente non significa che con l’uscita di Explorer 9 i selettori dei CSS3 potranno essere usati senza problemi (le versioni precedenti ci faranno compagnia per molto tempo), ma ci stiamo avviando verso un futuro più semplice per gli sviluppatori. L’uso di queste regole infatti consentirà di eliminare id e classi inutili dall’HTML, alleggerendo la struttura delle pagine.

Per il momento non resta che sperimentare ed affidarsi se necessario a soluzioni come ie-css3.js, aspettando la scomparsa dei browser più obsoleti.

Microsoft e la scelta del browser

Le possibili conseguenze dell’introduzione del “ballot screen” nei sistemi operativi Windows.

Schermo per la selezione del browserL’Unione Europea ha annunciato l’accordo con Microsoft: da Aprile 2010 tutti i sistemi operativi della casa di Redmond (Windows Xp, Vista e 7) dovranno permettere all’utente di scegliere quale browser utilizzare, senza imporre Internet Explorer.

Potete leggere maggiori dettagli a riguardo su Punto Informatico: la cosa fondamentale da sapere è che la novità riguarderà tutti i computer europei dove IE è il browser predefinito, e sarà possibile scegliere tra dodici alternative. La lista dei browser verrà aggiornata ogni sei mesi, ed inizialmente prevederà:

  • Internet Explorer
  • Firefox
  • Chrome
  • Safari
  • Opera
  • K-Meleon
  • AOL
  • Slim Browser
  • Maxthon
  • Avant Browser
  • Flock
  • Sleipnir

La decisione sembra rilevante, anche se la sentenza della UE alla fine ha coinvolto browser con percentuali di mercato minime. La concorrenza doveva essere garantita, ma adesso i tanti nomi entrati in gioco rischieranno di confondere ancora di più gli utenti.

Per gli sviluppatori cambierà qualcosa? Impossibile prevederlo con precisione, ma è quasi certo che la maggior parte degli utenti continuerà a scegliere ciò che conosce meglio, ed Explorer resterà a farci compagnia ancora per molto tempo.

Proviamo ad immaginare quello che succederà sul computer di un utente medio con IE come browser predefinito:

  • l’utente che vuole accedere ad internet e si troverà davanti una schermata mai vista
  • gli verrà detto di scegliere tra dodici alternative, la maggior parte mai sentita prima
  • riconoscerà l’icona o il nome di Internet Explorer e lo selezionerà

Sarà interessante vedere le statistiche di utilizzo dei browser nel periodo immediatamente successivo all’introduzione del ballot screen, ma difficilmente ci saranno rivoluzioni: molto dipenderà anche da come sarà presentata la selezione. Per il momento l’unica anteprima a disposizione mostra un elenco con scrollbar orizzontale, che avvantaggerà i primi browser dell’elenco. Secondo voi cambierà qualcosa?

Addio Internet Explorer 6

E’ finalmente arrivato il momento di trascurare la versione più odiata del browser Microsoft.

Sembrava impossibile fino a qualche mese fa: IE6, fonte di preoccupazioni e ore di lavoro aggiuntive su progetti ormai chiusi, è destinato a scomparire. L’ultima verifica che ho fatto risale ad appena due giorni fa: chiedendo su vari network come comportarmi con il suo supporto in un progetto che utilizza diverse png trasparenti, il consiglio quasi unanime è stato di lasciar perdere.

E’ iniziato tutto con una domanda su Twitter, rimbalzata poi su FriendFeed e Facebook:

in dubbio per un nuovo sito, già abbastanza carico di JavaScript: usare un js anche per i png trasparenti su IE6 o lasciar perdere?

La discussione che ne è seguita su FriendFeed è chiara: in caso di siti con target particolari potrebbe esser fatta un’eccezione, ma se il cliente non lo richiede in maniera esplicita, è giunta l’ora di abbandonare il supporto a questo browser.

Le risposte ottenute su Twitter sono ancora più lapidarie: Mushin e gfields suggeriscono di lasciar perdere ed anche netfranz concorda, pur consigliando una eventuale soluzione JavaScript. Solo Lauryn propone di utilizzare delle gif alternative, altro metodo valido.

Su Facebook infine sono arrivati altri inviti ad abbandonare IE6: il quadro generale è chiaro.

Quasi due anni fa sostenevo su questo blog come fosse troppo presto per dimenticarsene, ma adesso la situazione è definitivamente cambiata. Sono sempre più i siti importanti che non vengono visualizzati correttamente su Explorer 6, ed è giusto così. E’ giusto che venga fatto qualche test per assicurarsi che i siti rimangano comunque leggibili, ma non è più tempo di preoccuparsi di errori grafici secondari e del mancato allineamento degli elementi della pagina. Se avete ancora dubbi, potete spingere i vostri utenti ad aggiornare il browser, ma è finalmente ora di guardare avanti.

Come continuare ad offrire un servizio di qualità

In un quadro dove IE6 non ha più grande rilevanza, rimane fondamentale assicurare la qualità dei propri progetti web. Un tempo poteva essere garantita l’ottimizzazione cross-browser anche su IE6, ora è il momento di pensare a ciò che ci riserverà il futuro.

Alcuni attributi e selettori dei CSS3 possono ad esempio già essere utilizzati con successo: il progressive enhancement può offrire un’esperienza migliore ai visitatori che utilizzano browser evoluti, perchè non sfruttarlo? Text-shadow e border-radius sono già a disposizione, non è sbagliato iniziare ad usare queste proprietà, anzi è il momento giusto per osare.

Avete avuto esperienze negative con IE6? Se volete raccontarle o pensate che sia ancora troppo presto per abbandonarlo, dite la vostra nei commenti.

Spingere gli utenti ad aggiornare Explorer 6

Alcuni consigli pratici per incentivare l’aggiornamento di IE6.

Su questo blog ci sono state numerose discussioni su Internet Explorer 6 e su quanto renda complicata la vita degli sviluppatori. E’ possibile rimanere passivi e aspettare la sua lenta morte, ma non è detto che questo sia l’atteggiamento migliore. Ogni web designer infatti può dare un contributo alla sparizione di questo browser, che esiste dal 2001.

Le soluzioni possibili

Il modo migliore per far capire ad un utente che il suo browser è obsoleto, è presentargli una versione del sito alternativa. Sfruttando i commenti condizionali è possibile fornire ad IE6 un CSS su misura:

<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" href="http://www.sito.com/css/ie6.css" />
<![endif]-->

In questo modo tutte le versioni di Explorer precedenti alla 7 vedranno il sito in maniera diversa: potrete divertirvi come volete con questo foglio di stile. Un eccellente esempio di personalizzazione è offerto da questo sito, che con IE6 appare interamente in bianco e nero.

Anche su TomStardust.com ho voluto fare qualcosa: adesso navigando con il browser Microsoft l’header appare diverso, e compare anche un avviso che invita il visitatore ad aggiornare. Tutto è collegato ad una nuova pagina creata per l’occasione, con i link per il download dei migliori browser. Come avrete capito non sono comunque a favore delle soluzioni drastiche: è bene che i contenuti siano accessibili in ogni caso.

TomStardust.com: versione per Explorer 6

La soluzione definitiva?

Ovviamente questi interventi non potranno portare in tempi brevi alla sparizione di IE6. Molti utenti continueranno ad utilizzarlo perchè non possono fare altrimenti, magari per obblighi aziendali.

E’ comunque importante dare un segnale: esistono già diverse campagne di sensibilizzazione e siti come Facebook da tempo presentano avvisi agli utenti di Explorer 6. Il 2009 probabilmente non vedrà sparire questo browser, ma potrebbe essere l’anno della svolta.

Installare in contemporanea IE6, IE7 e IE8

Avere le tre versioni di Internet Explorer su un unico computer è possibile, per la gioia dei web designer.

Internet Explorer: icona L’uscita di Internet Explorer 8 per gli sviluppatori significa soprattutto una cosa: un nuovo browser su cui dover testare i propri lavori. I browser Microsoft diventano quindi tre, ma come è possibile installarli in contemporanea?

La soluzione non è così complicata:

  • IE6 e le versioni precedenti possono essere installate con Multiple IE di Tredosoft
  • IE7 si ottiene grazie all’installer standalone fornito sempre da Tredosoft
  • IE8 viene installato con il normale aggiornamento di Windows

Questa soluzione ha qualche problema per quanto riguarda Internet Explorer 6, soprattutto con siti che fanno un uso intensivo di JavaScript, ma il rendering nella maggior parte dei casi è fedele all’originale.

Un’altra possibilità è data da uno strumento Microsoft chiamato Expression Web SuperPreview, ma vi permetterà solamente di avere IE6 in parallelo con uno degli altri due browser: o la versione 7 o la 8, ma non entrambe.

Altre alternative come installare delle virtual machine sono possibili, ma se non avete particolari esigenze meglio evitare di complicarsi la vita.

Su cosa succederà nei prossimi mesi è difficile fare delle previsioni, ma IE6 potrebbe anche continuare a resistere. E’ plausibile infatti che siano gli utenti di Explorer 7 ad aggiornare: gli altri se non l’hanno fatto fino ad ora difficilmente cambieranno idea, qualsiasi sia il motivo.

Intanto c’è chi ha già trovato il primo bug di Explorer 8: devo ancora verificare il problema, ma pare che visitando questa pagina con il nuovo browser Microsoft non venga visualizzato correttamente lo sfondo. I prossimi giorni saranno determinanti per farsi un’idea più chiara, leggendo le reazioni della rete.

Ubiquity, comandi personalizzati per Firefox

Alla scoperta di Ubiquity, plugin dei Mozilla Labs per Firefox, con una semplice guida per creare i propri comandi di ricerca personalizzati.

Ubiquity è una delle ultime creazioni dei Mozilla labs: un plugin per Firefox che espande le funzionalità del browser.

Con una semplice combinazione di tasti ( CTRL + spazio su Pc e ALT + spazio su Mac) è possibile aprire un riquadro all’interno della finestra attiva. Da questo riquadro scrivendo poche lettere si è in grado di fare praticamente qualsiasi cosa tramite un’interfaccia a riga di comando: cercare un termine su Google o Wikipedia, tradurre il contenuto di una pagina, cercare delle immagini su Flickr o un indirizzo su Googlemaps, non ci sono limiti alle operazioni possibili.

I comandi più immediati sono:

  • g: ricerca su Google
  • w: ricerca su Wikipedia
  • f: ricerca su Flickr
  • map: ricerca su Googlemaps di un indirizzo, se selezionate del testo Ubiquity cercherà direttamente quanto evidenziato
  • translate: traduzione del testo evidenziato nella pagina da una qualsiasi lingua all’inglese, utilissima per lingue sconosciute come il cinese
  • imdb: ricerca sull’Internet Movie Database
  • twitter: aggiorna il proprio stato di Twitter

Fantastica è la possibilità di estendere i commenti presenti, importandoli da altri siti o scrivendoli autonomamente. Per maggiori informazioni vi rimando a quelli elencati sul sito ufficiale e su questo post dei Googlisti.

Creare comandi personalizzati

E’ possibile anche creare dei comandi personalizzati per Ubiquity, magari abbinando una parola chiave alla ricerca sul vostro sito web.

Seguendo questo tutorial potete realizzare in poche righe un comando che permette di effettuare la ricerca di qualsiasi termine. Una volta realizzato lo script, salvatelo in un file .js, caricatelo sul vostro server e collegatelo ad una pagina con il seguente codice da inserire tra i tag <head> e </head>:

<link rel="commands" href="http://percorso-del-file-js" name="Titolo" />

Potete provare il comando che ho realizzato per tomstardust.com andando su questa pagina dopo aver installato Ubiquity. Una volta autorizzato lo script, potrete utilizzare il comando tomstardust per cercare qualsiasi termine su questo sito.

Se a questo punto siete incuriositi da Ubiquity e non l’avete ancora installato, potete farlo dalla pagina ufficiale dei Mozilla Labs, dove trovate anche un video con una dimostrazione pratica.

Quando ottimizzare un sito per IE6?

I criteri da utilizzare per decidere quando trascurare Internet Explorer 6 nello sviluppo di un sito web.

Il 3 e 4 Novembre 2008 si terrà a New York l’annuale conferenza Future Of Web Design. Per pura curiosità (e deformazione professionale) dopo aver visitato il sito dell’evento ho scoperto che non è ottimizzato per Internet Explorer 6 e mi sono trovato davanti un banner con il suggerimento di installare Firefox o Safari:

Essendo un sito realizzato da professionisti del settore, ho deciso di indagare più a fondo per capire le ragioni di una tale scelta. Il passo successivo è stato controllare Carsonified, del team organizzatore dell’evento. Anche questo non viene visualizzato correttamente con IE6.

Che sia quindi ora di trascurare questo browser? Ad un primo esame sembra che anche i più noti web designer non se ne preoccupino.

In realtà le cose non sono esattamente così. Basta visitare i siti del portfolio di Carsonified per rendersene conto. Portali come Vitamin, o applicazioni web come DropSend e Amigo, sono perfettamente funzionanti anche su IE6.

C’è un motivo dietro a questa scelta? Ovviamente sì, niente è lasciato al caso in queste situazioni.

Se il sito di una conferenza sul web design, frequentato da professionisti, può permettersi di trascurare IE6, così non può essere per delle web applications che devono affermarsi in rete, ed hanno bisogno del maggior numero di utenti possibile.

Tutto dipende dal target dei visitatori, che condiziona le strategie di sviluppo di un progetto: che sia un blog, un sito, o un’applicazione non fa alcuna differenza.

Il criterio è chiaro, ed a mio parere è la scelta più corretta da fare in questo momento. Liberarsi di Explorer 6 come se non esistesse è prematuro. La sua quota mondiale di diffusione è ancora pari al 25% e non è possibile trascurarlo.

Se avete intenzione di realizzare un sito e sapete in partenza che sarà visitato da utenti comuni, dovrete continuare a preoccuparvi anche del browser Microsoft per qualche tempo.

Il discorso cambia se siete alle prese con un sito per un target di superutenti, ma questa al momento è ancora un’eccezione, non la regola.

Ricordate però che tutta l’ottimizzazione che farete sarà comunque un grande valore aggiunto, che potrete offrire al cliente quali professionisti del settore. Sfruttate la possibilità, non nascondetevi dietro a delle scuse, e vedrete anche IE6 sotto un’altra luce.

Google Chrome: le statistiche aggiornate

Dopo il clamore del lancio, il browser di Google si assesta su una quota globale pari all’1%, con risultati migliori sui siti tecnici.

Che Google Chrome non potesse mantenere i numeri dei giorni successivi al lancio era una certezza. Il browser è stato installato e messo alla prova da numerosi utenti, che sono in gran parte tornati alle proprie abitudini.

Dopo circa 20 giorni dalla sua nascita (avvenuta il 3 Settembre), è però interessante fare qualche analisi per verificarne la diffusione.

Relativamente a questo blog, che non ha i grandi numeri dei portali più famosi e viene visitato soprattutto da utenti tecnici, questi sono i dati:

  • il 3 Settembre, giorno del lancio, Chrome ha raggiunto quota 14,27%
  • dopo i primi due giorni, tra il 5 ed il 23 Settembre, la media è scesa al 5,67%
  • tra il 3 ed il 23 Settembre la media è del 6,44%

Complessivamente i numeri si allineano con quelli di Techcrunch, altro sito tecnico ma dalle visite ben superiori, le cui proporzioni restano però simili. Il 4 Settembre infatti ha dichiarato che Chrome sul proprio sito era a quota 6,23%.

Ed i siti rivolti ad utenti meno tecnici? Per un quadro più generale ci sono le statistiche pubblicate dal blog di StatCounter, che si basano su 450 milioni di pageviews realizzate tra l’1 e l’11 Settembre. Google Chrome globalmente non ha mai superato l’1,18%, per assestarsi intorno all’1% dopo i primi giorni.

E’ ancora presto per dire se le cifre siano stabili, probabilmente ci sarà bisogno di qualche altro mese di attesa. Difficile comunque capire se l’ascesa di Chrome abbia sottratto utenti a Firefox o ad Explorer: non c’è una tendenza chiara a riguardo.

Se state utilizzando il browser targato Google, raccontate la vostra esperienza nei commenti. Io lo uso esclusivamente per GMail vista la velocità di apertura delle pagine, e continuo a preferirgli Firefox per tutti gli strumenti ed estensioni che offre.

Aggiornamento: proprio oggi NetApplications ha rilasciato i dati relativi alla settimana appena trascorsa. In un panorama di 2 milioni di siti web, Chrome risulta sceso allo 0,77% di media, indicando che i numeri del browser di Google sono ancora in calo.

Google Chrome: novità e lati oscuri

Alla scoperta del nuovo browser di Google: è una vera rivoluzione? Analisi del software e dei suoi problemi.

La notizia è ormai nota, Google in pochi giorni ha deciso di lanciarsi nel mondo dei browser web con la sua creatura: Chrome. In questo momento il software è anche pubblicizzato sulla stessa homepage del motore di ricerca, che sicuramente frutterà numerosi download.

Ho effettuato alcuni test, e posso dire con cognizione di causa che Google Chrome mi ha decisamente stupito. Mi aspettavo un prodotto spartano, ancora instabile e non all’altezza della concorrenza, ma i fatti mi hanno smentito clamorosamente.

Velocità

Fin dalle prime pagine aperte, vi renderete conto che la velocità del browser di Google è incredibile. Il motore javascript è stato realizzato da zero, ed i risultati si vedono.

Pseudotecnico sul suo blog ha pubblicato un confronto con Firefox 3, fino ad ora il più veloce, e Chrome risulta 3 volte meglio.

Rendering delle pagine

Chrome utilizza WebKit per il rendering delle pagine, lo stesso di Safari 3.1. I siti realizzati secondo gli standard web non avranno quindi grandi problemi di visualizzazione. Potrebbe essere necessario un controllo per evitare problemi con il Javascript, ma per gli sviluppatori il lavoro aggiuntivo non dovrebbe essere troppo.

Dai primi test ho notato però che text-shadow, proprietà dei CSS3 funzionante su Safari, non ha alcun effetto su Chrome.

Barra degli indirizzi e ricerca

La barra degli indirizzi funziona in maniera simile a quella di Firefox 3, ma serve anche come casella di ricerca. E’ una bella soluzione, consente di alleggerire l’interfaccia e dopo poco tempo diventa tutto intuitivo. Tutto sommato è una banalità, ma nessuno ci aveva pensato prima.

Dettagli e curiosità

Ci sono altre funzioni degne di nota, prima di tutto per gli sviluppatori. E’ disponibile una console Javascript, un debugger, e cliccando col tasto destro del mouse su una pagina appare la voce “Ispeziona elemento” che apre una finestra simile a Firebug.

Come noto inoltre, le tab aperte occupano ognuna un processo separato. Se provate a chiuderne uno a caso dal task manager, vedrete apparire un originale messaggio sul browser.

Mancanza di estensioni

Il principale difetto di Chrome, così come di altri browser, è la mancanza di estensioni ed add-on. E’ proprio questa la forza di Firefox, e nessuno fino ad ora è riuscito a contrastare il browser di casa Mozilla su questo campo. E’ improbabile che per Chrome le cose cambino: basti pensare ad un’estensione come AdBlock. Google non consentirà mai di nascondere le pubblicità sul suo browser.

Problemi di sicurezza

Safari ha presentato alcune lacune sul lato della sicurezza, e Chrome che deriva da WebKit non ne è esente. In particolare è stata già riscontrata una vulnerabilità grave, che su Safari è stata corretta, mentre sul browser di Google è ancora presente.

Licenza d’uso

La nota dolente di Chrome è soprattutto questa. La licenza di utilizzo del software presenta diversi lati oscuri, una vera manna per chi contesta a Google le sue attitudini da Big Brother.

Il primo punto critico riguarda gli aggiornamenti, visto che Google si riserva il diritto di installarli automaticamente senza che l’utente possa fare niente.

Altro punto della licenza riguarda la pubblicità:

[..] alcuni servizi sono supportati con sistema di advertising revenue e possono mostrare pubblicità e promozioni. Queste pubblicità possono essere personalizzate sui contenuti delle informazioni allocate nei servizi [..]

Chrome potrebbe quindi sfruttare le numerose informazioni dell’utente collezionate durante la navigazione per scopi pubblicitari. Advertising mirato quindi, a scapito della privacy.

Conclusioni

Il nuovo browser di Google è un prodotto interessante, veloce e per certi versi innovativo, soprattutto per quanto riguarda l’interfaccia. Personalmente trovo difficile rinunciare a Firefox, ma non mi stupirei se Chrome guadagnasse quote di mercato interessanti.

Restano i lati oscuri riguardanti la sicurezza e la privacy, e per il momento esiste solo la versione Windows, ma il futuro potrebbe riservarci numerose sorprese. Se Google decidesse di puntare in questa direzione con decisione, anche i competitor più agguerriti avranno dei problemi a mantenere le loro quote di mercato.

Se avete altri dubbi su Chrome, vi rimando alle FAQ realizzate da Giovy.