2011-12-30 8 views
6

Progettazione di un'applicazione Web con ASP.NET MVC Mi sono chiesto come posso soddisfare anche le persone che usano uno smartphone, un ipad, ecc. (Tutto ciò che è intoccabile ...) e non solo un desktop/notebook con un browser.Che cosa rende un'applicazione web un'applicazione touch pad amichevole?

Come sviluppare un'esperienza utente migliore.

Sarei lieto di conoscere i consigli tecnici relativi al framework asp.net mvc in modo da poter implementare concretamente i vostri suggerimenti.

+0

Se stai sviluppando per un'interfaccia touch come iPhone/iPad/Android, assicurati di non includere alcun codice che ti faccia HOVER su qualcosa per vederlo/interagire con esso. Questi dispositivi non hanno il concetto di hover. Se si esegue questa operazione, fornire almeno una soluzione alternativa. – Dismissile

+0

Questa domanda potrebbe ottenere risposte migliori in [Scambio stack esperienza utente] (http://ux.stackexchange.com/). –

+0

@djacobson Lo farò anche dopo. – Elisabeth

risposta

0

Attraversa il mio tutorial ASP.NET MVC 4 Mobile Features

  • creare viste specifiche per i cellulari.

-utilizzare l'attributo della vista HTML5 e il rendering adattivo per migliorare la visualizzazione sui dispositivi mobili.

+0

un MSFT ottimo: P – Elisabeth

4

Ci sono alcuni livelli di cortesia. Puoi iniziare con la base "questo sito funziona abbastanza bene da essere utilizzabile in un browser mobile?" Questo in realtà non dovrebbe essere un problema per qualcosa di nuovo che utilizza standard web moderni, ma i siti più vecchi potrebbero avere problemi. Corallario a questo è "è il mio sito un maiale banda che impiega un'eternità a renderizzare oltre 3g perché ogni pagina è 14mb di GIF animate e spaghetti HTML?" O "il mio sito fa sciogliere i dispositivi mobili a causa di script aggressivi?" Fortunatamente questo set è abbastanza facile da gestire - i siti Web moderni tendono a gestire questo piuttosto bene di default.

Il secondo livello è "questo sito fa tutto ciò che fa impazzire da una prospettiva tattile". La cosa più importante che puoi ritagliare qui è il menu al passaggio del mouse - c'è il no al passaggio del mouse su un'interfaccia utente touch. L'altro problema comune è l'uso di piccoli collegamenti o pulsanti che non si possono colpire almeno senza aumentare i livelli di follia. La soluzione qui è test - alcuni problemi sono ovvi a tutti ma non vedrai alcune cose finché non interagirai senza un mouse.

Il livello finale utilizza un'interfaccia utente touch per divertimento e profitto. Se lo fai fino a questo punto, stai facendo meglio di molti editori web in questo giorno ed età. Ciò che è coinvolto qui è l'utilizzo di strumenti di interfaccia utente touch-friendly, come jquery mobile, per gestire eventi di scorrimento e altre funzionalità touch per far funzionare le cose più come ci si aspetta con un'interfaccia utente touch. Un semplice esempio potrebbe essere la creazione di un carosello di immagini in grado di scorrere anziché attendere i pulsanti.

1

Rende l'interfaccia più complessa: le icone grandi sono facili da fare clic, il testo è molto difficile da toccare con precisione. Imposta una dimensione minima per ogni elemento, almeno grande quanto i singoli tasti sulla tastiera virtuale di un iPhone/Android e preferibilmente molto più grande.

Assicurarsi che le opzioni più pertinenti siano vicine alla parte superiore e, successivamente, l'obiettivo è semplicemente renderlo intuitivo. Meno menu sono generalmente migliori.

Problemi correlati