I browser sono le finestre attraverso le quali il mondo vede il nostro lavoro, quindi è saggio prestare attenzione e capirle. Sfortunatamente, i browser e la tecnologia web possono cambiare rapidamente: questo articolo ti aggiornerà e presenterà un'istantanea del mercato dei browser così com'è in questo momento.
Per quanto possiamo lamentarci di questo, trattare le molte stranezze e incongruenze che esistono tra i browser è una necessità nella vita quotidiana dei web designer e sviluppatori. Questo particolare problema esiste da un po 'di tempo ed è probabile che continui per molti anni a venire. È quindi essenziale che i web designer e gli sviluppatori siano sempre aggiornati sugli ultimi sviluppi del browser al fine di produrre i siti web più efficaci.
Può essere difficile tenere il passo con la situazione attuale dei browser. Ci sono cinque principali browser, ognuno dei quali ha più versioni con aggiornamenti frequenti. Aggiungi questo al fatto che tutti hanno diversi livelli di supporto per le varie funzionalità di CSS3 e HTML5 e tutto può diventare un po 'opprimente. Questo articolo tenterà di stabilire lo stato del mercato dei browser così com'è adesso. Iniziamo.
L'immagine sotto mostra i numeri di versione attuali di ciascuno dei cinque principali browser al momento della scrittura. Potresti notare che il browser più recente, Google Chrome, ha un numero di versione molto più alto di Internet Explorer, che è stato molto più lungo. Si tratta del ciclo di rilascio di sei settimane di Google, che aggiorna il browser e il numero di versione ogni volta. In netto contrasto abbiamo gli aggiornamenti tradizionalmente lenti di Internet Explorer, che hanno atteso cinque anni prima di passare da IE6 a IE7.
Tuttavia, Microsoft sta aumentando il ritmo di rilascio con le ultime versioni di IE. Passarono solo due anni tra IE8 e IE9 e Microsoft annunciò ufficialmente IE10 solo un mese dopo il rilascio di IE9. Firefox ha seguito l'esempio, implementando anche un ciclo di rilascio di sei settimane, e si parla addirittura di una riduzione ogni cinque settimane.
Ci sono state critiche su versioni così brevi della versione. Alcuni hanno suggerito che con pochi o nessun aggiornamento di funzionalità principali tra le versioni, è il rendering dei numeri di versione irrilevanti. È stato anche fatto notare che non consente tempo sufficiente per correggere errori ed errori prima del rilascio.
Dal punto di vista dei web designer e sviluppatori, i cicli di rilascio più veloci dovrebbero generalmente essere una buona cosa. IE6 è stato autorizzato a ristagnare e combinata con la sua enorme quota di mercato ha fatto da peso alla comunità del web design. I moderni browser ora competono tra loro per fornire supporto alle tecnologie web emergenti. Le ultime funzionalità di HTML5 e CSS3 possono essere adottate e implementate più rapidamente, accelerando i progressi verso la completa standardizzazione.
È sempre interessante controllare le ultime statistiche di utilizzo del browser, se non altro per vedere se l'IE6 è finalmente scomparso (non ancora, purtroppo). Scoprire come gli utenti stanno effettivamente visualizzando il web può essere molto istruttivo. Tuttavia, diverse fonti di informazione possono dipingere immagini molto diverse della situazione attuale. Ad esempio, diamo un'occhiata ai dati di utilizzo del browser da due fonti diverse.
W3Schools | 38,7% | 4,2% | 32,3% | 21,7% | 2,4% |
StatCounter | 26.39% | 5,93% | 25% | 40.18% | 1,81% |
I numeri rappresentano i dati raccolti per il mese di ottobre 2011 (le cifre di novembre non sono ancora disponibili per ovvi motivi). Le statistiche di W3Schools vorrebbe farci credere che tutte le versioni di IE costituiscono solo il 21,7% di tutti gli utilizzi del browser, inferiori sia a Chrome che a Firefox. Confrontalo con i dati di StatCounter, il che suggerisce che Internet Explorer continua a comandare la maggior parte della condivisione a oltre il 40%.
Il problema è che la natura di un sito Web spesso distorce in qualche modo i risultati. Prendiamo ad esempio questo sito Web, gli utenti sono (si spera) piuttosto esperti di Web e probabilmente utilizzeranno un browser molto recente, aggiornato e moderno. Questo è lo stesso caso delle figure di W3Schools, poiché la fonte delle loro figure sono i propri file di registro. Lo segnalano da soli:
W3Schools è un sito Web per le persone con un interesse per le tecnologie web. Queste persone sono più interessate all'utilizzo di browser alternativi rispetto all'utente medio. L'utente medio tende al browser che viene preinstallato con il proprio computer e non cerca altre alternative del browser.
Vale la pena tenerlo presente quando si visualizzano tali dati. Le statistiche derivate dall'analisi dei dati del tuo sito web saranno sempre più pertinenti e utili. Ciononostante, le statistiche globali possono ancora rivelarsi perspicaci e i dati possono spesso rivelare tendenze e modelli attuali. Il seguente grafico, da StatCounter, mostra l'utilizzo del browser proporzionale nell'ultimo anno:
Dal grafico precedente sembrerebbe che Chrome abbia guadagnato terreno significativo nell'ultimo anno, principalmente a spese di Internet Explorer e Firefox, mentre Safari e Opera sono rimasti a un livello relativamente costante. Sebbene Internet Explorer abbia perso terreno, sembrerebbe che regni ancora come il browser più utilizzato in qualche modo.
Quindi, diamo un'occhiata all'utilizzo della versione del browser globale di questo mese (novembre 2011) finora.
È stato menzionato in precedenza in questo articolo che gli sviluppatori di browser sembrano puntare a cicli di rilascio più brevi, solo sei settimane nel caso di Chrome e Firefox. Anche se i cicli di rilascio più brevi sembrano essere una buona mossa, sono efficaci solo se gli utenti scelgono di eseguire l'aggiornamento alla versione più recente. Se l'assorbimento è basso, potrebbe lasciare gli utenti sparsi su molte versioni dello stesso browser, tutte con diversi livelli di supporto e funzionalità.
Chrome ha principalmente risolto questo problema implementando una funzionalità di aggiornamento automatico, senza richiedere l'autorizzazione dell'utente. L'effetto di questo può essere visto sul grafico sopra. La versione più recente di Chrome, 15, è stata rilasciata solo il 25 ottobre, ma ha già sostituito quasi completamente Chrome 14.
Firefox non è ancora nella fase degli aggiornamenti automatici, ma richiede ancora fortemente all'utente di eseguire l'aggiornamento all'avvio del browser. Firefox 8 è stato rilasciato solo all'inizio di questo mese, ma già è passato un numero elevato di utenti. La maggior parte dei loro utenti è in versione 7, eppure rimane ancora un numero significativo che utilizza 3.6, rilasciato quasi due anni fa. Mozilla prevede di implementare aggiornamenti silenziosi con la versione 10 di Firefox.
... rendendo IE9 incompatibile con Windows XP, il sistema operativo più utilizzato al mondo.
Sfortunatamente, Internet Explorer ha sempre avuto grossi problemi nel far aggiornare gli utenti. Internet Explorer 9 è disponibile da un po 'di tempo, ma una buona quantità di utenti rimane ancora sulle versioni 8, 7 e addirittura su 6. Tuttavia, Microsoft non sembra aiutare la situazione, rendendo IE9 incompatibile con Windows XP, il più utilizzato al mondo sistema operativo. Questa politica continuerà anche con IE10, che richiederà Windows 7 e versioni successive.
Il gran numero di persone che ancora utilizzano IE8 può essere motivo di preoccupazione per i web designer e gli sviluppatori. Internet Explorer 8 rimane il browser più utilizzato, secondo i grafici sopra, ma fornisce pochissimo supporto per la maggior parte delle funzionalità CSS3 e HTML5. CSS3 e HTML5 sono ben supportati tra gli ultimi browser (come vedremo in seguito), tuttavia la popolarità di IE8 significa che per il futuro prevedibile saranno ancora necessari fogli di stile alternativi e fallbacks.
Con l'uscita di IE9 all'inizio di quest'anno, ora significa che le ultime versioni dei cinque principali browser hanno alcuni livelli di supporto CSS3. Mentre le versioni precedenti dei browser devono ancora essere considerate, questo è un passo importante nella giusta direzione e una buona notizia per i web designer e gli sviluppatori. Vale la pena ricordare, tuttavia, che i CSS3 sono ancora in fase di sviluppo e che i vari browser hanno diversi livelli di supporto per le varie funzionalità di CSS3. Alcune funzionalità sono ben supportate mentre altre no e potrebbe essere necessario utilizzare i prefissi dei fornitori come -moz-, -webkit- e -o-.
Diamo uno sguardo più da vicino alla situazione attuale di alcune delle funzionalità più popolari di CSS3.
In primo luogo, ci sono alcuni elementi di CSS3 che sono molto ben supportati. I selettori CSS3, ad esempio, hanno avuto buoni livelli di supporto per qualche tempo e recentemente sono diventati una raccomandazione ufficiale del W3C ora che sono stati implementati da tutti i browser moderni.
Ci sono anche altri elementi di CSS3 che puoi sentire abbastanza sicuro di usare in questo momento. I colori CSS3 come RGBA e HSLA sono stati i primi elementi di CSS3 a diventare una raccomandazione ufficiale e sono supportati in tutti i browser moderni. Ecco alcune altre proprietà CSS3 supportate da tutti i browser moderni.
Versione | 8 | 5.1 | 15 | 9 | 11.5 |
RGBA | ? | ? | ? | ? | ? |
HSLA | ? | ? | ? | ? | ? |
BG multipli | ? | ? | ? | ? | ? |
Border-radius | ? | ? | ? | ? | ? |
Box-shadow | ? | ? | ? | ? | ? |
Opacità | ? | ? | ? | ? | ? |
Trasformazioni | ? | ? | ? | ? | ? |
Font-face | ? | ? | ? | ? | ? |
Media-query | ? | ? | ? | ? | ? |
Naturalmente, ci sono ancora molte proprietà dei CSS3 che non sono così ampiamente supportate. Sebbene l'IE9 di Microsoft supporti i CSS3, continua a giocare perché non supporta molte delle proprietà che altri browser hanno fatto da un po 'di tempo. Sembra che stiano lavorando su questo, con molte altre proprietà impostate per essere supportate in IE10. Ecco una tabella che mostra diversi livelli di supporto per altre proprietà CSS3.
Versione | 8 | 5.1 | 15 | 9 | 11.5 |
animazioni | ? | ? | ? | ? | ? |
transizioni | ? | ? | ? | ? | ? |
Riflessi | ? | ? | ? | ? | ? |
Trasformazioni 3D | ? | ? | ? | ? | ? |
Border-immagine | ? | ? | ? | ? | ? |
Text-shadow | ? | ? | ? | ? | ? |
HTML5 si trova nella stessa situazione di CSS3 in quanto è ancora in fase di sviluppo e presenta quindi diversi livelli di supporto tra i vari browser. Molto simile al CSS3, ci sono funzionalità che sono universalmente supportate, come Canvas, mentre altre funzionalità non hanno praticamente alcun supporto.
Ecco il supporto del browser per una gamma di elementi HTML5.
Versione | 8 | 5.1 | 15 | 9 | 11.5 |
Tela | ? | ? | ? | ? | ? |
SVG | ? | ? | ? | ? | ? |
Archiviazione Web | ? | ? | ? | ? | ? |
Trascina e rilascia | ? | ? | ? | ? | ? |
Toccare | ? | ? | ? | ? | ? |
Operatori Web | ? | ? | ? | ? | ? |
Posizione geografica | ? | ? | ? | ? | ? |
Prese Web | ? | ? | ? | ? | ? |
IndexDB | ? | ? | ? | ? | ? |
L'audio e il video HTML5 erano molto attesi e sono stati molto discussi dal suo annuncio. Uno dei sostenitori più fedeli del video HTML5 è stato Apple, che si sta preparando per abbandonare il supporto per Flash e renderlo il riproduttore video preferito su tutti i propri dispositivi mobili. Sembrerebbe che Apple abbia fatto a modo suo, poiché Adobe ha recentemente annunciato che sta bloccando lo sviluppo di Flash per dispositivi mobili. Questa mossa apre la strada all'ulteriore supporto e allo sviluppo di video HTML5.
Alcuni grandi siti Web di video hosting hanno anche sperimentato video HTML5 tra cui YouTube, Vimeo e DailyMotion. Tuttavia, ci vorrà un po 'prima che venga effettuato un passaggio completo su qualsiasi sito Web di condivisione di video di grandi dimensioni. Uno degli aspetti chiave che frenavano il passaggio a HTML5 è stata la mancanza di codec audio e video standard. Attualmente non ci sono codec audio o video supportati da tutti e cinque i browser moderni.
I moduli HTML5 offrono alcune funzioni interessanti come la convalida e nuovi tipi di input. Il supporto per queste nuove funzionalità del modulo sembra variare molto tra i browser. Opera è all'avanguardia in una certa misura, supportando quasi ogni nuova funzione, mentre IE9 non ne supporta quasi nessuno. Vale la pena notare tuttavia che molte di queste nuove funzionalità si degradano con garbo nei browser più vecchi.
C'erano tredici nuovi tipi di input introdotti nei moduli HTML5, sfortunatamente attualmente solo verso le cinque hanno un supporto significativo tra i browser.
Versione | 8 | 5.1 | 15 | 9 | 11.5 |
Ricerca | ? | ? | ? | ? | ? |
Telefono | ? | ? | ? | ? | ? |
URL | ? | ? | ? | ? | ? |
Gamma | ? | ? | ? | ? | ? |
? | ? | ? | ? | ? |
Sono stati introdotti anche molti nuovi attributi di forma, che sembrano essere molto migliori in termini di supporto. Ecco il supporto per solo alcuni dei nuovi attributi del modulo.
Versione | 8 | 5.1 | 15 | 9 | 11.5 |
segnaposto | ? | ? | ? | ? | ? |
Autofocus | ? | ? | ? | ? | ? |
Completamento automatico | ? | ? | ? | ? | ? |
Elenco | ? | ? | ? | ? | ? |
necessario | ? | ? | ? | ? | ? |
La convalida del modulo HTML5 è una funzionalità molto interessante. Tradizionalmente la convalida della forma lato client è stata implementata usando Javascript, che può causare problemi se l'utente ha Javascript disabilitato. La convalida del modulo HTML5 ha il potenziale per sostituire la convalida di Javascript nei browser moderni quando è completamente operativa.
Sfortunatamente, non è ancora in questa fase. Le versioni recenti di Chrome, Opera e Firefox supportano tutte la convalida del modulo HTML5. Safari 5 su Windows supporta anche la convalida HTML5, ma in qualche modo stranamente, non su OSX.
In questo articolo ci siamo concentrati principalmente sui browser desktop, ma, come tutti sappiamo, la navigazione mobile sta acquisendo una notevole trazione. Per questo motivo vale la pena dare un'occhiata anche alle tendenze e agli sviluppi del browser mobile.
Il grafico sopra mostra le statistiche di utilizzo del browser mobile per questo mese (novembre 2011). Sembrerebbe che non ci sia un singolo browser dominante, con Android, iPhone e la versione mobile di Opera, ciascuno con una quota di mercato molto simile. Anche i browser Nokia e Blackberry hanno una notevole quantità di utenti.
Ai fini di questo articolo, ci concentreremo sui primi tre browser mobili e daremo una panoramica di ciascuno di essi.
Con più dispositivi mobili che scelgono di utilizzare il sistema operativo Android, il browser Android ha aumentato lentamente la propria quota di mercato nell'ultimo anno.
Il browser Android predefinito si basa sul motore WebKit, lo stesso motore utilizzato da Chrome e Safari. Come ci si aspetterebbe, ha un buon supporto per CSS3 e HTML5 dalla versione 2.0 in poi. La versione 4.0 di Android (Ice Cream Sandwich) ha incluso il supporto per funzionalità come SVG e CSS3 3D Transforms sui browser per smartphone.
È stato suggerito che Google sostituirà il browser web Android integrato con il loro browser Chrome sempre più popolare nelle future versioni del sistema operativo Android.
Una delle maggiori funzionalità di iPhone è stata l'esperienza di navigazione offerta da Safari per iOS. Safari su iOS 5 non sembra diverso, con funzionalità come Reading List, Reader e navigazione Web più veloce.
Safari su iOS5 offre il miglior supporto per HTML5 e CSS3 attualmente disponibili. L'ultima versione ha migliorato il supporto per funzionalità HTML5 come Web Worker e nuovi tipi di input.
Abbiamo già trattato i moduli HTML5 in precedenza in questo articolo, ma è sull'iPhone in cui queste nuove funzionalità dei moduli sono davvero brillanti. L'iPhone cambia effettivamente la tastiera su schermo in relazione al tipo di input. Puoi aspettarti lo stesso dai nuovi tipi di input supportati tra cui data, mese e ora.
Anche se Opera potrebbe non funzionare in modo troppo brillante nel mondo dei browser desktop, sta recuperando tutto ciò nella sua forma mobile. Uno dei motivi per cui Opera potrebbe comportarsi così bene con i cellulari è che è molto veloce nel caricare pagine web. Opera utilizza una funzionalità denominata Turbo, che prima comprime i siti Web su un server prima di consegnarli al telefono, con una velocità di caricamento molto più rapida.
Opera mobile è attualmente alla versione 11 e proprio come la sua controparte desktop, e offre un eccellente supporto per CSS3 e HTML5.
Come accennato all'inizio di questo articolo, gli sviluppi del browser possono essere difficili da mantenere, specialmente con i nuovi cicli di rilascio più brevi. Spero che questo articolo ti abbia fornito un quadro aggiornato della situazione com'è adesso. Spero anche che si rivelerà un utile punto di riferimento in futuro. Grazie per aver letto :)