Integrare documenti sfogliabili in PDF nel sito, accessibili da dispositivi mobile smartphone e tablet

L’inserimento di contenuti documentali nel sito web sta cambiando nel tempo, soprattutto con l’arrivo dei dispositivi mobili, quali smartphone e tablet. Nonostante l’utilizzo preponderante di contenuti in html nella realizzazione di siti web, ancora oggi moltissima documentazione di supporto è realizzata in PDF, tuttavia l’inserimento di questi documenti nel sito web comporta una scelta su come rendere disponibile facilmente il contenuto agli utenti, anche in mobilità!

Molte aziende che comunicano con i tradizionali mezzi offline producono spesso una grande quantità di materiale destinato alla stampa: cataloghi di prodotto, brochure, manuali di istruzioni, riviste, magazine aziendali, volantini…

In molti casi può essere utile diffondere questi contenuti anche sul proprio sito internet, sia per promuovere i propri prodotti e servizi, sia perché hanno una reale utilità per gli utenti, che li cercano attivamente (pensate ad esempio ai manuali delle istruzioni)

L’obiettivo è quindi rendere le pubblicazioni disponibili online curando l’accessibilità e l’usabilità di chi naviga da PC, ma con un occhio di riguardo soprattutto per gli utenti che utilizzano i dispositivi mobile, una percentuale in costante crescita e che, secondo molte statistiche, nel prossimo futuro saranno la maggioranza (potete leggere su questo stesso blog un esaustivo articolo sui numeri del mobile.

L’approccio più corretto per assicurare la perfetta accessibilità da browser consiste nell’inserire tutti i contenuti sul sito in formato HTML (testi, immagini, illustrazioni, tabelle…) e magari prevedere anche uno specifico layout per gli utenti mobile. Ma questo significherebbe anche rivedere completamente l’impaginazione delle pubblicazioni, con un notevole costo in tempo e denaro, una scelta quindi antieconomica e non sempre praticabile.

Se volessimo invece pubblicare il materiale così com’è, riducendo al minimo ulteriori lavorazioni, quali sistemi potremmo adottare?

Il metodo più semplice consiste nell’inserire all’interno delle vostre pagine web un link al file in formato pdf o word, tecnica tuttora ampiamente utilizzata (anche da molti big brand) per rendere disponibile il materiale cartaceo.

Ci sono ovviamente pro e contro: mettere a disposizione il file originale significa dare la possibilità all’utente di scaricare il file e salvarlo sul proprio computer per future consultazioni. D’altro canto, pensate ad un utente che vuole dare una veloce occhiata ad un catalogo di moda: il file sarà probabilmente ricco di foto e quindi sicuramente molto pesante. Anche per una consultazione veloce sarà necessario scaricare completamente il documento in PDF, operazione che potrebbe richiedere molti minuti. L’utente dovrà inoltre necessariamente disporre sul proprio computer del software necessario per aprire il file, non solo il giusto programma (Acrobat Reader, Word…) ma anche la corretta versione. E al termine della consultazione il file rimarrà fisicamente sul PC e dovrà essere eliminato manualmente se non si desidera archiviarlo.

Se tutto ciò può apparire complesso, ma fattibile, su un pc, provate a pensare questo processo su uno smartphone o su un tablet: scaricare molti megabyte di dati sotto rete 3G, magari mentre si aspetta la metropolitana, senza essere sicuri di disporre dell’applicazione adatta per l’apertura… É evidente che ci sono alte probabilità che l’utente abbandoni l’operazione. Peccato! Una persona in meno che ha consultato il vostro catalogo.

Per evitare il download e dare al lettore la sensazione di sfogliare con le proprie mani il catalogo cartaceo sono disponibili da tempo varie soluzioni per la creazione di flipbook. Si tratta di elementi interattivi inseriti nel sito web, molto spesso realizzati con tecnologia Flash, che rendono immediatamente disponibile il contenuto con un’animazione grafica che permette di “sfogliare” le pagine. Spesso includono anche ulteriori comandi per la consultazione: frecce per spostarsi avanti e indietro, numeri di pagina, indice, miniature, ecc… Belli da vedere e comodi da usare, sono attualmente molto diffusi su tantissimi siti.

Come si creano PDF sfogliabili integrabili nel sito web

Principalmente ci sono due tecniche: attraverso appositi software da acquistare e che trasformano il vostro file pdf in un file Flash, che va poi caricato sul vostro server e inserito dal webmaster all’interno del sito, un’operazione riservata a chi conosce bene l’HTML. In alternativa esistono dei servizi web che semplificano moltissimo l’operazione, ad esempio servizi come quelli offerti da Issuu, Youblisher e altri. Dopo aver creato un account (gratuito o a pagamento) è possibile caricare il file pdf sulla piattaforma, che provvede a convertirlo in un flipbook Flash ospitato direttamente sui server della piattaforma. Per inserirlo sul vostro sito sarà sufficiente copiare e incollare un pezzo di codice che vi sarà fornito, operazione davvero semplice se il vostro sito è fatto per esempio con WordPress o altri CMS.

Bene: semplice, veloce, gratuito… Perfetto no? Eppure c’è un problema davvero insormontabile: i flipbook Flash non sono visualizzabili da iPhone e iPad. Gli utilizzatori di questi diffusissimi device si troveranno davanti a una pagina vuota e non saranno in grado di vedere i vostri cataloghi.

La soluzione perfetta: documenti PDF sfogliabili in HTML5

Per risolvere questo problema è nato da poco un nuovo servizio online che utilizza una tecnologia differente e compatibile con tutti i principali device mobile, compresi iPhone e iPad.

Si chiama Mokazine e utilizza il nuovo standard HTML5 al quale presto o tardi tutti i siti web dovranno adeguarsi. Con Mokazine potrete creare un catalogo sfogliabile a partire da un pdf, in pochi e semplici passaggi.

Il risultato è davvero interessante e potete vedere qua sotto un esempio di cosa si riesce ad ottenere in pochi passaggi

Il sistema permette di generare in pochi click un codice snippet per inserire il documento PDF nel vostro sito.

Inoltre è possibile decidere se personalizzare il documento con un logo (nella versione premium a pagamento, il logo può essere quello aziendale), inserire i link social per la condivione, le anteprime del documento, etc. Molto interessante è la generazione automatica del QR CODE che permette di creare un codice QR da inserire nelle documentazioni off line per creare automaticamente un link che rimanda ai contenuti digitali online

I vantaggi di un flipbook realizzato in HTML5

Prima di tutto non si tratta di un formato proprietario come Flash, l’HTML5 è un linguaggio standard, supportato ampiamente da tutti i dispositivi ed utilizzabile da tutti. Inoltre è il formato ideale (e lo sarà sempre di più in futuro) per diffondere i contenuti anche sulle piattaforme mobile, garantendo ampia compatibilità su tutti i browser, senza rinunciare ad interattività, comandi touch e animazioni.

In conclusione, se il vostro sito pubblica contenuti in formato pdf, oppure utilizzate flipbook in Flash, iniziate a pensare seriamente agli utenti che accedono al vostro sito utilizzando uno smartphone o un tablet. Per rendere visibili a tutti i vostri contenuti è necessario utilizzare tecnologie ampiamente compatibili con i device mobile, e l’HTML5 si candida come la migliore tra tutte quelle disponibili. Se non userete gli strumenti adatti, il rischio è quello di non riuscire a mostrare le vostre pubblicazioni ai sempre più numerosi utenti che accedono al vostro sito in mobilità.