Redazione
a- a+

Creare siti web mobile con HTML5

Vediamo 3 framework open source per programmare ed ottimizzare siti web mobile con HTML5.

Il mobile web, ovvero la programmazione e ottimizzazione dei siti web per permetterne la migliore visualizzazione su cellulari, smartphone, iPhone e iPad , può a volte sembrare un argomento difficile e ostico. In questo articolo si vogliono presentare tre framework open source che facilitano il lavoro dello sviluppatore web-mobile: DHTMLX Touch, Progetto M e Framework  52. Analizziamo e mostriamo in profondità ma in maniera comprensibile ed efficace le caratteristiche dei tre ambienti.

Il  DHTMLX Touch è una libreria free basata su HTML5 JavaScript, progettata specificamente per la creazione di applicazioni web mobile che funzionano su diverse piattaforme. Il DHTMLX è un framework  progettato per essere basato su HTML5 con una serie completa di funzioni widget, per offrire una completa interfaccia utente che permette la creazione e l’implementazione di svariati servizi:

  • widget Form
  • widget Grid
  • Video
  • Menu
  • Google Maps
  • List Group
  • Popup
  • Confirm

Di solito i vari framework JavaScript e/o HTML non sono dotati di uno strumento WYSIWYG che  è possibile utilizzare insieme al framework per creare le applicazioni. Ma si basano su istruzioni a linee di comando da implementare fornendo degli esempi, oppure utilizzando parti di codice che verranno poi modificate in base alle proprie esigenze. Questo non è il caso di DHTMLX Touch, infatti il framework è dotato di un ambiente di Designer visivo con il quale è possibile creare le varie applicazioni con un semplice drag-and-drop dei componenti in un layout che ricrea il dispositivo mobile e poi impostare le proprietà di ciascun controllo attraverso la stessa interfaccia visuale. Attenzione: non aspettatevi un Dreamweaver o un’interfaccia simile a questa, ad ogni modo sicuramente è molto più facile lavorare con il WYSIWYG di DHTMLX Touch che scrivere codice senza alcun ambiente visuale.

Il Layout, sia quello orizzontale che quello verticale sono entrambi supportati per schermi iPhone e iPad, così come schermi di dimensioni personalizzata. Una volta finito di creare un’app utilizzando l’interfaccia di progettazione utente touch, è possibile salvarla sul computer in modo da potere poi uploadarla al server web, modificarla, testarla e altro. Le applicazioni create con DHTMLX Touch sono compatibili per iPhone iPad, Android e browser standard  basati su WebKit, come Chrome, Safari e Firefox 3.6 e versioni successive.

Da tenere a mente che DHTMLX Touch, a differenza di altri prodotti DHTMLX, è completamente gratuito sia per lo sviluppo di applicazioni senza scopo di lucro che commerciali. Si può usare in proprie applicazioni commerciali senza pagare un centesimo.

Il Progetto M è un altro framework open source HTML5 e JavaScript  Multi-Platform, Mobile o MVC, che permette agli sviluppatori di creare applicazioni cross-platform mobile. A differenza di DHTMLX Touch, il progetto M è dotato di Expresso, un tool di creazione che si basa su Node.JS. L’Installazione di Node.JS non è semplice, infatti non è un semplice processo one-click, ma dato che Microsoft sta lavorando per creare una versione per Windows di Node.JS, non ci sarà più l’obbligo di installarlo sotto Cygwin, un ambiente virtuale di tipo  Linux-like,  per potere eseguire le applicazioni Linux su un sistema operativo Windows. Ma finché Microsoft non completerà il trasferimento della piattaforma, si dovrà lavorare attraverso la documentazione e lavorare in ambiente linux-like.

Il Framework  52 è un framework HTML5, CSS3 e JavaScript che è stato creato dal network Enavu. Si tratta di una full-optional collection che consente agli sviluppatori di creare applicazioni web che includono video HTML5, ombre, angoli arrotondati, possibilità di utilizzare selettori CSS3, l’elemento HTML5 canvas e storage locale e il form validation di HTML5.

Come gli altri framework visti finora, anche il Framework 52 è fornito come file zip che contiene una struttura di directory che rende facile trovare gli esempi specifici e il codice di esempio. Si può vedere la demo completa e testare le caratteristiche del framework.  Anche il Framework 52 è open source.