Mentre una volta accedere al web significava dover per forza essere seduti davanti ad un computer, oggi, grazie agli ormai numerosi dispositivi mobili, quali telefoni e tablet intelligenti, è possibile visualizzare un qualsiasi sito praticamente ovunque.
Questa trasformazione nelle nostre abitudini ha offerto la grande possibilità di ridefinire il modo in cui presentiamo i contenuti, costringendoci a considerare le necessità dell’utente in modi prima impensabili: ne sono un esempio le molte applicazioni che si basano sulla posizione, dove il contenuto gira principalmente intorno all’utente e alla sua ubicazione.
Gli smartphone di ultima generazione, grazie ad un GPS inserito direttamente al loro interno, possono sfruttare la funzione di geolocalizzazione; tuttavia, le opportunità offerte da questa innovazione non sono limitate alle app native: anche HTML5 consente di rivelare la posizione dell’utente per poi calibrare di conseguenza il contenuto del nostro sito.
Come funziona la Geolocalizzazione?
Per prima cosa il browser deve richiedere l’autorizzazione dell’utente alla condivisione della sua posizione, attraverso una finestra pop-up.
Se il riscontro è positivo, l’elemento geolocation di HTML5, disponibile attraverso un’API JavaScript, cercherà di localizzare il visitatore del sito usando i mezzi a sua disposizione (comprese le reti Wi-Fi, Bluetooth, RFID ecc…).
La localizzazione è possibile anche senza un chip GPS, quindi qualsiasi browser abbastanza recente da supportare HTML5 e l’API di geolocalizzazione stessa, sarà in grado di rivelare la posizione.
Tutti gli smartphone e i tablet di ultima generazione supportano la tecnologia HTML5, essi infatti, insieme ai computer portatili, sono i dispositivi più comuni per sfruttare questa funzionalità.
Come posso Utilizzarla?
Con poche e semplici righe di codice JavaScript sarà possibile richiedere la posizione dell’utente, la prima cosa da fare naturalmente sarà accedere all’API, attraverso la sintassi navigator.geolocation; in questo modo viene impostata una richiesta per la posizione dell’utente e nella finestra del browser appare un avviso: la richiesta di permesso di cui avevamo parlato sopra:
navigator.geolocation.getCurrentPosition(show position);
Una volta localizzata la posizione dell’utente sarò possibile accedere alla posizione come a un set di coordinate basate su latitudine e longitudine. Quest’ultime vengono restituite con valori a virgola mobile, con molte posizioni decimali, se quindi volete mostrare i dati all’utente, consiglio di utilizzare parseInt per semplificare i risultati:
function show position(position) {
//questa funzione viene chiamata quando la posizione è stata determinata
alert("You are located at latitude "+position.coords.latitude+" and longitude"+position.coords.longitude)
}
Integrazione con un servizio di terze parti
Naturalmente, ottenere la posizione dell’utente sotto forma di latitudine e longitudine è solo metà del lavoro: questi dati sono utili solo se fatti interagire con servizi di terze parti.
Un esempio può essere la presentazione di una mappa personalizzata, con annesse le posizioni di servizi o locali vicini, magari con le dovute indicazioni, ma è anche possibile realizzare qualcosa di più creativo, come un gioco, una storia interattiva o un feed social media, il tutto basato sulla posizione.
Tutto questo è semplificato grazie a funzioni come OpenLayers, OpenStreetMap, BingMaps o Google Maps: ognuna di esse offre un’API che consente di passare una posizione espressa in latitudine e longitudine.
In conclusione…
Inserire la funzione della geolocalizzazione è molto semplice ma, con un po’ di fantasia, apre le porte a moltissime possibilità, in grado anche di intrattenere l’utente quando naviga sulle tue pagine web, sono quindi dell’idea che sia un’ottima opportunità per rendere un sito originale e piacevole da navigare!
Cosa ne pensate voi? Implementerete mai la Geolocalizzazione in uno dei vostri siti?
