Come abilitare le funzionalità di Pinned Site e le Jump List di Internet Explorer 9 su WordPress

Questo post nasce perchè in Microsoft mi occuppo di tecnologie per il web e nell’ultimo periodo sto seguento lo novità di Internet Explorer 9. Inoltre sono stato al WordCamp lo scorso anno, e mi sono chiesto… chissà se esiste qualche plugin per WordPress che frutti le funzionalità di Pinning di IE9. Ebbene, nel repository di WordPress ho trovato qualche plugin che implementa queste funzionalità, ne ho voluto provare uno. Quest’articolo vuole essere il modo condividere con la community alcune delle novità di IE9.

A cosa serve e come funzionano i Pinned Site e le Jump List di IE 9

Internet Explorer 9 consente di aggiungere siti alla taskbar di Windows 7 e di utilizzarli come se fossero applicazioni desktop. In particolare queste funzionalità consento non solo di aprire velocemente un sito come se fosse un semplice link, ma di aggiungere alla taskbar di Windows 7 funzionalità specifiche note come Jump List. Le Jump List possono essere definte sia staticamente, tramite dei tag meta aggiunti all’ HTML della pagina, sia dinamicamente utilizzando delle API in JavaScript che possono modificare il contenuto delle voci delle Jump List in base al contesto della pagina.

Per avere un Pinned Site basta trascinare l’icona in alto a sinistra o la tab del browser del sito sulla barra di Windows 7, come vedete nella figura seguente:

Trovate tutti i dettagli di come fare il pinning di un sito  a questo link.

Una volta agganciata alla taskbar di Windows 7, se col mouse fate tasto destro vedete la lista dei task, cioè una Jump List con contenuti statici, che sono stati scelti inzialmente da chi ha fatto la pagina, come in figura:

Come dicevo se l’applicazione lo prevede possono apparire anche elementi dinamici in una categoria scelta dallo sviluppatore. Se andate a questo link potete provare questa pagina su un sito di test, ogni volta che fate una ricerca viene aggiunta alla categoria Searches una voce, nell’esempio ho cercato prima pietrobr e poi wordpress.

Ci sono altri usi dei Pinned Site di IE9 che consento di avere delle notifiche in overlay sull’icona della taskbar, oppure è possibile aggiungere dei bottoni con cui, ad esempio poter controllare l’andamento di un video in un player.

Inoltre ci sono delle API che possono essere usate per rilevare se il browser supporta il pinning e per aggiungere il sito alla cartella programmi di Windows. Queste API possono essere utili ad esempio per promuovere che il nostro sito supporta il Pinning agli utenti che utilizzano Internet Explorer 9 e Windows 7. Se un utente naviga nel sito con un qualsiasi altro browser semplicemente le funzioni del pinning non saranno disponibili. Maggiori informazioni su come notificare ad un utente che il proprio sito supporti il pinning le trovate nella documentazione relativa: Prompting Users to Pin your Site.

E’ possibile inoltre avere icone ad alta risoluzione che vengono visualizzate quando l’utente effettua l’operazione di drag & drop del tab del sito per agganciarlo alla barra di Windows. Maggiori informazioni: Customizing the Site Icon.

Come utilizzare uno dei plugin disponibili per WordPress per i Pinned Site di IE9

Ricercando nel repository dei plugin per WordPress ho trovato alcuni plugin  per IE9,  ho scelto questo , il primo della lista, realizzato da un MVP, e ho deciso di provarlo, al momento non mi sembra ne esista una versione localizzata in Italiano, ma non ho avuto particolari problemi. Come al solito scaricate il plugin nel folder wp-content\plugins, quindi loggatevi a WordPress, nel menu Plugins, dovreste vedere il plugin “IE9 Pinned Site” come in figura e quindi attivarlo:

A questo punto andate nel menù delle impostazioni (Settings) e nel mio caso vedo una nuova voce di menù: “IE9 Pinned Site”, nella pagina per la configurazione vedete un pannello che ha una serie di configurazioni, che sono quelle che vedete nella figura seguente:

Il significato preciso dei parametri Application Name, tooltip, Startup URL, Windows Size, Navigation Button Color è definito in questo documento sul sito MSDN e si rifà ai tag meta aggiunti nell’ HTML della pagina ed interpretati da IE9. Infatti in generale per aggiungere queste funzionalità ad una qualsiasi applicazione HTML dovreste aggiungere dei tag meta all’ HTML, il plugin in questione che sto provando si occupa proprio di questo: di aggiungere il codice necessario in base a come è fatto il vostro sito con WordPress, senza dover scrivere voi il codice a mano.

Il parametro Enable Jump List, vi permette di definire una vostra caterogia, io ne ho definito una con il nome “La mia Jump List”.  Se ora cercate di fare il drag and drop della tab della pagina del sito, vedrete il risultato nella taskbar di Windows 7.

Nella lista dei Tasks vedete tre task a cui corrispondono il link diretto alla Home, oppure la possibilità di andare alla pagina di scrittura di un post o di moderare i commenti. In cima vedete la categoria che ho definito e un elemento in essa.

La configurazione degli elementi nei Task e nella categoria è veramente semplice e si applica sfruttando gli altri pannelli della pagina di configurazione. Nella figura seguente vedete che potete scegliere tra pagine esistenti, categorie di WordPress, etc.

IE9 le performance e gli standard

Le funzionalità di Pinning dei siti e la possibilità di gestire le Jump List anche tramite plugin già realizzati dalla community sono funzionalità che possono rendere più comoda la vita ai “naviganti” che arrivano sul nostro sito.

Tra le caratteristiche che semplicemente vi accenno di Internet Explorer 9 ci sono le performance e gli standard.

Per quanto riguarda le performance, IE9 utilizza la GPU, il motore delle schede grafiche, per accelerare in hardware le funzionalità dell’ HTML5. Inoltre è stato riscritto il motore del JavaScript, che ora è in grado di compilare il codice della pagina in parallelo alla sua esecuzione e di renderla più veloce ad una seconda esecuzione. Qui potete vedere un video con delle demo sulle performance relativo alla vesione Release Candidate (RC) di IE9.

Il supporto agli standard è una delle priorità di IE9, in particolare l’insieme degli standard che comunenemente va sotto l’unico cappello di HTML 5, e poi il supporto ai CSS 3 e al più recente ECMAScript 5. In particolare mi preme fare una precisazione: in IE9 sono state implementate solo le specifiche dell’ HTML 5 stabili, cioè per le quali non sono previste modifiche. Esistono anche specifiche che sono in corso di stesura e che quindi possono essere soggette a modifiche. Per queste,che non sono però state inserite nelle versioni stabili di IE9,  gli sviluppatori le possono testate utilizzando delle estensioni che potete trovare negli HTML5 labs. Qui gli sviluppatori possono provare le attuali implementazioni via via che queste raggiungeranno un maggior grado di maturità.

Conclusione

Le funzionalità di Pinning di un sito e le Jump List possono rendere più comoda la vita di un visitatore ai nostri siti che usa Internet Explorer 9, fortunatamente esistono dei plugin per WordPress che ne consentono un facile utilizzo, senza scrivere codice, quindi … perchè non usarle.

Link tecnici utili per approfondire

• Introduction to Pinned Sites
• Internet Explorer 9: sviluppare Pinning, JumpList e integrazione con Windows 7(Video in Italiano)

Spero di aver condiviso con voi qualche utile informazione e novità.

Ciao  – Pietro Brambati