Comunidad de diseño web y desarrollo en internet online

TUTORIAL para desarrollo de sitios para dispositivos móviles

Citar            
MensajeEscrito el 09 Sep 2010 05:55 pm
Llevo varios días tratando de encontrar un buen tutorial para iniciarme en el desarrollo de sitios para disposivos móviles. Y he encontrado cosas muy avanzadas o cosas que no entiendo en absuluto. Entonces por eso abro este post y espero que algun moderador me ponga como post fijo o como sea que se llame. La idea de este post es ir aportando los elementos básicos para inicar en este mundo, desde las preguntas más obvias a otras mas desarrolladas.

Bueno para empezar pongo mi aporte.

Introducción


Para todos aquellos que se dediquen al desarrollo web, seguramente cada vez más se encontrarán con comentarios como "mi pagina se puede ver en mi iPhone", y entonces cada vez más te van orillando a que desarrolles la version móvil del sitio que creaste, y de aqui nace la inquietud de este post.

Para empezar debo decir que no todos tenemos acceso a la cantidad de dispositivos que salen a cada rato, que el telefonito de nokia, el de samsung, el de sony, el de apple, el de google, blackberry etc etc. Así que esto del diseño de la pagina se vuelve un poco más complicado. ya que cada cierto tiempo sale un teléfono con pantalla más grande, con más resolución, más memoria, mejor procesador, etc.

Todo esto, hasta que no se defina un standard, hace que tengamos que adapatar un sitio móvil que sea compatible con cualquier celular o dispositivo. Es por eso que habrá que exponer buenas prácticas en el desarrollo de sitios.

¿Por dónde empezar?


Despues de esta introducción, pongo algunos links de paginas que extienden esta introduccion:
El siguiente link habla sobre la necesidad actual, y da varias estadísticas que nos pueden servir de referencia


Aca la aportación de google dirigida a los webmasters

Despues de haber leído esto y ya que como comentaba antes no todos tenemos acceso a todos los dispositivos que salen cada día, ni mucho menos tener un servicio de 3G como le llaman en mi pais, cariiiiiiisimo por cierto. Por ello yo he instalado un emulador para la compu. En este caso es un emulador con soporte para aplicaciones java y e instalado el opera mini para ver como se vería mi pagina desde un dispositivo movil. Me imagino que ha de haber varios emuladores pero este es el que instalé se llama microemulator y puede ser descargado gratis desde aca

Aca un tutorial sobre como ponerle el opera-mini. En realidad no es dificil, solo hay que bajar el archivo jad del opera mini y abrirlo con el emulador.

También busqué algunos emuladores para el iPhone pero no encontré alguno bueno.

Ahora, hasta aqui he llegado en mi busqueda y tengo varias preguntas que dejo abiertas a los foristas.

1- ¿Cómo hago para detectar el dispositivo movil? es decir, que si ponen www.misitio.com vaya directamente a la versión mobile
2.- He notado que en paginas como google, amazon, entre otras, las imágenes son redimensionadas supongo que para que se muestren en pantalla y además reducir el peso en Bytes de la página, esto se hace con programación desde el servidor o lo hace el navegador?
3.- Sobre el tamaño total de la página, ¿cual sería el aproximado recomendado?

Esperando que personas con las mismas inquietudes que yo les sea de utilidad esto, que personas que ya las hayan tenido puedan aportar y resolver las dudas de nosotros los newbies.

Saludos.

Por nodream

Claber

99 de clabLevel



 

firefox
Citar            
MensajeEscrito el 09 Sep 2010 09:46 pm
Gracias al moderador que puso esta entrada como postIt

Por nodream

Claber

99 de clabLevel



 

chrome
Citar            
MensajeEscrito el 13 Sep 2010 06:14 pm
Veo que este post no ha tenido mucho éxito, pero de igual manera pongo un avance de lo que he encontrado.

Segunda parte


Sobre mi primer pregunta, ¿cómo hago para redireccionar mi dominio? es decir, si entran con un dispositivo móvil que se vea la version mobile de mi sitio.

He encontrado que esto se hace en los servidores apache modificando el .httpacess y redireccionando usando el HTTP_USER_AGENT para hacer la diferenciación. Algo parecido a esto

Código :

RewriteEngine on
RewriteCond %{HTTP_USER_AGENT} ^(DoCoMo¦J-PHONE¦KDDI¦UP.Browser¦DDIPOCKET) [NC]
RewriteCond %{REQUEST_URI} !^/mobile
RewriteRule (.*) /mobile/$1 [L]



donde DoCoMo¦J-PHONE¦KDDI¦UP.Browser¦DDIPOCKET son los dispositivos móviles, sin embargo de donde saqué esta información data del 2004, así que creo que esta un poco desactualizada la lista de dispositivos. Encontré algo un poco más completo y quedaría algo así

Código :

RewriteEngine on
RewriteCond %{HTTP_ACCEPT} "text/vnd.wap.wml|application/vnd.wap.xhtml+xml" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "acs|alav|alca|amoi|audi|aste|avan|benq|bird|blac|blaz|brew|cell|cldc|cmd-" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "dang|doco|eric|hipt|inno|ipaq|java|jigs|kddi|keji|leno|lg-c|lg-d|lg-g|lge-" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "maui|maxo|midp|mits|mmef|mobi|mot-|moto|mwbp|nec-|newt|noki|opwv" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "palm|pana|pant|pdxg|phil|play|pluc|port|prox|qtek|qwap|sage|sams|sany" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "sch-|sec-|send|seri|sgh-|shar|sie-|siem|smal|smar|sony|sph-|symb|t-mo" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "teli|tim-|toshi|tsm-|upg1|upsi|vk-v|voda|w3cs|wap-|wapa|wapi" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "wapp|wapr|webc|winw|winw|xda|xda-" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "up.browser|up.link|windowssce|iemobile|mini|mmp" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "symbian|midp|wap|phone|pocket|mobile|pda|psp" [NC]
RewriteCond %{REQUEST_URI} !^/mobile
RewriteRule (.*) /mobile/$1 [L]




Bien, ahora viene otro dilema, ¿qué es mejor, redireccionar a otro dominio (algo como m.misitio.com) u alguna carpeta (ej. misitio.com/mobile), o bien, preparar las páginas para que si es un dispositivo móvil se muestren de una forma y sino se ve la versión "normal". En este momento creo que la respuesta dependerá de las necesidades que se tengan en un momento dado.

Por acá me encontré otro método donde consultan la cabecera en una base de datos, pero creo que esto es usando .NET cosa que no me interesa por ahora, pero les dejo el link para quien le pueda interesar.

Por el momento es todo, espero que más miembros del foro participen, de lo contrario, pido al moderador que mueva este post a otro foro que crea más conveniente, o bien eliminarlo definitivamente.

Saludos

Por nodream

Claber

99 de clabLevel



 

chrome
Citar            
MensajeEscrito el 13 Sep 2010 06:57 pm
Esta es la fuente actualizada

http://wurfl.sourceforge.net/index.php

http://www.tera-wurfl.com/wiki/index.php/Main_Page

por ahí existe mucha información.

Por Sisco

BOFH

3700 de clabLevel

12 tutoriales
4 articulos

Genero:Masculino   Bastard Operators From Hell

Catalunya

firefox
Citar            
MensajeEscrito el 13 Sep 2010 07:03 pm
Y léete este hilo, que es un ejemplo practico con php yo lo uso en algún sitio. Pero recuera dar opción siempre con enlace para poder visitar el sítio completo o clasico (como hace google)

:cool:

Por Sisco

BOFH

3700 de clabLevel

12 tutoriales
4 articulos

Genero:Masculino   Bastard Operators From Hell

Catalunya

firefox
Citar            
MensajeEscrito el 13 Sep 2010 11:31 pm
Gracias Sisco por la info, también me enconté con el hilo que recomiendas que lea, aunque me tendría que poner este codigo en todas las paginas de mi sitio?, eso no me sería muy útil, y aunque lo meta en una función, tendría que llamar esa función en todas las páginas, cosa que hacia que me gustara más la opcion de editar el .htacesss. Pero gracias de nuevo por la info, seguiré leyendo.

Por nodream

Claber

99 de clabLevel



 

chrome
Citar            
MensajeEscrito el 14 Sep 2010 08:48 am
Puedes poner el código fácilmente en tus páginas mediante un include() al inicio.

Aquí te dejo un manual de introducción (PDF) básico, pero muy útil para ver como empezar.

Por Sisco

BOFH

3700 de clabLevel

12 tutoriales
4 articulos

Genero:Masculino   Bastard Operators From Hell

Catalunya

firefox
Citar            
MensajeEscrito el 15 Sep 2010 06:02 am
Gracias por el manual, aunque por lo que veo esta enfocado a desarrollar aplicaciones para móviles, en mi caso solo quiero hacer la versión móvil de determinado sitio.

Por nodream

Claber

99 de clabLevel



 

chrome
Citar            
MensajeEscrito el 18 Sep 2010 02:26 pm
En el evento adobe hispano 2010 se hablo de los pormenores del webdesign.
http://www.mobilexweb.com/ es el blog de unit de los participantes. Muy recomendable su libro.

Por Sisco

BOFH

3700 de clabLevel

12 tutoriales
4 articulos

Genero:Masculino   Bastard Operators From Hell

Catalunya

safari
Citar            
MensajeEscrito el 28 Sep 2010 02:06 pm
he encontrado el siguiente documento que muestra las mejores practicas para desarrollo desitios web moviles:

http://www.w3.org/TR/mobile-bp/

Por CLAnonimo

Claber

600 de clabLevel

5 tutoriales
1 articulo

 

Este es un usuario anónimo genérico para las cuentas borradas o perdidas.

firefox
Citar            
MensajeEscrito el 28 Sep 2010 02:50 pm
He encontrado varios scritps en diferentes lenguajes
php:

Código PHP :

<?php
$useragent=$_SERVER['HTTP_USER_AGENT'];
if(preg_match('/android|avantgo|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i',$useragent)||preg_match('/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|e\-|e\/|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(di|rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|xda(\-|2|g)|yas\-|your|zeto|zte\-/i',substr($useragent,0,4)))
header('Location: http://detectmobilebrowser.com/mobile');
exit;
?>

Java Script:

Código Javascript :

(function(a,b){if(/android|avantgo|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|e\-|e\/|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(di|rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|xda(\-|2|g)|yas\-|your|zeto|zte\-/i.test(a.substr(0,4)))window.location=b})(navigator.userAgent||navigator.vendor||window.opera,'http://detectmobilebrowser.com/mobile');

ASPX:

Código :

<%
Dim u As String = Request.ServerVariables("HTTP_USER_AGENT")
Dim b As New Regex("android|avantgo|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino", RegexOptions.IgnoreCase)
Dim v As New Regex("1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|e\-|e\/|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(di|rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|xda(\-|2|g)|yas\-|your|zeto|zte\-", RegexOptions.IgnoreCase)
If b.IsMatch(u) Or v.IsMatch(Left(u, 4)) Then Response.Redirect("http://detectmobilebrowser.com/mobile")
%>

Por CLAnonimo

Claber

600 de clabLevel

5 tutoriales
1 articulo

 

Este es un usuario anónimo genérico para las cuentas borradas o perdidas.

firefox
Citar            
MensajeEscrito el 18 Ene 2011 01:35 pm
[quote="cabeto41"]He encontrado varios scritps en diferentes lenguajes
php:

Código PHP :

<?php
$useragent=$_SERVER['HTTP_USER_AGENT'];
if(preg_match('/android|avantgo|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i',$useragent)||preg_match('/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|e\-|e\/|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(di|rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|xda(\-|2|g)|yas\-|your|zeto|zte\-/i',substr($useragent,0,4)))
header('Location: http://detectmobilebrowser.com/mobile');
exit;
?>


Hola claberos, una consulta con respecto al codigo php que cito arriba.
En que momento le indicas a donde se tienen que redirijir los moviles ?
Muchas Gracias.

Por Patrol

80 de clabLevel



Genero:Masculino  

Diseñador web.

firefox
Citar            
MensajeEscrito el 18 Ene 2011 08:40 pm
[quote="Patrol"]

cabeto41 escribió:

He encontrado varios scritps en diferentes lenguajes
php:

Código PHP :

<?php
$useragent=$_SERVER['HTTP_USER_AGENT'];
if(preg_match('/android|avantgo|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i',$useragent)||preg_match('/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|e\-|e\/|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(di|rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|xda(\-|2|g)|yas\-|your|zeto|zte\-/i',substr($useragent,0,4)))
header('Location: http://detectmobilebrowser.com/mobile');
exit;
?>


Hola claberos, una consulta con respecto al codigo php que cito arriba.
En que momento le indicas a donde se tienen que redirijir los moviles ?
Muchas Gracias.
La linea que empieza con "header", en frente de "Location" es la URL a donde se redigirá.

Por Freddie

BOFH

53 tutoriales
597 articulos
43 ejemplos

Genero:Masculino   Admin

Conserje de Cristalab

firefox
Citar            
MensajeEscrito el 18 Ene 2011 08:52 pm
Muchas gracias por la pronta respuesta Freddie! A darle átomos a los sitios para mobiles !

Gracias.

Por Patrol

80 de clabLevel



Genero:Masculino  

Diseñador web.

firefox
Citar            
MensajeEscrito el 07 Mar 2011 08:55 pm
El código para php, donde lo pegas? en el index?

Por ayrezxxx

5 de clabLevel



 

chrome
Citar            
MensajeEscrito el 09 May 2011 05:00 pm
Buenas gente, aca les dejo este Código que hice yo, no solo te redirije el movil sinó que tambien te devuelve una variable con la marca o el tipo

function sacarNavegador()
{
$lista = array(
'Android' => 'movil',
'MOT-' => 'movil',
'Palm' => 'movil',
'WindowsMobile' => 'movil',
'BlackBerry' => 'movil',
'Palm' => 'movil',
'iphone' => 'movil',
'Nokia' => 'movil',
'SonyEricsson' => 'movil',
'OperaMini' => 'app',
'Minimo' => 'app',
'AvantGo' =>'app',
'Plicker' =>'app',
'NetFront' =>'app',
'Firefox' => 'desk',
'MSIE' => 'desk',
'Lynx' => 'desk',
'Opera' => 'desk',
'Chrome' => 'desk',
'WebTV' => 'desk',
'Konqueror' => 'desk',
'Bot' => 'bot',
'Google' => 'bot',
'Slurp' => 'bot',
'Scooter' => 'bot',
'Spider' => 'bot',
'Infoseek' => 'bot');

$nav = $_SERVER['HTTP_USER_AGENT'];
foreach($lista as $browser => $class)
{
if(ereg($browser, $nav))
{
// Acá tu elijes, si quieres el Buscador o el tipo,
//return $browser
return $class;
}
else { return $_SERVER['HTTP_USER_AGENT']; }
}
} // function sacarNavegador();

espero les sirva, Suerte!

Por Roodaka

0 de clabLevel



Genero:Masculino  

Soy un Programador

chrome
Citar            
MensajeEscrito el 09 May 2011 07:03 pm
Pues vamos Ha probarlo, muchas gracias por el APORTE!!! :cool:

Por Sisco

BOFH

3700 de clabLevel

12 tutoriales
4 articulos

Genero:Masculino   Bastard Operators From Hell

Catalunya

firefox
Citar            
MensajeEscrito el 14 May 2011 03:41 pm
La ultima persona no aclaro si el código es para PHP, ASPX o que lenguaje? Ademas en que parte se inserta el código.
Gracias!

Por palillito87

0 de clabLevel



 

firefox
Citar            
MensajeEscrito el 16 Ago 2013 11:21 pm
Parece que es php pero la funcion ereg es obsoleta desde la version 5.3 de php.
Parece que no hay algo estandar tengan cuidado que algunos codigos que detectan moviles tambien le agregan las tablets cosa que varias veces en las tables queremos mostrar su version en escritorio debido a su tamaño.

mmm lo mas piola que encontre es esto

http://detectmobilebrowsers.com/


Son todos codigos de deteccion de moviles en todos lenguajes de programacien libre

Vean descarguen y prueben!

Por tinn

1 de clabLevel



 

chrome
Citar            
MensajeEscrito el 16 Ago 2013 11:56 pm
Todavia no se como editar mi respuesta, encontre un problema, Anda bien la detección de movil y el redireccionamiento

ahora la cuestión es como hacer para mostrar la versión de escritorio en mi sitio movil?
Ya que si hago un link hacia mi sitio el mismo detectaria otra vez que es un celular y me lo volveria a redireccionar.
:/ ya seguire investigando a ver que encuentro

Por tinn

1 de clabLevel



 

chrome
Citar            
MensajeEscrito el 04 Abr 2014 02:12 pm
no logro hacer que me redireccione a version web mobile si ingreso con mi tablet samsung tab 3 y sigue abriendo version flash de escritorio y si en los celu.
La web es www.empleadosdeedison.com

Estoy usando el script de js.........una ayuda por favor.
Graciasssss

Por kuky

50 de clabLevel



 

Argentina

chrome
Citar            
MensajeEscrito el 19 Ago 2015 12:59 am
Pues ahora con los sistemas responsive ya no existe este tipo de problemas, hasta existen plugings en wordpress para solucionar estos problemas

Por veronica2549

1 de clabLevel



Genero:Femenino  

chrome
Citar            
MensajeEscrito el 06 Oct 2015 04:33 pm
me parece bien la informacion, ya que es bastante importante y ayuda demaciado cuando necesitas comrciar y usar tu gina web como una tienda virtual, aun asi, hay algunos lugares buenos gratis/pagos, que ya tienen esa opcion integrada

saludos amigos



________________________________________________________________
trabajando para Julian Andres Hoyos Tellez

Por archerforero

9 de clabLevel



 

firefox
Citar            
MensajeEscrito el 15 Mar 2018 02:16 pm
Hola, amigos,

Según tengo entendido lo que más se lleva ahora es el estándar AMP. El propio Google ofrece todas las indicaciones para adaptar tu web a AMP y hacer que cargue mucho más rápido. Puedes ver más información en este post.

Por Willy87

0 de clabLevel



 

chrome

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.