SharePoint 2013 e dispositivi mobili: gli approcci possibili

Posted on September 30, 2013

0


Il post è il primo di una serie:

SharePoint 2013 e dispositivi mobili: gli approcci possibili

SharePoint 2013 e dispositivi mobili: scegliere la soluzione migliore

SharePoint 2013 e dispositivi mobili: testare un sito per Mobile

Premessa

Una delle decantate novità di SharePoint 2013 è l’esteso supporto per dispositivi mobili (tablet, smartphone, ….), ovvero per tutti quei dispositivi che sono caratterizzati da almeno uno dei seguenti aspetti:

  • touch screen
  • risoluzioni monitor di ridotte dimensioni
  • browser di tipo mobile

In sintesi abbiamo a disposizione 5 approcci:

  1. Device Channels
  2. Layout responsivo
  3. Visualizzazione Mobile
  4. Visualizzazione PC o Full Screen
  5. Apps

Device Channels

I Device Channels fanno parte dell’infrastruttura Publishing di SharePoint e consentono di definire modelli di pagine che presentano contenuti diversi per i differenti dispositivi. Per “contenuto diverso” si intende: contenuto che per esempio non viene visualizzato su smartphone, oppure un diverso plug in per lo slideshow di immagini per i tablet, oppure un diverso formato di un video per gli iPhone.

Attenzione! Le pagine non sono duplicate per quanti device si intende supportare. Semplicemente nei modelli di pagina sono previsti dei Device Panels che includono contenuti che variano e che sono specifici per i differenti device; i singoli Panels fanno riferimento ad un Channel a cui eventualmente può essere associata anche una master page specifica.

IC598883

Fonte immagine: MSDN (http://msdn.microsoft.com/en-us/library/jj191506.aspx)

E’ possibile, in linea teorica, definire Channels per ogni singolo device (Windows Phone 7.0, Windows Phone 8.0, ….) perché nella definizione dei canali occorre specificare la User Agent string con cui si presentano i device. Ovviamente vi sarà un Channel “asso piglia tutto” per quei device non coperti dai Channels definiti.

Per maggiore informazioni sui Device Channels: http://msdn.microsoft.com/en-us/library/jj862343.aspx

Layout Responsivo

Alternativamente è possibile implementare un Layout Responsivo. Quindi armati di HTML e CSS (e a volte di qualche riga di JS) si costruiscono master page e page layout con contenuti in grado di “riadattarsi” a seconda del tipo di risoluzione. Si definiscono pertanto dei breakpoint, ovvero dei punti (altezza e/o larghezza del monitor) al raggiungimento dei quali il layout “riadatta” i propri contenuti. Il “riadattamento”, per esempio verso device con minore risoluzione, comporta l’eliminazione di contenuti secondari (per esempio di una news nascondiamo l’abstract e lasciamo solo il Titolo) o la trasformazione della funzionalità (per esempio il menu di navigazione orizzontale diventa una drop-down).

8231_SHAREPOINT%20IMAGE%2002_png-550x0

Fonte immagine: SharePoint Blog (http://blogs.office.com/b/sharepoint/archive/2013/02/25/create-your-online-brand-with-sharepoint-2013-and-the-web-technologies-you-already-know.aspx)

Buoni punti di partenza per approfondire cosa significa implementare layout responsivi in SharePoint 2013: http://erikswenson.blogspot.it/2013/06/responsive-design-for-sharepoint-2013.html e http://responsivesharepoint.codeplex.com/

Visualizzazione Mobile

SharePoint 2013 offre nativamente una visualizzazione ottimizzata per i dispositivi Mobile. Per averla a disposizione è necessario attivare la feature disponibile a livello di web e che si chiama Mobile Browser View.

image

Una volta attivata, chi accede con un Browser Mobile naviga il sito con un’interfaccia minimale. A seconda del tipo di Browser, SharePoint mostrerà il sito in Classic View o in Contemporary View.

La Contemporary View è molto più accattivante e basata su HTML 5, pertanto disponibile solo con Internet Explorer 9 e successivi (in Windows Phone 7.5 e superiori), con Safari 4.0 e successivi (in iOS 5.0 e superiori), con browser Android (in Android 4.0 e superiori).

Con Browser di versioni antecedenti, SharePoint propone la Classic View.

SP2013-Mobile-Views

Fonte immagine: Office Site (http://office.microsoft.com/en-001/sharepoint-server-help/configure-a-sharepoint-site-for-mobile-devices-HA102895211.aspx)

In entrambi i casi l’interfaccia del portale è costituita da:

  • Header: riporta la posizione corrente e consente di spostarsi tra le voci della navigazione globale e corrente
  • Contenuti: mostra i contenuti della pagina / lista in cui ci si trova

image

Vi è pieno supporto per le Office Web App, quindi è possibili editare i documenti direttamente dal tablet o dallo smartphone:

image

Se in pagina sono presenti funzionalità o contenuti non supportati apparirà un messaggio che lo indica.

image

Per maggiori informazioni: http://office.microsoft.com/en-001/sharepoint-server-help/configure-a-sharepoint-site-for-mobile-devices-HA102895211.aspx

Visualizzazione PC o Full Screen

Un approccio possibile è quello di fornire agli utenti di smartphone e tablet lo stesso layout previsto per i PC: quello che si vede nel monitor del PC, si vedrà anche nel monitor dello smartphone solo molto, ma molto più piccolo. In genere occorre zoomare per potere interagire o leggere i contenuti e ovviamente lo zoom consente di avere a monitor solo piccole porzioni della pagina.

Per avere la Visualizzazione PC è sufficiente non attivare la feature Mobile Browser View nei Web interessati.

nothing-vs-responsive

Apps

E’ possibile accedere al sito SharePoint 2013, o a parti di esso, mediante Apps che consentono di  fruirne il contenuto, solitamente con una esperienza diversa da quella che l’utente ha direttamente nel sito web.

Vi sono poi App di terze parti che consentono di avere accesso ai contenuti di SharePoint da smartphone e tablet, senza necessariamente utilizzare il browser. Sono particolarmente utili in caso di necessità di avere i contenuti “off-line”  e disponibili sul device in uso: ve ne sono sia a pagamento che gratuite (basta fare una veloce ricerca in Google Sorriso).

Infine la stessa Microsoft ha realizzato una App per visualizzare da smartphone il Newsfeed (per maggiori informazioni http://blogs.office.com/b/office365tech/archive/2013/07/18/sharepoint-newsfeed-app-now-available-in-the-windows-store.aspx)

3463_sharepoint%20app%20on%20windows_png-550x0

Fonte immagine: Office Blogs (http://blogs.office.com/b/sharepoint/archive/2013/03/06/out-and-about-new-sharepoint-mobile-offerings.aspx)

Advertisements
Posted in: SharePoint