Redirect per dispositivi Mobile e lista user agent

Redirect per dispositivi Mobile e lista user agent

12170
26
CONDIVIDI

Sempre più sono le versioni delle pagine web navigabili da cellulare, veri e propri mini-siti sgombri di immagini pesanti e testi lunghissimi che badano all’informazione essenziale, motivo per il quale l’utente consulta la pagina da uno smartphone. E’ una buona norma di programmazione in questi casi verificare con quale dispositivo l’utente si collega (esempio www.marioconcina.it) ed effettuare un redirect alla versione mobile (esempio mobi.marioconcina.it) nel caso in cui il device sia uno smartphone. In questo articolo mostrerò una lista dettagliata di devices e successivamente degli script di differente linguaggio che effettuano il redirect.

Liste di mobile devices

Spulciando per il web ho raccolto le migliori risorse che in questa materia offrono un elenco abbastanza dettagliato di user agent per dispositivi mobili:

Script di redirect

Questi script, invece, contengono una lista di user agent per device mobili ed effettuano un redirect ad un url da inserire.

Scaricare il file di redirect dalla risorsa indicata.

Nel caso in cui il redirect sia Javascript basterà includere questo file e subito dopo aggiungere questo pezzo di codice per effettuare il redirect:


E’ possibile effettuare un redirect 301 anche via htaccess utilizzando la seguente condizione, copiandola e replicandola per ogni browser che contiene la stringa indicata (ad esempio iPhone, Symbian, BlackBerry, ecc…)

RewriteCond %{HTTP_USER_AGENT} ^.*iPhone.*$
RewriteRule ^(.*)$ http://mobi.tuosito.it [R=301]

26 COMMENTI

  1. Ottime le risorse. Forse, però dimentichi che si potrebbe con javascript misurare la larghezza dello schermo ed effettuare un redirect:

    if(screen.width < 300) location.href = 'sito';

  2. grazie per la dritta e grazie anche a peterborto, sicuramente detectmobilebrowser.com è una risorsa abbastanza valida 😉

  3. @Cut&Pasteh
    la soluzione che hai illustrato è meno efficace rispetto il riconoscimento dello user agent poichè una finestra di un browser potrebbe anche aprirsi ridimensionata anzichè a pieno schermo e quindi questo causerebbe un redirect anche nel caso in cui stessi navigando da un pc.

  4. SilvioM,
    per wordpress c’è WP-TOUCH. E’ un plugin che effettua il redirect automatico attraverso un altro tema mobile definito sempre in wp; ovviamente, però bisogna un pò perderci la testa perchè non è del tutto “intuitivo” e soprattutto c’è la versione PRO che è a pagamento e costa un bel pò.

    • basta sostituire la stringa “iPad” con quelle già presenti negli esempi, con .htaccess una cosa del genere:

      RewriteCond %{HTTP_USER_AGENT} ^.*iPad.*$
      RewriteRule ^(.*)$ http://mobi.tuosito.it [R=301]
      
  5. è possibile con javascript il redirect distinto al cellulare (1) e al tablet (2)? utilizzando cioè 2 siti distinti e diversi? grazie per …………..la risposta

  6. Come faccio a fare in modo che
    i cellulari vadano ad un sito e SOLO i tablet vadano ad un altro sito?
    ho creato una versione per i tablet e una per i cellulari…
    grazie mille 🙂

  7. Buongiorno, scusate ma non riesco a trovare risposta su google (!!) se io volessi che il redirect non fosse forzato, ma che fosse proposto (solo) agli utenti di smartphone e tablet, lasciando però la possibilità di accedere al sito principale, cosa dovrei fare?
    Grazie mille

  8. Salve,
    Ho realizzato un sito su Wix, poi acquistato domain nane su Aruba con opzione redirect al sito wix. Su pc tutto ok ma nn si accede da smartphone… C’è una soluzione semplice? Cordiali saluti e grazie

  9. Mario scusa ma non funziona… ho provato il js sul mio sito e niente!
    La cosa strana è che ho provato a navigare il tuo da un smartphone Android e da un iPod e non mi manda alla parte mobile.
    Che succede?

    • Ciao Alberto,
      questo è un articolo del 2011, nel frattempo il mio blog ha subito un restyling grafico che non supporta più la versione mobile dedicata ma è
      responsive. Tuttavia il javascript è ancora funzionante, hai inserito anche il codice seguente? Con quale devices navighi?

      
      
    • Si l’ho inserito, ed ovviamente ho anche caricato il js allo stesso livello /
      Navigo con HTC One Android e iPod Touch
      Grazie!

  10. ciao Mario, sto realizzando questo sito web per il gioco del fantacalcio tra amici e molti amici miei mi hanno detto che vogliono seguirlo da smartphone ho visto il tuo codice js e ti volevo chiedere ma è da inserire in tutte le pagine del sito oppure in un file esterno e poi fare il richiamo in ogni pagina??
    grazie!!

    • il controllo deve essere effettuato in tutte le pagine, altrimenti se raggiungo una pagina interna senza passare dalla home page, visualizzerò sempre la versione desktop

LASCIA UN COMMENTO