Perché non utilizziamo il rilevamento del browser e il CSS specifico della piattaforma?

Rendere i CSS specifici per ogni piattaforma è possibile, ma molto lavoro. Significa anche mantenere più file CSS. Inoltre, è meglio fare il rilevamento delle caratteristiche, invece del rilevamento del browser. Non sono un esperto in materia, ma puoi farlo su Google e otterrai risultati sufficienti.

Ma, dici, non è anche molto lavoro per costruire e mantenere più app per più piattaforme? Lo è, ma penso che un'altra ragione entri in gioco qui. E questo è che le app native sono ciò che molte persone si aspettano in questi giorni. Le app native hanno anche migliori / diverse funzionalità rispetto ai browser, probabilmente anche prestazioni migliori. Inoltre, le app native possono essere eseguite offline. E infine, le app native possono essere vendute in un app store, creando entrate.

Un sito web mobile probabilmente significa anche utilizzare il minimo comune denominatore. Pertanto, se una funzionalità è supportata dal browser mobile X, ma non dal browser mobile Y, non è possibile utilizzarlo o richiedere una soluzione alternativa. Quindi è probabilmente meglio avere app native e sfruttare appieno il potenziale della piattaforma, senza doversi preoccupare dell'altra piattaforma.

Quindi, in breve, i motivi possono essere

• i clienti se lo aspettano
• prestazioni e / o possibilità migliori
• la possibilità di vendere la tua app in un app store

Motivi per cui vengono sviluppate app native anziché HTML / CSS:

1. API più ricca. In genere, si ha più accesso all'hardware rispetto a un browser. Questo potrebbe significare qualsiasi cosa, dalle migliori prestazioni di scorrimento, alla migliore gestione di multitasking / memoria o all'accesso alla telecamera sul dispositivo.
2. È più probabile che l'utente inserisca l'applicazione basata sul Web nella schermata Home e la utilizzi. Sì, su iPhone è possibile salvare un sito Web HTML nella schermata iniziale, ma l'utente finale potrebbe non essere a conoscenza o a proprio agio con il processo.
3. Prestazioni. Questo in genere non è un problema, ma potrebbe riguardare giochi o grafica.
4. Possibilità di vendere l'app nel marketplace del dispositivo.
5. La rete non è necessariamente richiesta. A seconda di cosa fa il sito, la memorizzazione nella cache locale dei dati significa che le funzionalità di base non saranno influenzate se il dispositivo lascia cadere il segnale e non ha più la connettività Internet. (Questo svantaggio dell'HTML è migliorato con il supporto della cache dell'applicazione nei nuovi browser.)
6. Infine, scoperta e aspettative. Ad esempio, sono più propenso a cercare un'applicazione nativa per il mio iPhone piuttosto che navigare sul sito web della mia banca. Sfortunatamente, mi aspetto che il sito Web non sia ottimizzato e mi trovo di fronte a campi e pulsanti di immissione testo minuscoli. Potrebbe passare del tempo prima che gli utenti si aspettino che i siti web siano ottimizzati per i dispositivi di piccole dimensioni e controllare innanzitutto il browser per le applicazioni avanzate.

Si noti inoltre che con HTML5 e CSS, in genere non si desidera utilizzare il rilevamento del browser tramite User-Agent, si desidera rilevare il supporto del browser attraverso il DOM. Modernizr è una libreria javascript in grado di rilevare funzionalità del browser e larghezza dello schermo.

Generalmente quello che hai è un sito web per piattaforme che possono ospitare schermi di grandi dimensioni (PC, Mac, tablet, ecc.) e un altro sito web per piattaforme più piccole. C'è una ragione per questo.

La maggior parte delle aziende con cui ho lavorato tende ad avere una visione a breve termine e, in quanto tale, non specifica affatto o / e non prepara nulla per una versione "lite" del loro sito web. Solo quando il sito web completo è pronto e vivo su Internet iniziano a pensare alle versioni mobili ... Ora, questa mentalità sta cambiando lentamente ma sarà progressivamente nelle menti delle persone (solo sviluppatori, ma anche i manager) di pensa a tutte le piattaforme contemporaneamente prima di iniziare lo sviluppo di un sito web. Il fatto è che in genere è molto più difficile progettare in seguito se non fosse previsto.

C'è anche un'altra ragione "tecnica" per lo sviluppo di siti web separati. Il fatto è che, dal momento che non hai molto spazio sullo schermo, non devi solo utilizzare efficacemente i CSS per visualizzare le informazioni in modo user-friendly, ma potresti anche dover visualizzare "meno" informazioni, e solo la più importante (dal modo in cui la versione "mobile" di StackExchange è un perfetto esempio di come dovrebbero essere presentate le informazioni, sembra fantastico!). Puoi nascondere le informazioni secondarie con i CSS, ma un po 'di tempo sarà sprecato nel recuperare queste informazioni dal tuo livello di accesso ai dati, usando queste informazioni nelle tue pagine dinamiche ... e poi nascondendole con CSS perché non viene visualizzato su schermi più piccoli. Il tempo è denaro. Sappiamo tutti cosa succede quando un sito Web impiega troppo tempo per essere caricato, semplicemente non lo usiamo più.

Ora, possiamo essere tutti d'accordo sul fatto che è realizzabile solo con i CSS (e qualche rilevamento del browser lato client e server) ma devi sviluppare il tuo sito web mantenendo questo obiettivo nella tua mente sin dall'inizio. Spesso capirai ad esempio che il tuo sistema di navigazione con grandi menu e simili non funziona correttamente sui telefoni cellulari, che le tue foto occupano troppo spazio / dimensioni, che il tuo codice HTML è brutto, ecc. Questo è spesso il caso dei siti web esistenti già da tempo, ma non necessariamente. Ciò potrebbe anche essere dovuto al fatto che a volte è "più pulito" avere siti web / viste separati.

Questo è il motivo per cui spesso devi prendere una decisione tra l'hacking di CSS specifici per dispositivi mobili nel tuo sito web completo, oppure lo sviluppo rapido di una versione "lite" per schermi più piccoli.

Modifica: ho dimenticato di rispondere esplicitamente alla domanda. La mia risposta è che il rilevamento del browser (dimensione del client con JS AND lato server) e i CSS sono in effetti utilizzati per visualizzare diverse visualizzazioni del tuo sito web a seconda delle dimensioni degli screen reader.

Infine: controlla questo articolo , contiene esempi dei diversi approcci che è possibile adottare per creare una versione mobile di un sito Web.

La nuova / in-vogue cosa da fare per quanto riguarda il rilevamento del browser consiste nell'utilizzare i "modernizzatori" in javascript per degradare con garbo di fronte ai browser che sono meno ricchi di funzionalità di altri. In questo senso, personalmente preferirei che i siti Web usino un layout che sia valido sia sui normali browser sia sui dispositivi mobili, disponendo i blocchi in modo tale che scorrano bene su schermi di qualsiasi risoluzione.

Si può sognare, suppongo ...

alcuni lo fanno già. è una questione di ciò che si sta prendendo su di te per farlo. puoi usare polyfill (aka modernizzatori) per correggere altri browser e puoi servire css specifici per browser / piattaforma. lo sviluppo nativo avrà sempre i suoi vantaggi, ma html5 sta guadagnando terreno nell'arena e imo sarà quasi uguale a nativo abbastanza presto. puoi servire un sacco di stili diversi tramite le query multimediali. tutti gli strumenti sono là fuori, è davvero una questione di renderlo tua prerogativa.

Non l'ho capito da solo prima di avere il mio telefono Android, ma l'esperienza utente è molto diversa tra un'app mobile e un sito mobile.

Come utente preferisco quasi sempre l'utilizzo di un'app nativa a un sito mobile (a meno che l'app mobile non venga eseguita correttamente).

Un sito va bene per la semplice visualizzazione delle informazioni, ma se si tratta di un'app Web, è molto più naturale utilizzare un'app nativa che sfrutta l'interfaccia tattile rispetto a un'app Web mobile.