what is mobile responsive test
Importanza del test reattivo mobile:
Nel mondo meccanizzato di oggi, i siti web non vengono visualizzati solo su un laptop o un desktop, ma anche su un tablet e uno smartphone.
Sono finiti i giorni in cui eravamo soliti sederci davanti ai nostri desktop o laptop per fare acquisti, navigare in Internet o inviare e-mail. Ora è l'era dei dispositivi mobili e le persone accedono a Internet mentre camminano per le strade, sedute in un parco e ovunque desiderano in base al loro comfort.
Se osservi un desktop, un laptop, un tablet e uno smartphone, non solo il loro sistema operativo, la CPU, ecc. Differiscono, ma anche le dimensioni dello schermo.
Quindi per un'azienda che non si affida solo a un'app ma anche a un sito Web, è molto importante che il sito Web si adatti bene a queste diverse dimensioni. Ai tuoi clienti o utenti non piacerà se devono regolare i loro telefoni per vedere meglio il contenuto del tuo sito web.
Usiamo tutti i siti web di Amazon, Agoda, ZDNet, ecc. Quasi quotidianamente. Immagina quanto sarebbe noioso se dovessi accedere alla pagina successiva oa un'immagine ma il link non si adatta allo schermo o è troppo piccolo per fare clic? Tali cose comportano la perdita dell'interesse dell'utente.
È qui che entra in gioco il comportamento mobile responsive o mobile-friendly.
Il web design reattivo o amichevole è fondamentalmente correlato ai siti web. Il web design reattivo mobile è un approccio seguito nello sviluppo del sito Web per offrire agli utenti un'esperienza visiva decente su qualsiasi dispositivo stiano visualizzando.
Google dà la priorità ai siti ottimizzati per i dispositivi mobili nei risultati di ricerca e quindi diventa importante progettare il tuo sito web tenendo presente questo.
Cerchiamo prima di capire che cos'è questo 'Web design reattivo per dispositivi mobili'.
Cosa imparerai:
- Significato di reattività mobile o design amichevole
- Strumento consigliato
- Conclusione
Significato di reattività mobile o design amichevole
Il responsive web design è indicato anche come RWD ed è un approccio per progettare un sito web per rendere le pagine web da interpretare con diversi dispositivi e le loro dimensioni dello schermo.
Ha tre principi di sviluppo che includono:
- Griglie fluide: Questo approccio si basa sulla percentuale e non sull'approccio storico basato sui pixel.
- Query multimediali : Viene utilizzato per applicare stili diversi in base alle dimensioni dello schermo del dispositivo.
- Immagini e supporti flessibili : Questo aiuta a mostrare le immagini e i media in modo diverso in diverse dimensioni utilizzando il ridimensionamento o CSS.
Con l'approccio di sviluppo, anche il test di siti Web reattivi è importante.
I siti Web ottimizzati per i dispositivi mobili devono offrire agli utenti la stessa esperienza su un dispositivo mobile che su un laptop o un desktop. Deve essere testato per diversi browser, diverse dimensioni dello schermo, modalità: orizzontale o verticale, ecc.
Strumento consigliato
# 1) Browser LambdaTest LT
Un browser orientato agli sviluppatori che fornisce agli utenti un'area di lavoro di sviluppo per testare la reattività del proprio sito web su una varietà di viewport del dispositivo. Sviluppato con l'obiettivo di ridurre il tempo impiegato per i test reattivi, è costruito per semplificare le attività di test quotidiane di tester e sviluppatori web.
Caratteristiche principali:
- Prova istantaneamente su diversi viewport del dispositivo.
- Crea il tuo dispositivo personalizzato.
- Eseguire il debug su diverse finestre Affiancate.
- Il test del sito web locale non è mai stato così facile.
- Strumenti di sviluppo integrati per un debug più veloce.
- Acquisisci screenshot e video e condividili con il tuo team.
Test reattivo mobile e le sue sfide
Incorporare un responsive web design non pone fine alla storia, è altrettanto importante testarne l'implementazione per assicurarsi che il sito web venga visualizzato come previsto su tutti i dispositivi.
Il contenuto, i video, le immagini, i collegamenti, ecc., Devono essere tutti testati per il loro aspetto prima di rilasciare il sito web. Non solo su tutti i dispositivi, ma i test devono essere eseguiti anche su browser e sistemi operativi diversi.
come creare un nuovo progetto java in eclipse
Per esempio , un sito Web può avere un aspetto leggermente diverso su Android rispetto a iOS o Windows.
(Immagine fonte)
Ma ci sono anche grandi sfide che il QA deve affrontare per testare la reattività. La sfida più grande sono le combinazioni di dimensioni dello schermo, le versioni del sistema operativo, le modalità del telefono, i browser e le loro risoluzioni. Quindi è difficile decidere la strategia. Le altre sfide includono il periodo di tempo del test, gli strumenti, la priorità dei test, ecc.
Di seguito sono riportati alcuni suggerimenti per decidere come eseguire il test:
# 1) Banco di prova
La creazione di matrici per le diverse combinazioni di dimensioni del telefono, browser, sistemi operativi e versioni è un'attività molto noiosa e complicata. Quindi, come QA, suggerirei di prendere input dal BA e dal proprietario o manager del prodotto.
Perché considerando le complicazioni del banco di prova, è consigliabile far decidere loro le versioni, le taglie, ecc. Che devono essere testate. Può accadere che dedichi molto tempo alla ricerca e alla strategia dei banchi di prova che potrebbero non essere approvati dal tuo manager o dal master SCRUM. I siti web sono accessibili su desktop, telefono, ecc.
Quindi il banco di prova deve includere browser le cui versioni saranno comuni per tutti questi dispositivi, in questo modo saranno evitate le complicazioni della variazione di versione e la stessa versione potrà essere testata su tutti.
# 2) Allocazione del tempo
È necessario discutere e finalizzare quanto tempo è necessario per i test e quanto viene allocato poiché il test di siti Web reattivi richiede molto tempo.
Sulla base di ciò dovrai preparare il piano di come e cosa testare. Assicurati che sia assegnato tempo sufficiente per il test in modo che venga testata una serie di importanti combinazioni del banco di prova.
# 3) Dispositivi reali ed emulatori
Per testare così tante combinazioni, non è possibile acquistare tutti i dispositivi reali, quindi è possibile utilizzare emulatori e simulatori.
Secondo la mia esperienza, i più importanti sono le versioni, le dimensioni, ecc. E dovrebbero essere testati su dispositivi reali, ma le versioni e le dimensioni del telefono che sono un po 'obsolete possono essere testate su emulatori e simulatori.
# 4) Manuale o automazione
Il test può essere eseguito utilizzando sia l'approccio manuale che quello automatizzato. A volte gli strumenti non possono vedere ciò che un occhio può vedere, quindi a volte è necessario eseguire anche test manuali. Gli sforzi possono essere suddivisi come il 65% di automazione e il 35% di sforzi manuali o viceversa.
Per esempio ,uno strumento che fa clic su un piccolo collegamento è molto diverso dal fare clic con le dita o eseguire manualmente lo zoom indietro di una pagina web piuttosto che uno strumento che ingrandisce la pagina.
# 5) Dare priorità al test
È necessario assegnare correttamente la priorità ai test perché c'è molto da testare e non tutto può essere testato. Quindi l'intero team dovrebbe concordare il piano di test e la sua priorità. La priorità del test deve essere comunicata al BA e al proprietario del prodotto con largo anticipo in modo che se hanno dei suggerimenti, anche quelli possono essere esaminati.
Le combinazioni di sistemi operativi, browser e dimensioni dello schermo di uso comune devono essere verificate accuratamente e con priorità . Secondo la mia esperienza, è necessario eseguire un ciclo completo di test sull'ultimo sistema operativo mobile, ma dopo che tutti i problemi sono stati risolti e verificati perché non tutti utilizzano l'ultimo sistema operativo mobile.
Importanza di testare la reattività di un sito web
Il contenuto di un sito web è ciò che promuove l'attività e se il contenuto non attrae i clienti, l'attività non può prosperare bene. Quindi lo sviluppo di un sito web reattivo non pone fine alla storia, ma deve anche essere controllato e verificato.
I test svolgono un ruolo fondamentale nell'assicurare che stiamo offrendo ai nostri clienti un'applicazione di qualità, robusta e facile da usare. Lo stesso vale anche per un sito Web mobile reattivo.
Di seguito sono riportati alcuni fattori che denotano l'importanza di testare un sito Web mobile reattivo:
# 1) Una pletora di dispositivi, sistemi operativi e browser: La verifica del contenuto deve essere eseguita per cellulari di dimensioni diverse dello schermo, sistemi operativi e browser. Non è detto che se il contenuto è perfetto, sarà perfetto anche per gli altri.
# 2) Robustezza: Il tempo impiegato da un sito web per caricare il contenuto dovrebbe essere lo stesso su piattaforme diverse e non dovrebbe essere lento o scaduto su alcun dispositivo o browser 'supportato'. Quindi testare le prestazioni del sito Web è importante per i siti Web reattivi per dispositivi mobili.
# 3) Navigazione: È un difetto molto comune che si riscontra durante il test di siti Web o app mobili che le pagine non si caricano come previsto quando si naviga tra i diversi collegamenti del sito Web. A volte capita che manchino i link o le immagini non vengano caricate o scadute durante il gioco con la navigazione.
# 4) Varietà di immagini e video: È necessario un test appropriato per verificare se tutti i tipi di immagini e video vengono visualizzati come previsto su telefoni, browser, ecc. Diversi.
A volte alcuni video vengono riprodotti bene su Android ma non vengono nemmeno caricati su iOS o alcune immagini appaiono rotte su alcune versioni di un sistema operativo mobile mentre sono perfette su altre
Tali problemi possono dare un'impressione molto negativa se il test non viene eseguito. Quindi testare i siti Web reattivi per dispositivi mobili è importante insieme ad altri test come funzionalità, sicurezza, ecc.
Pochi casi di test di esempio per testare la reattività mobile
Di solito, i tester iniziano a testare ridimensionando le finestre dei cellulari, dei browser, dei tablet, dei laptop, ecc., Ma c'è molto di più che deve essere testato.
Di seguito sono riportati alcuni casi di test di esempio che possono essere coperti durante il test di un sito Web mobile reattivo, assicurarsi che i casi di test siano testati per tutte le matrici del banco di prova:
- Verificare se il contenuto si adatta allo schermo e non è tagliato o distorto.
- Verifica se i video vengono caricati e non contengono collegamenti interrotti.
- Verifica se il colore del testo, il carattere ecc. Rimangono gli stessi.
- Verifica se lo zoom indietro non distorce i contenuti, le immagini e i video della pagina web.
- Verifica se uno scorrimento veloce non distorce il contenuto.
- Verificare se i collegamenti funzionano correttamente e se portano l'utente alla pagina appropriata.
- Verifica se la pagina web non scade o impiega troppo tempo per caricarsi.
- Verifica se il passaggio dalla modalità orizzontale a quella verticale o viceversa regola il contenuto di conseguenza.
- Verifica se le immagini di diversi tipi come .jpg, .png, .gif e così via vengono visualizzate come previsto.
- Verificare se i collegamenti diventano cliccabili quando si esegue lo zoom su telefoni con schermo piccolo.
- Verifica se la navigazione tra le pagine web non distorce il contenuto ecc.
Strumenti di test reattivi per dispositivi mobili
Sono disponibili diversi strumenti per testare la reattività di un cellulare, sia gratuiti che a pagamento.
Secondo la mia esperienza, per questo particolare tipo di test, è meglio utilizzare uno strumento che può essere utilizzato per una varietà di telefoni, i loro sistemi operativi, browser, ecc. Non è possibile utilizzare strumenti diversi per diversi dispositivi, browser , eccetera.
Quindi mentre scegli uno strumento, scegli quello che può coprire il massimo del banco di prova.
Strumenti di test reattivi mobili open source aggiuntivi:
# 1) Websiteresponsivetest.com: Questo strumento supporta tutti i principali browser web e fornisce un'anteprima di come apparirà il sito web effettivo. Per ottenere i risultati della reattività di un sito web, dobbiamo inserire l'URL del nostro sito web.
# 2) Screenfly: È anche uno strumento di test reattivo mobile e può essere utilizzato per i test sulla scheda Galaxy, iPad, ecc. Rileva automaticamente il sito mobile del sito Web e ti porta allo stesso.
# 3) Resizer VeiwPort: È uno strumento configurabile e può essere utilizzato per personalizzare le dimensioni dello schermo di un browser.
# 4) Responsabile: Questa è una versione a pagamento dove puoi anche acquistare il sottodominio per i tuoi test. Fornendo l'URL del sito web, questo strumento mostra come apparirà il sito web.
Conclusione
Il test reattivo mobile è molto importante per garantire che tutti gli utenti ottengano un'esperienza visiva ottimale sui propri dispositivi, forse un laptop, un desktop, un tablet o uno smartphone.
Come discusso in precedenza, solo se il contenuto sembra buono per un utente, sarà interessato ad andare oltre, quindi insieme agli altri tipi di test di funzionalità, sicurezza, stress, ecc. Anche il test reattivo è molto importante e non dovrebbe essere preso alla leggera.
Il test reattivo mobile è semplice ma i banchi di prova rappresentano la maggiore complessità e sfida. Quindi, come QA devi affrontarlo in modo intelligente.
Nel nostro prossimo articolo, discuteremo di più su Provider di servizi di test di app mobili basati su cloud .
Lettura consigliata
- Migliori strumenti di test del software 2021 (Strumenti di automazione del test QA)
- Perché il test mobile è difficile?
- 10 migliori strumenti di test per la sicurezza delle app mobili nel 2021
- Come ottenere rapidamente un lavoro di test mobile - Guida alla carriera nel test mobile (Parte 1)
- 5 Sfide e soluzioni dei test mobili
- TOP 15 migliori strumenti di test per dispositivi mobili nel 2021 per Android e iOS
- Test di applicazioni mobili basate su cloud: una panoramica completa
- Oltre 40 domande e risposte al colloquio sui test mobili più comuni con esempio di curriculum per test mobili