Il keynote di ieri al WWDC di Apple ha presentato due nuovi sistemi operativi. Il nuovo MacOS si chiama El Capitan dopo una formazione rocciosa in Yosemite (che è stata presa dalla maggior parte dei commentatori per indicare che Apple vede il suo prossimo OS come una versione minore, piuttosto che maggiore). MacOS El Capitan e iOS 9 sono ora disponibili per gli sviluppatori Apple, saranno rilasciati in beta pubblica il prossimo mese e andranno a vivere in autunno.

Nascosti tra gli sconvolgenti annunci sulla distribuzione di Apple a due interi paesi (Canada e Regno Unito) e il servizio di streaming musicale di Apple, sono emersi alcuni indizi su come Apple vede il Web, e il ruolo di Safari, evolversi nei prossimi anni ...

1) Scorrere lo snap

Uno dei più grandi annunci per i web designer è l'implementazione dello scroll scrolling CSS. Scroll snapping - che è attualmente ottenuto con JavaScript - è un metodo per regolare l'andamento su una pergamena in modo che lo scroll scatti su una posizione predefinita. Se hai mai fatto scorrere un sito di una sola pagina che passava alla sezione successiva, al contrario di un numero arbitrario di pixel, hai sperimentato lo scorrimento della pagina.

Apple si aspetta che la tendenza per i siti a pagina singola ... continui

È un'indicazione che Apple si aspetta che la tendenza per i siti a pagina singola, con sezioni che riempiono l'intero viewport, continui senza sosta.

Safari 9 introduce le seguenti proprietà di snap scroll CSS: -webkit-scroll-snap-type, -webkit-scroll-snap-points-y, -webkit-scroll-snap-points-x, -webkit-scroll-snap-destination, e -webkit-scroll-snap-coordinate.

Poiché lo scroll snapping è in gran parte visto come un miglioramento progressivo, potrebbe presto essere pratico passare questo effetto da JavaScript a CSS.

2) Siti aggiunti

Safari 9 introduce siti aggiunti. I siti aggiunti sono un modo per mantenere aperti i siti Web preferiti nel browser per un accesso rapido, senza lasciare una scheda aperta. Per utilizzare i siti aggiunti in Safari 9, trascina una scheda aperta a sinistra e verrà creata una piccola icona nella barra dei Preferiti che consente di accedere rapidamente alla pagina.

Gli utenti si aspettano senza dubbio di utilizzare questa funzione, quindi tutti i siti devono essere preparati. Per essere pronti, tutto ciò che devi fare è creare un'icona: renderla completamente nera, con uno sfondo trasparente e salvarla come SVG. È quindi possibile collegare l'icona nella parte superiore del documento HTML, in questo modo:

Se desideri colorare l'icona in modo che corrisponda al tuo marchio, aggiungi subito questo tag meta tag:

3) Miglioramenti video HTML5

Safari 9 introduce un paio di miglioramenti per i video HTML5.

Airplay consente i controlli personalizzati per i supporti HTML5. Usando JavaScript sarai in grado di rilevare la disponibilità di Airplay e, laddove possibile (ad esempio in Safari 9), fornire controlli personalizzati. Ideale per chiunque sia stanco dei controlli predefiniti che rompono la coerenza del marchio.

PiP (Picture in Picture) è uno stile di video ampiamente utilizzato in TV. PiP prevede la riproduzione di un video nell'angolo dello schermo mentre altri contenuti sono visualizzati altrove; sfogliare la guida del canale su una casella Tivo mentre il canale corrente suona nell'angolo, è un buon esempio.

Safari 9 che introduce PiP è un'innovazione incredibile per chiunque ami guardare eventi live (come la nota chiave di Apple WWDC) mentre funziona. Tuttavia, come la maggior parte delle tecnologie, PiP è aperto agli abusi; è probabile che vedrete i primi annunci PiP spuntare nell'angolo del tuo browser nei prossimi 6 mesi. Fortunatamente Safari 9 include anche l'opzione per disattivare l'audio di tutte le schede con un semplice clic.

4) Forza gli eventi tattili

I nuovi MacBook di Apple sono dotati di trackpad sensibili alla forza; trackpad che rilevano non solo rubinetti, ma la forza con cui si tocca. Safari 9 introduce numerosi nuovi eventi JavaScript - ironicamente classificati come eventi mouse - per gestire la funzionalità: webkitmouseforcewillbegin, webkitmouseforcedown, webkitmouseforceup e webkitmouseforcechanged.

È probabile che gli eventi tattili di forza siano utili per la navigazione supplementare a questo punto in quanto la tecnologia non è solo software, ma anche hardware, limitato. Tuttavia, se usati come miglioramenti progressivi, aprono alcune interessanti possibilità, specialmente nell'area del gaming e della progettazione sperimentale dell'interfaccia utente.

5) SFSafariViewController

A prima vista, SFSafariViewController sembra essere più interessante per i progettisti di app che per i web designer. Consentirà alle app di visualizzare il contenuto Web all'interno di un'app utilizzando il rendering di Safari.

Progettato per semplificare gli scenari come l'apertura di un'app nativa, quindi la creazione di un account sulla pagina Web di un'azienda, prima di tornare a un'app per accedere con l'account, la cosa significativa di SFSafariViewController è che consente al web, piuttosto che al nativo, di essere il chiave di volta dei sistemi online di un'azienda. È un piccolo pezzo di software che segna un passo molto grande verso una più stretta integrazione di nativo e web.

6) ECMAScript 6

JavaScript è un passo avanti verso il diventare il linguaggio OOP che dovrebbe essere davvero

Gli sviluppatori di JavaScript saranno lieti di apprendere che Safari 9 include il supporto completo per classi, proprietà calcolate, set deboli, oggetto numerico, valori letterali ottali e binari, oggetti simbolo e valori letterali modello. Questo supporto significa che JavaScript è un passo avanti verso il diventare il linguaggio OOP che dovrebbe essere ormai.

7) Filtri CSS

La proprietà CSS del filtro dello sfondo è stata aggiunta a Safari 9. Sono disponibili tutti i filtri sfocatura, luminosità, contrasto, ombreggiatura, scala di grigi, hue-rotate, invertito, opacità, saturo e seppia .

8) Aggiornamenti della modalità sviluppatore

La modalità di progettazione reattiva è stata introdotta in Safari 9 come modo per fornire una rapida commutazione di layout tra diversi viewport. Tutti i dispositivi Apple sono inclusi come preset, ma è più uno strumento di presentazione utile per le riunioni dei clienti che uno strumento di sviluppo poiché le best practice favoriscono il contenuto, al contrario di viewport, breakpoint. È importante notare che la modalità di progettazione reattiva altera solo il viewport, non simula dispositivi diversi. Può essere utile come test rapido ogni volta che vengono lanciati nuovi dispositivi Apple, prima che i simulatori dei dispositivi si mettano in pari.

Il web inspector è stato ridisegnato. Insieme ad alcuni ritocchi dell'interfaccia utente per migliorare la UX, c'è una maggiore enfasi sul rendering e sulle prestazioni del frame.

9) CSS prefisso

Alcuni aggiornamenti sono più graditi di altri. Uno dei più graditi, ma con meno probabilità di essere notato, è la caduta dei prefissi del browser per oltre 45 proprietà CSS. Sebbene faccia poco a breve termine con i browser legacy ancora in uso, prima i browser rilasciano i prefissi, prima ci salutiamo per sempre.

Le più significative da escludere senza prefisso sono le proprietà flex , le proprietà di transizione , le proprietà di trasformazione e le proprietà di animazione .