Visite privilegiate sul design reattivo: il dibattito continua
Non da quando Coca Cola contro Pepsi ci sono stati un dibattito così ampio e intense polemiche su un argomento singolare. I blog di tecnologia e design su tutto il Web sono impegnati in accesi dibattiti sul design reattivo rispetto ai siti mobili, discutendo su quale soluzione sia in grado di offrire l'esperienza mobile.
Non possiamo essere tutti d'accordo? No, non in questa vita, specialmente per un argomento molto dibattuto come questo. Con l'enorme numero di sviluppatori e progettisti web che assistono i clienti oggi e l'enorme diffusione dei dispositivi mobili che ha focalizzato l'attenzione sul problema, sarebbe quasi impossibile per tutti essere d'accordo.
Vuoi essere una mosca sul muro per sapere cosa pensano le aziende professionali del design reattivo e di come stanno servendo i loro clienti?
Ho intervistato quattro importanti organizzazioni che creano esperienze mobili per i loro clienti su base giornaliera. Di seguito, troverai le informazioni privilegiate sui loro processi di sviluppo mobile
Due posizioni opposte
Sebbene esistano molti punti di vista diversi, sembrano esserci due opinioni predominanti che circondano il web.
Nell'angolo blu ...
Gli appassionati di design reattivo presentano molti vantaggi come prova sufficiente che questa tecnologia dovrebbe essere applicata a tutti o alla maggior parte dei siti mobili.
Secondo i sostenitori del design reattivo:
- Gli utenti desiderano un'esperienza completa del sito Web indipendentemente dal loro dispositivo, non una versione ridotta di ciò che i webmaster pensano che gli utenti vorranno visualizzare. L'usabilità si concentra sul rendere il visitatore del sito web come se avesse il controllo e prendere le decisioni. Gli esperti sostengono che un sito mobile separato potrebbe frustrare l'utente finale.
- La progettazione reattiva è una scelta conveniente dal momento che esiste un solo sito da mantenere. Le aziende dovranno creare siti mobili separati per ciascun dispositivo, che a lungo andare si sommano con i contenuti e i requisiti di manutenzione.
- Con i siti reattivi, non ci sono costosi aggiornamenti futuri quando nuovi dispositivi mobili arrivano sul mercato.
- Molti esperti SEO ritengono che i siti web creati con un design reattivo siano più favorevoli ai motori di ricerca perché non passano il link juice ad altri domini come nel caso di siti web specifici per dispositivi mobili; alcuni SEO contestano questa teoria e citano l'aggiornamento skip redirect di Google come prova. Secondo Google, questo aggiornamento "utilizza l'URL di destinazione dello smartphone finale" nei risultati di ricerca mobile, ignorando i reindirizzamenti, consentendo un tempo di caricamento più rapido.
Secondo Michael Wyszomierski, che lavora per Google in Product Quality Operations, il design reattivo è il punto in cui si trova. Ecco il suo post su Google+:
Michael ha risposto alle critiche nei commenti affermando che in alcuni casi potrebbero essere necessari i siti per dispositivi mobili, ma nel complesso è un forte sostenitore del design reattivo e ritiene che molti siti potrebbero migliorare notevolmente la loro esperienza utente utilizzandolo.
Quindi se il design reattivo è così bello, alla moda e alla moda, perché c'è un'isteria di massa che circonda l'argomento? Ecco alcuni motivi…
Nell'angolo rosso ...
L'altro lato dell'argomento non è ostinatamente opposto al design reattivo, ma sentono che è appropriato solo in situazioni specifiche. Questo campo sottolinea che la decisione su come costruire un sito mobile separato rispetto al design reattivo dipende dalle esigenze dell'utente mobile.
Ecco alcuni degli argomenti contro il responsive design:
- Velocità: quando un utente mobile apre un sito con un design reattivo, tutti gli elementi del sito desktop vengono scaricati e ridimensionati per adattarsi allo schermo. Questo rende il sito lento da caricare poiché tutto il codice Javascript e HTML originale è ancora presente. (Quando i progettisti creano siti web specifici per dispositivi mobili, considerano il dispositivo quando progetta il sito e lo ottimizzano di conseguenza).
- Contenuto distinto - Il campo in favore di siti specifici per dispositivi mobili in genere sostiene che gli utenti di dispositivi mobili potrebbero aver bisogno di un altro livello di contenuto che non è presente su un sito Web desktop. Il design reattivo può adattarsi al dispositivo ma non sfrutta l'ottimizzazione dell'esperienza utente in relazione alle sue esigenze specifiche.
Abbiamo deciso di portare questo argomento in strada per vedere quanto le aziende redditizie soddisfino le esigenze di mobilità dei loro clienti. Ho parlato con quattro organizzazioni di alto livello e chiesto loro il loro approccio al design reattivo. Li ho scelti perché hanno successo nel fornire un lavoro eccellente ai loro clienti e la loro crescita è una testimonianza di questo fatto.
Ho posto a ciascuno le stesse domande per esaminare in che modo il loro approccio era diverso / simile sull'argomento.
Colin Proctor, Smashing Ideas
Il primo è Idee favolose , un'agenzia interattiva con sede a Seattle in attività dal 1996. L'art director Colin Proctor è stato così gentile da condividere le sue riflessioni sul design reattivo.
D: Con quale frequenza sviluppi siti Web mobili per i tuoi clienti?
A: Ne abbiamo fatti una manciata. Con molti dei nostri clienti, assistiamo a iniziative di web mobile che stanno decollando proprio ora. Le esperienze web mobili sono state un argomento importante di pianificazione e conversazione per l'anno scorso circa per la maggior parte dei nostri progetti. I siti mobili che abbiamo sviluppato sono stati responsive m.sites come companion o un singolo layout responsive. La maggior parte di questi ha avuto contenuti molto mirati. Disponiamo di un ampio portafoglio di esperienze mobili, sia per app native o ibride, applicazioni Web, ecc.
D: Utilizzi automaticamente il responsive design per tutti i client mobili? Spiega brevemente perché o perché no.
A: No, ma fa sempre parte della conversazione. Esploriamo il contesto del pubblico prima di prendere decisioni sulla tecnologia. Per essere trasparenti, i layout pienamente reattivi presentano ancora limitazioni tecniche che destano preoccupazione per le grandi aziende: pubblicità, immagini reattive e supporto all'integrazione di terze parti sono alcune delle preoccupazioni principali. Per i siti di brochure, utilizziamo quasi sempre un design reattivo perché la gerarchia dei contenuti per questi siti tende a degradarsi piacevolmente attraverso una moltitudine di punti di interruzione. Spesso, il contesto dell'utente per i siti di brochure è coerente su tutti i dispositivi.
Q: diresti di essere ...
a) A favore del design reattivo
b) Non favorevole al design reattivo
c) A favore del design reattivo e dei siti mobili separati
Spiega brevemente perché hai scelto la tua risposta ...
A: Penso che sia pericoloso usare il layout responsive come un catch all e che una strategia reattiva determinerà il modo in cui il tuo sistema di progettazione risponde al contesto dell'utente (che è la chiave). Il design / layout reattivo è un approccio molto scalabile, ma prende sempre in considerazione ciò che l'utente sta facendo? Non è così, perché è un sistema di molte soluzioni di design per dispositivi mobili.
Se stavo costruendo un sito di trasporto pubblico, dovrei considerare che un utente seduto alla propria scrivania sta probabilmente pianificando il proprio programma o le rotte, mentre un utente sul proprio telefono sta cercando di capire dove si trova il loro autobus / treno e sta cercando altro soluzioni immediate. Questi due contesti presentano comportamenti diversi, esigenze di opportunità, necessità di navigazione e contenuti da presentare in anticipo. Un set di modelli con stili e layout contestuali potrebbe non essere la soluzione: potrebbe essere necessario un set di funzionalità completamente diverso.
D: Qual è il tuo miglior consiglio per i web designer / sviluppatori che cercano di creare esperienze mobile con successo per i loro clienti?
A: Il design reattivo non è un punto di partenza. È una grande tecnologia che molti nella comunità web hanno dedicato molto tempo per elaborare i nodi che la trattengono da una presenza più globale. Penso che vedremo l'adozione di layout / design reattivi crescere nel corso degli anni.
Secondo me, la cosa migliore da uscire dall'esplosione del web mobile è una rottura dall'idea che la nostra tela è impostata, e che abbiamo solo bisogno di riempirla. Siamo costretti a superare le nostre vecchie ipotesi sull'esperienza utente, e sono responsabili dei nostri processi mentali più di quanto siamo stati nella storia recente. Come società, non siamo più un pubblico in cattività che guarda un rettangolo di un'area di visualizzazione media come 1024 × 768, quindi le regole vengono riscritte. Come industria, questo è il momento di sperimentare e crescere.
Evolve Creative Group
Il prossimo è Evolve Creative Group , una società di soluzioni web a servizio completo con sede a Akron, Ohio. Ho chiesto agli sviluppatori le stesse domande e qui ci sono le loro risposte:
D: Con quale frequenza sviluppi siti Web mobili per i tuoi clienti?
A: Sviluppiamo siti web mobili probabilmente circa il 30% delle volte. È una combinazione di desiderio, budget e necessità per i nostri clienti. Molti clienti non hanno la necessità o il desiderio di supportare i dispositivi mobili a causa del loro pubblico e del loro budget. A causa della flessibilità dei siti che creiamo (non mobili), funzionano abbastanza bene sui dispositivi mobili che i clienti non possono giustificare il costo. Può essere una vendita dura, ma mentre le tendenze mobili crescono e si solidificano, sempre più clienti stanno salendo a bordo.
D: Utilizzi automaticamente il responsive design per tutti i client mobili?
A: No, non lo usiamo per tutti i client mobili. Facciamo semplicemente ciò che è nel migliore interesse del cliente e dei suoi utenti. Valutiamo attentamente l'approccio mobile caso per caso in base alle loro esigenze.
Se gli utenti mobili del cliente hanno un sottoinsieme di interessi o un obiettivo specifico che richiede una modifica al layout o alla quantità di informazioni fornite, ti consigliamo un sito mobile separato su un sottodominio, che ci consente di semplificare il sito per il esperienza mobile. Ma il rovescio della medaglia, se il sito è già semplice e universale nella messaggistica e negli obiettivi (come blog, pagine di destinazione e piccoli siti informativi per esempio), quindi avere un singolo sito flessibile su tutte le piattaforme è sicuramente vantaggioso.
Q: diresti di essere ...
a) A favore del design reattivo
b) Non favorevole al design reattivo
c) A favore del design reattivo e dei siti mobili separati.
Spiega brevemente perché hai scelto la tua risposta ...
A: Come tutto in questo business, l'approccio mobile è un dare e avere, in quanto ci sono pro e contro di ogni metodo. Siti mobili separati offrono il vantaggio di focalizzare l'utente su contenuti specifici concisi e ottimizzati. Ma il lato negativo è che il client può avere il doppio del mantenimento per gli aggiornamenti futuri.
Questo è il punto in cui il responsive design interviene con l'argomento "un sito per dominarli tutti". Avere un unico sito universale, ricco di flessibilità e offrire all'intero sito la possibilità di interagire con gli utenti a loro piacimento è un'idea davvero entusiasmante. Mette il potere nelle mani dei clienti e degli utenti e risolve il problema di progettare e costruire siti Web per un dispositivo specifico (desktop o altro). Ma gli argomenti contro il responsive design come il tempo di download, i costi di sviluppo e l'overkill di informazioni, possono essere altrettanto convincenti.
La morale qui è quella di adattare la soluzione in base al progetto e agli utenti, e di non rimanere bloccati dal sempre crescente dibattito infuocato.
D: Qual è il tuo miglior consiglio per i web designer / sviluppatori che cercano di creare esperienze mobile con successo per i loro clienti?
A: Il più grande consiglio che possiamo offrire è quello di essere intelligenti nel scegliere il tuo approccio. Non limitarti a saltare sul carro della banda reattivo perché è la cosa nuova di zecca o bastone con siti mobili separati perché è sicuro e familiare. È necessario valutare attentamente i pro e i contro di ciascun approccio per il progetto specifico in questione.
Inoltre, basalo sull'utente finale della soluzione. Sono il tipo che ha un obiettivo specifico e nessuna attenzione? Vogliono entrare, uscire e andare avanti con la loro vita? O sono in un bar e vogliono provare la piena esperienza? La risposta a questa domanda probabilmente renderà la scelta corretta.
Ryan Anderson, Alchemy50
Successivamente, ho parlato con Ryan Anderson, presidente di Alchemy50 , un'agenzia digitale con sede a Brooklyn, NY. Ecco cosa ha detto Ryan sul processo della sua azienda:
D: Con quale frequenza sviluppi siti Web mobili per i tuoi clienti?
A: Raramente. Penso che i siti web specifici per dispositivi mobili stiano diventando un ricordo del passato. Ci sono così tante diverse dimensioni dello schermo, risoluzioni, ecc ... da considerare in questi giorni che la creazione di uno specifico sito "mobile" è di solito più lavoro di quello che vale e non risolve completamente il problema.
D: Utilizzi automaticamente il responsive design per tutti i client mobili?
A: Non automaticamente, ma frequentemente. Dipende veramente dalla natura del progetto - che si tratti di un'applicazione web o di un sito web aziendale - entrambi hanno parametri unici che dovrebbero essere considerati. Inoltre non separiamo molto il "mobile", piuttosto, entriamo in un progetto sapendo che nella maggior parte dei casi è multi-dispositivo, multi-risoluzione, multi-browser, ecc ... deve funzionare ovunque e con uno base di codice per essere redditizia.
È qui che un buon quadro reattivo è fondamentale: è possibile affrontare la maggior parte delle permutazioni con un buon quadro. Alchemy50 ha creato un proprio framework che è una miscela di elementi rigidi e ridimensionamento dinamico. Abbiamo scoperto che i siti più complessi tendono ad essere un po 'indisciplinati utilizzando framework elastici, quindi il nostro framework utilizza le query multimediali per regolare le nostre pagine a risoluzioni fisse. Si è dimostrato estremamente utile ed efficace nei nostri sforzi per supportare più dispositivi e browser con una base di codice.
Q: diresti di essere ...
a) A favore del design reattivo
b) Non favorevole al design reattivo
c) A favore del design reattivo e dei siti mobili separati a seconda del cliente e dei suoi utenti
Spiega brevemente perché hai scelto la tua risposta ...
A: È davvero l'unico modo per svilupparsi sul web in questi giorni. Dobbiamo metterci nei panni dei nostri clienti e considerare - costo totale, tempistica, scalabilità, supportabilità, ecc ... e quando lo facciamo, di solito supporta la nozione di un quadro reattivo. È importante sottolineare, tuttavia, che a volte ciò che viene chiesto non può essere fatto senza le librerie OS native, quindi un framework web reattivo non è la risposta a tutto.
D: Qual è il tuo miglior consiglio per i web designer / sviluppatori che cercano di creare esperienze mobile con successo per i loro clienti?
A: Non scegliere una soluzione finché non comprendi pienamente ciò che il cliente vuole fare. E attenzione, spesso le volte in cui un cliente dirà di volere "un sito HTML5" o "un'app mobile che funziona ovunque" - abbiamo scoperto che di solito non capiscono completamente cosa stanno dicendo. Chiedi loro di dimenticare la tecnologia per un minuto e di spiegare in parole povere cosa stanno cercando di costruire. Qual è il mercato di riferimento? Quali sono le abitudini di quel mercato (tecnologia, browser, siedono ai banchi, ecc.) Quali funzionalità fornirà il sito / app? Spesso, mentre parli di questi punti con il cliente, emergerà un approccio efficiente (ea volte molto diverso!).
Nicholas Davison, Digitaria
Infine, ho parlato con il Director of Web Development presso Digitaria , Nicholas Davison. Digitaria è un'agenzia digitale full-service fondata nel 1997 con cinque sedi negli Stati Uniti. Ecco cosa ha detto Nicholas riguardo al responsive design:
D: Con quale frequenza sviluppi siti Web mobili per i tuoi clienti?
A: La maggior parte delle nostre build include un componente mobile in questi giorni. Con un portafoglio ampio e profondo come quello di Digitaria, questo significa che in genere il mio team ha diversi siti con componenti mobili in qualsiasi momento.
D: Utilizzi automaticamente il responsive design per tutti i client mobili? Spiega brevemente perché o perché no.
A: Ignorando Zeldman e onorando la definizione di Marcotte ... se si separano i layout e le immagini reattivi in modo sostanzialmente adattivo, non selezioniamo automaticamente Responsive over Adaptive. Il motivo principale per questo è il ritorno sull'investimento.
I layout liquidi introducono una serie di sfide: la miscelazione di dimensioni e percentuali fisse tende a richiedere elementi div aggiuntivi per bloccare il progetto. Gli errori di arrotondamento portano a problemi nelle versioni precedenti di Internet Explorer e spesso lasciano lacune a pixel singoli anche nei browser più moderni. Il QA, se eseguito correttamente, dovrebbe controllare ogni elemento di ogni dimensione in ogni browser, il che aggiunge massicciamente ai costi del QA.
Quali sono questi costi per te rispetto a un design adattivo che soddisfa già 320, 480, 720, 960 e 1140? Fanno un uso leggermente migliore dello spazio e aggiungono un leggero fattore wow. Se quei benefici giustificano il costo, costruiamo Responsive. Se non lo fanno, Adaptive è più appropriato.
Se, come suggerisce Zeldman, utilizziamo Responsive e Adaptive in modo intercambiabile e non guardiamo a varianti liquide, non dovrebbe mai essere una decisione automatica. Chiunque pensi al proprio cliente guarda gli strumenti giusti per il lavoro giusto.
Adaptive ha molti vantaggi e di solito ha senso. Tuttavia, ci sono sempre delle eccezioni: Mdot spesso funziona meglio quando il client vuole contenuti diversi per i dispositivi mobili. Le app spesso funzionano meglio quando il cliente desidera funzionalità molto avanzate che richiedono un'interfaccia personalizzata e interazioni per ogni fattore di forma.
Occasionalmente, Mobile non ha senso, punto. Se un cliente deve semplicemente avere un sito minimale per motivi legali o di concessione e desidera mantenere bassi i costi mentre si controlla semplicemente una casella, la sovralimentazione non è appropriata.
Quindi, Adaptive è qualcosa che di solito consigliamo ma, come buon partner, non dovremmo mai consigliare automaticamente nulla senza prima ascoltare.
Q: diresti di essere ...
a) A favore del design reattivo
b) Non favorevole al design reattivo
c) A favore del design reattivo e dei siti mobili separati
Spiega brevemente perché hai scelto la tua risposta ...
A: Il design adattivo è incredibilmente convincente in quasi tutti i casi. Ignorare i dispositivi mobili e i tablet sta rapidamente diventando una mossa negativa per il business, dato che ignorare il web è stato dieci anni fa. Devi semplicemente considerarli per la maggior parte dei progetti. I giorni dei siti Mdot parziali sono numerati. Gli utenti si aspettano tutto il contenuto su qualsiasi dispositivo che usano. Una volta che il cellulare inesistente o parziale non è nemmeno un'opzione, Adaptive è il modo più economico di consegnarlo nella maggior parte dei casi. Rispetto a un sito completo Mdot e desktop completo, è più economico. Rispetto a full Mdot, Tablet e Desktop, è decisamente più economico.
E questi sono solo gli argomenti per oggi: Adaptive è più economico da mantenere e da sviluppare in quanto è una piattaforma. I siti non sono solo per oggi. Con la durata di diversi anni sulla maggior parte dei siti, non dobbiamo solo pensare a quante persone usano oggi i dispositivi mobili e i tablet, ma quanto li useranno molto prima della fine della vita del sito.
D: Qual è il tuo miglior consiglio per i web designer / sviluppatori che cercano di creare esperienze mobile con successo per i loro clienti?
A: piano. Considerare mobili e desktop allo stesso tempo. Andare indietro e riadattare la struttura sottostante per accogliere ciò che ora è necessario per un design a sorpresa è molto più costoso della pianificazione e della costruzione di una struttura pulita che sia al servizio di entrambi.
Utilizza respond.js in modo che il tuo sito funzioni su tutti i browser, non solo quelli che conoscono le query sui media. Non creare liquidi solo perché Responsive è la versione più fresca di Adaptive. Ha dei vantaggi ma ha anche dei costi. Assicurati di scegliere ciò che è giusto per te.
Prova presto e prova spesso. Era vero quando stavamo sviluppando su quattro browser desktop e avevamo considerato Internet Explorer più vecchio. È doppiamente vero ora stiamo aggiungendo molte piattaforme mobili: un problema è facile da risolvere in modo pulito se lo si cattura quando appare per la prima volta. È quasi impossibile correggerlo quando su di esso vengono costruiti decine di livelli, oscurando il problema principale. Se non stai provando, multipiattaforma, dopo ogni nuova funzione che aggiungi, stai sbagliando.
Per motivi di sanità mentale, devi accettare un elenco di piattaforme per le quali stai fornendo una garanzia di codice. Ci sono così tante varianti Android, vecchie versioni iOS point, dispositivi Windows Mobile che offrirai patch gratuite per la vita se sei abbastanza sciocco da accettare semplicemente "tutti gli smartphone". E poi c'è Blackberry dove sembrano le versioni precedenti progettato con un amore perverso di rottura.
Il dibattito continua
Grazie a tutti i partecipanti per averci fornito informazioni dettagliate sui loro processi quotidiani.