Sviluppare siti e apps mobili: panoramica

Il settore della tecnologia mobile è quello a più rapida crescita negli ultimi anni e, di conseguenza, le attività professionali collegate.

Una di queste è sicuramente lo sviluppo per piattaforme mobili, sia che si tratti di semplici siti web o applicazioni web complesse.

Avrete sicuramente sentito nominare la parola “responsive” (identificato anche con la sigla RWD), termine che indica l’adattabilità ai diversi dispositivi e risoluzioni.

Grazie ai moderni linguaggi e tecnologie quali HTML5, Javascript e CSS è possibile realizzare siti e web app perfetti per il mobile.

Naturalmente lo sviluppo web per mobile è un argomento complesso che andrebbe trattato approfonditamente in molti articoli.
Con questo articolo si vuole fornire dei concetti generali senza entrare troppo nei tecnicismi.
Ecco quindi alcune “basi” per iniziare.

Affidarsi ad un framework pensato per lo sviluppo mobile aiuterà a rendere il lavoro più facile.
Essi mettono a disposizione componenti, plugins, widgets, temi ecc… già pronti per essere utilizzati senza dover partire da zero.
Tra i più famosi vanno citati sicuramente jQuery Mobile e Sencha Touch.
Essi sfruttano le moderne tecnologie elencate sopra mettendo a disposizione strumenti per sviluppare facilmente per il mobile.

L’utilizzo delle Media Queries CSS3 permette di sviluppare layout per risoluzioni diverse.

E’ possibile testare in locale su pc tramite appositi tools che simulano il comportamento mobile.

Volendo è possibile “convertire” i propri siti e web app mobili in applicazione native iOS, Android, Windows Phone ecc…
A tal proposito lo strumento più utilizzato è Phonegap.

E’ anche possibile monetizzare usando diversi modelli: pubblicità in-app, pay per download, freemium, notifiche, app a pagamento (vedi infografica)

Infine un elenco di utili risorse (in inglese) per lo sviluppo mobile:

The Essential HTML5 Mobile Cheat Sheet
10 handy HTML5 cheat sheets for geeks
Touch Gesture Reference Guide
iOS and Android Design Guidelines cheat sheet
How to promote an App?
Mobile Web @ W3C

Links utili per lo sviluppo web #4

L’articolo cerca di raccogliere i migliori links (guide e tutorials, suggerimenti e trucchi, risorse) legati allo sviluppo web nelle aree quali web design e codice vero e proprio con particolare attenzione alle moderne tecnologie e tecniche.
I topic ricoperti sono vari; dai CMS ai frameworks, dai templates alle varie librerie + plugins ecc…
Vediamo quindi i links di questo mese:

Review of cross browser testing tools una recensione di tanti strumenti e servizi per testare i siti web emulando vari browser

The expressive web utili strumenti da Adobe per lavorare con HTML5 e CSS3

Adobe Edge software per lavorare con HTML5, CSS3, Javascript

PressWork un framework WordPress in HTML5

Screenfly servizio per vedere i siti web a varie risoluzioni

SEO Cheat Sheet un bel cheat sheet con trucchi e consigli SEO

VideoSWS una comparazione di video player HTML5

Links utili per lo sviluppo web #3

L’articolo cerca di raccogliere i migliori links (guide e tutorials, suggerimenti e trucchi, risorse) legati allo sviluppo web nelle aree quali web design e codice vero e proprio con particolare attenzione alle moderne tecnologie e tecniche.
I topic ricoperti sono vari; dai CMS ai frameworks, dai templates alle varie librerie + plugins ecc…
Vediamo quindi i links di questo mese:

Book of speed una guida online per migliorare le performances del proprio sito web

planning and implementing website navigation showcase di varie tipologie di menù di navigazione

Useful resources, tools and services for web designers risorse, siti, librerie, plugins ecc… utili per lo sviluppo web

il Panda Update spiegato da Madri video utile riguardo il SEO che spiega cos’è il Panda Update di Google

Phonegap un framework opensource HTML5 per lo sviluppo di applicazioni mobili

CSS3 buttonize framework un framework che aiuta a creare bottoni CSS3

Mobilizer applicazione che permette di testare come vengono visualizzati i siti via mobile

Gridless un framework HTML5 e CSS3 per creare siti web

50+ free Mac apps for web designers and developers una bella lista di oltre 50 programmi per Mac utili ai web designer e sviluppatori

making a simple tweet to download system un bel tutorial che spiega come realizzare un sistema in cui occorre effettuare il tweet per sbloccare contenuto

Links utili per lo sviluppo web #2

L’articolo cerca di raccogliere i migliori links (guide e tutorials, suggerimenti e trucchi, risorse) legati allo sviluppo web nelle aree quali web design e codice vero e proprio con particolare attenzione alle moderne tecnologie e tecniche.
I topic ricoperti sono vari; dai CMS ai frameworks, dai templates alle varie librerie + plugins ecc…
Vediamo quindi i links di questo mese:

Initializr crea il tuo progetto HTML5 in pochi secondi

choose the best CSS framework a complete guide un articolo dove si recensiscono molti framework CSS corredato da immagini di esempio

mega collection of cheatsheets for designers and developers un utile collezione di cheatsheets (ovvero codici e funzioni) che si possono utilizzare, in particolari nell’articolo vengono illustrati quelli riguardanti CSS, HTML, Javascript, PHP, MySQL, colori/fonts/SEO, CMS, software, browser e sistemi operativi, linguaggi di programmazione, vari

CSS3 tutorials and samples vari esempi e tutorial illustrati riguardo CSS3

30 Creative Examples of Responsive Web Design esempi di siti web che si adattano perfettamente a seconda del mezzo utilizzato (computer, smartphone…)

The Anatomy of an Effective Web Design un’infografica che illustra come dovrebbe essere un web design efficace

optimizing error pages consigli su come creare delle pagine 404 attrattive

5 risorse utili per trovare snippets elenco di siti dove trovare porzioni di codici pronte all’uso

HTML EMail Boilerplate template per email in HTML

Perkins un framework HTML5/CSS3 per sviluppare velocemente siti web

Links utili per lo sviluppo web #1

L’articolo cerca di raccogliere i migliori links (guide e tutorials, suggerimenti e trucchi, risorse) legati allo sviluppo web nelle aree quali web design e codice vero e proprio con particolare attenzione alle moderne tecnologie e tecniche.
I topic ricoperti sono vari; dai CMS ai frameworks, dai templates alle varie librerie + plugins ecc…
Vediamo quindi i links di questo mese:

Dropbox Forms servizio che permette di creare form personalizzate con l’upload di files in una cartella del servizio di cloud storage Dropbox

HTML5 mobile ottimizzare una pagina per iPhone e iPad con CSS3 ottimo articolo con esempio scaricabile di HTML5 Today

The future of CSS: experimental CSS properties articolo di Smashing Magazine con interessanti proprietà CSS specifiche per browser, e generali CSS 2.1 e 3

HTML5 Boilerplate (un template di default HTML/CSS/JS da utilizzare come punto di partenza) + versione mobile + 320 and up (CSS media queries boilerplate)

G5 un framework HTML5 completo per creare siti/applicazioni in HTML5

custom radio and checkbox inputs interessante guida per personalizzare il design dei bottoni radio e checkbox in una form

CSS3 buttons soluzioni con bottoni creati in CSS3 completi di tutorials

Baker ebook framework un framwork/template per aiutare a creare ebooks in HTML5 adatti per iPhone e iPad

Advanced commenting systems for WordPress sistemi per la gestione dei commenti a confronto: Disqus, Intense Debate, Echo, coComment, Livefyre, Facebook Comment

6 best HTML5 video players recensione con elenco delle caratteristiche di 6 player video in HTML5

Ricevi gli aggiornamenti del blog

Vuoi rimanere aggiornato riguardo gli ultimi articoli pubblicati nel blog? Inserisci la tua email per sottoscriverti alla newsletter!