Emulazione mobile in Google Chrome

Detto semplicemente, adoriamo Google Chrome. Funziona senza intoppi, ha un aspetto semplice e ha molte app utili. Dal punto di vista dello sviluppatore, Google Chrome è sempre un passo avanti in termini di supporto allo standard Web più recente, il che è ottimo.

Viene inoltre fornito con una serie di strumenti per lo sviluppo web, alcuni dei quali devono ancora essere implementati in altri strumenti di sviluppo integrati del browser . Questi includono l'emulazione di Viewport, la geolocalizzazione e l'override dell'orientamento del dispositivo e l'emulazione del tocco.

Recentemente, Google Chrome ha implementato una nuova funzione chiamata Emulazione mobile che ci consente di vedere, su Chrome, in che modo un sito web reagirà, funzionerà e si comporterà come in un vero dispositivo mobile. Figo? Bene, vediamo come funziona.

Essere reattivo o no

Anche se in questi giorni il Responsive Web Design è più adottato, ma non è in grado di soddisfare le esigenze di tutti i tipi di siti web. Alcuni tipi potrebbero richiedere un sito mobile dedicato e separato a causa delle limitazioni dei dispositivi mobili: alcuni elementi del sito potrebbero scomparire sui dispositivi mobili; le funzionalità possono comportarsi diversamente mentre sul cellulare e sul desktop.

Prendi Amazon.com come esempio. Quando lo visualizzi sul desktop e ridimensiona la dimensione del viewport, non succederà nulla. Porta il tuo telefono cellulare, guardalo e visualizza la versione mobile semplificata del sito. Amazon prende la rotta separata del sito per dispositivi mobili, piuttosto che rendere il suo sito web reattivo.

Come funziona

Se vuoi fare lo stesso, crea un sito mobile dedicato, ora puoi utilizzare Mobile Emulation in Chrome per facilitare il tuo lavoro per il debug del sito. Questa funzione, al momento della scrittura, è disponibile solo su Chrome Canary . Può essere trovato in una nuova scheda Emulation in DevTools.

Vale la pena notare che la posizione o il nome potrebbe essere cambiato in futuro una volta che viene inviato a Chrome "normale".

Chrome ha un numero di dispositivi predefiniti tra cui Google Nexus, iPad, iPhone, Blackberry e Kindle. Scegline uno, premi il pulsante Emula.

Le specifiche del dispositivo come Viewport Size, User Agent String e Pixel Ratio, nonché altre impostazioni riflettono automaticamente le dimensioni del dispositivo selezionato.

Aggiorna Chrome e ora dovresti essere in grado di navigare nel sito come se fosse visualizzato su un dispositivo mobile. Se osservi da vicino, noterai che il cursore del mouse si trasforma in un cerchio che indica un evento di tocco. Sul touchpad del tuo laptop, puoi usare due dita per scorrere e tre dita per un colpo, in questo modo.

Inoltre, puoi esplorare questa funzione su alcuni siti web che hanno una versione mobile dedicata, come ad esempio:

• Facebook
• Google
• Bersaglio
• New York Times
• Youtube

15 giochi Android e iOS Bluetooth da provare - Il meglio di

Esistono centinaia di giochi multiplayer online in cui giochi con estranei, ma quando vuoi giocare a un gioco con familiari o amici, la scelta migliore sono i giochi Bluetooth. Con i giochi basati su Bluetooth puoi connetterti con il telefono del tuo amico per giocare uno contro l'altro o unirti a un'alleanza in tempo reale

(Consigli tecnici e di design)

5 strumenti gratuiti per notificare modifiche ai contenuti del sito Web

Per sapere quando un sito web cambia i suoi contenuti, devi andare su quel sito Web e controllarlo frequentemente e manualmente . Non sembra molto lavoro, a meno che non si tratti di un sito di e-commerce o di un sito Web di notizie in cui i contenuti del Web cambiano rapidamente e all'improvviso

(Consigli tecnici e di design)