Foros del Web » Programando para Internet » PHP »

Página web en dos versiones para móviles e Internet.

Estas en el tema de Página web en dos versiones para móviles e Internet. en el foro de PHP en Foros del Web. Buenos Días. Quiero hacer una página web en dos versiones, una para que vea correctamente en Internet, y la otra para que se vea en ...
  #1 (permalink)  
Antiguo 11/07/2015, 01:37
 
Fecha de Ingreso: junio-2008
Ubicación: Madrid
Mensajes: 374
Antigüedad: 15 años, 10 meses
Puntos: 1
Página web en dos versiones para móviles e Internet.

Buenos Días.

Quiero hacer una página web en dos versiones, una para que vea correctamente en Internet, y la otra para que se vea en móviles, pad, ect...

Tengo este código que es el index.php

Código PHP:
<?php
$navigator_user_agent 
= (isset($_SERVER['HTTP_USER_AGENT'])) ? strtolower($_SERVER['HTTP_USER_AGENT']):'';
if(
stristr($navigator_user_agent"iphone")or
stristr($navigator_user_agent"ipad")or
stristr($navigator_user_agent"kindle")or
stristr($navigator_user_agent"android")

{
header("Location: mobile/index.html");
}
?>
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="robots" content="index, follow">
<meta name="robots" content="all" />
<meta name="language" content="es" />
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0" />
<title>Documento sin título</title>
<link href="recursos/css/style.css" rel="stylesheet" type="text/css">
<link href="recursos/css/mobile.css" rel="stylesheet" type="text/css" media="handheld" />
</head>
<script type="text/javascript">
//<![CDATA[
if((navigator.userAgent.match(/MSIE/i)) || (navigator.userAgent.match(/Chrome/i)) || (navigator.userAgent.match(/Firefox/i))) {
document.write('<style type="text/css" media="screen">#header{font-family:Verdana;font-size:16px;width:90%;}</style>');    
}
//]]>
</script>
<link rel="stylesheet" media="(max-width: 800px)" href="recursos/css/mobile.css"" />

<!-- CSS media query within a style sheet -->
<style>
@media (max-width: 600px) {
  .facet_sidebar {
    display: none;
  }
}
</style>
<style>

img{max-width:100%;}

@media handheld
body{width:98%;font-family:Verdana;font-size:44px;} 



</style>
<body>
<?php include 'encabezado.php'?>
<?php 
include 'botonera.php'?>
<div id="contenedor"/>

<div id="contenidoPrincipal" class="contenido_color"> 
CONTENIDO</div>



<?php include 'pie.php'?>
</div><¡-- cierre del contenedor -->
</body>
</html>
Y la otra versión es otro código index.html en otra ruta especificada llamada mobile/index.html

Código HTML:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="robots" content="index, follow">
<meta name="robots" content="all" />
<meta name="language" content="es" />
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0" />
<title>Documento sin título</title>
<link href="recursos/css/style.css" rel="stylesheet" type="text/css">
<link href="recursos/css/mobile.css" rel="stylesheet" type="text/css" media="handheld" />
</head>
<body>
<div id="contenedor"/>moiles android
<div id="contenidoPrincipal" class="contenido_color"> 
CONTENIDO</div>
</body>
</html> 
Me funciona correctamente, pero no quiero que se vea el enlace de la ruta especificada ejemplo/mobile/index.html, esta ruta se ve en el móvil.

¿Como oculto que no se vea esa ruta en la barra de direcciones de los móviles, pad, y ect?

¿Esto te puede penalizar Google por contenido duplicado?
__________________
Cada día se aprende algo nuevo
  #2 (permalink)  
Antiguo 11/07/2015, 07:22
Avatar de chronos682  
Fecha de Ingreso: febrero-2004
Ubicación: Tunja - Boyacá - Colombia
Mensajes: 627
Antigüedad: 20 años, 2 meses
Puntos: 69
Respuesta: Página web en dos versiones para móviles e Internet.

Puedes utilizar RewriteRule para hacer URL amigables, respecto a Google no creo porque es una página que está dentro del mismo dominio y subdominio que la original entonces la toma como si fuera parte de la misma web.
__________________
Si te gustó la respuesta dale +1

HERNÁN G. SIABATO M.
[email protected]
  #3 (permalink)  
Antiguo 11/07/2015, 07:29
Avatar de chronos682  
Fecha de Ingreso: febrero-2004
Ubicación: Tunja - Boyacá - Colombia
Mensajes: 627
Antigüedad: 20 años, 2 meses
Puntos: 69
Respuesta: Página web en dos versiones para móviles e Internet.

Otra opción que se me ocurre es que utilices frames y tengas en la página index principal el frame al cual navegues hacia la página movil o hacia la otra, así quedaría siempre la misma dirección, el problema sería ver si los móviles soportan frames en sus navegadores.
__________________
Si te gustó la respuesta dale +1

HERNÁN G. SIABATO M.
[email protected]
  #4 (permalink)  
Antiguo 11/07/2015, 07:46
Avatar de TIExpert  
Fecha de Ingreso: mayo-2015
Ubicación: Venezuela
Mensajes: 167
Antigüedad: 8 años, 11 meses
Puntos: 17
Respuesta: Página web en dos versiones para móviles e Internet.

Hola.

Porque no usas algún framework que ya sea responsive. Ej. Bootstrap o Materialize.

En el siguiente link: www.aprendiendoando.com hay unos buenos tutoriales de ambos.

Espero haberte ayudado. Si te gusto la respuesta vota positivo.

Saludos
__________________
Mas de 20 años de experiencia en soporte de plataforma TI para empresas.
  #5 (permalink)  
Antiguo 11/07/2015, 09:47
 
Fecha de Ingreso: junio-2008
Ubicación: Madrid
Mensajes: 374
Antigüedad: 15 años, 10 meses
Puntos: 1
Respuesta: Página web en dos versiones para móviles e Internet.

Me podrías indicar cual me funcionaria para este código, porque he probado un montón de ellos y no me funcionan ninguno correctamente.

Cita:
Iniciado por chronos682 Ver Mensaje
Puedes utilizar RewriteRule para hacer URL amigables, respecto a Google no creo porque es una página que está dentro del mismo dominio y subdominio que la original entonces la toma como si fuera parte de la misma web.
__________________
Cada día se aprende algo nuevo
  #6 (permalink)  
Antiguo 11/07/2015, 11:55
Avatar de chronos682  
Fecha de Ingreso: febrero-2004
Ubicación: Tunja - Boyacá - Colombia
Mensajes: 627
Antigüedad: 20 años, 2 meses
Puntos: 69
Respuesta: Página web en dos versiones para móviles e Internet.

Tendrías que investigar en internet si los navegadores de los celulares permiten el uso de una u otra y dependiendo de eso elegir, porque ambas se ajustarían a tus necesidades pero dependería de los sistemas donde se va a implementar.
__________________
Si te gustó la respuesta dale +1

HERNÁN G. SIABATO M.
[email protected]
  #7 (permalink)  
Antiguo 11/07/2015, 14:23
Avatar de TIExpert  
Fecha de Ingreso: mayo-2015
Ubicación: Venezuela
Mensajes: 167
Antigüedad: 8 años, 11 meses
Puntos: 17
Respuesta: Página web en dos versiones para móviles e Internet.

Hola.

No entiendo el código. ¿Para que hacer dos webs si usando un framework puedes hacer un sitio responsive?

Creo que estas trabajando de más, a menos que yo no este viendo algo.

Saludos
__________________
Mas de 20 años de experiencia en soporte de plataforma TI para empresas.
  #8 (permalink)  
Antiguo 12/07/2015, 00:06
 
Fecha de Ingreso: junio-2008
Ubicación: Madrid
Mensajes: 374
Antigüedad: 15 años, 10 meses
Puntos: 1
Respuesta: Página web en dos versiones para móviles e Internet.

He estado viendo videos tutoriales, pero tiene un problema que la estructurar de una página web en el ordenador tiene un tamaño muy mayor a diferencia de los móviles, que opinas?

Cita:
Iniciado por TIExpert Ver Mensaje
Hola.

No entiendo el código. ¿Para que hacer dos webs si usando un framework puedes hacer un sitio responsive?

Creo que estas trabajando de más, a menos que yo no este viendo algo.

Saludos
__________________
Cada día se aprende algo nuevo

Última edición por TIFORO; 12/07/2015 a las 02:00
  #9 (permalink)  
Antiguo 12/07/2015, 13:02
Avatar de Luismaster2000  
Fecha de Ingreso: junio-2011
Ubicación: Orizaba, Ver.
Mensajes: 499
Antigüedad: 12 años, 10 meses
Puntos: 31
Respuesta: Página web en dos versiones para móviles e Internet.

Usa mobiledetect es una libreria de php

Código PHP:
Ver original
  1. if(pc)
  2. {
  3.  codigo para pc
  4. }
  5. if(movil)
  6. {
  7.  codigo para movil
  8. }

y no tienes que usar mas que includes
  #10 (permalink)  
Antiguo 13/07/2015, 01:55
Avatar de lauser
Moderator Unix/Linux
 
Fecha de Ingreso: julio-2013
Ubicación: Odessa (Ukrania)
Mensajes: 3.278
Antigüedad: 10 años, 8 meses
Puntos: 401
Respuesta: Página web en dos versiones para móviles e Internet.

Te pongo un ejemplo que tal vez te sirva de orientación, para quitar palabras de la url mediante htaccess.
Código :
Ver original
  1. http://www.tuweb.com/mobile/index.html/
  2. a
  3. http://www.tuweb.com/index.html/


Código Apache:
Ver original
  1. RewriteRule ^mobile/(.+)$ http://www.tuweb.com/index.html/$1 [R=301,L]
__________________
Los usuarios que te responden, lo hacen altruistamente y sin ánimo de lucro con el único fin de ayudarte. Se paciente y agradecido.
-SOLOLINUX-
  #11 (permalink)  
Antiguo 13/07/2015, 07:58
Avatar de TIExpert  
Fecha de Ingreso: mayo-2015
Ubicación: Venezuela
Mensajes: 167
Antigüedad: 8 años, 11 meses
Puntos: 17
Respuesta: Página web en dos versiones para móviles e Internet.

Hola.

Cita:
He estado viendo videos tutoriales, pero tiene un problema que la estructurar de una página web en el ordenador tiene un tamaño muy mayor a diferencia de los móviles, que opinas?
Eso es justamente el problema que resuelve un framework responsive, el ajusta las imágenes, los menúes y todo de acuerdo a el tamaño del dispositivo en el cual se esta visualizando.

Mira este link:
http://getbootstrap.com/css/

Además, puedes hacer pruebas con las herramientas de los navegadores para ver como se vería tu página en las diferentes resoluciones.

También recuerda que actualmente casi todo el mundo tiene como mínimo 800x450 (teléfono 4"), lo cual es suficiente para hacer algo atractivo en un móvil. Lo mejor es que no tienes que preocuparte por escribir doble código.

Espero haberte ayudado, si te gusto la respuesta vota positivo.

Saludos
__________________
Mas de 20 años de experiencia en soporte de plataforma TI para empresas.
  #12 (permalink)  
Antiguo 28/07/2015, 09:39
 
Fecha de Ingreso: junio-2008
Ubicación: Madrid
Mensajes: 374
Antigüedad: 15 años, 10 meses
Puntos: 1
Respuesta: Página web en dos versiones para móviles e Internet.

Perdonar por la demora, estuve intentado hacerlo con Dreamweaver porque iba hacer una página web, pero tiene mucho curro, hacer una página estática, creo que ya no merece la pena.

Admito opiniones....

Cita:
Iniciado por TIExpert Ver Mensaje
Hola.



Eso es justamente el problema que resuelve un framework responsive, el ajusta las imágenes, los menúes y todo de acuerdo a el tamaño del dispositivo en el cual se esta visualizando.

Mira este link:
http://getbootstrap.com/css/

Además, puedes hacer pruebas con las herramientas de los navegadores para ver como se vería tu página en las diferentes resoluciones.

También recuerda que actualmente casi todo el mundo tiene como mínimo 800x450 (teléfono 4"), lo cual es suficiente para hacer algo atractivo en un móvil. Lo mejor es que no tienes que preocuparte por escribir doble código.

Espero haberte ayudado, si te gusto la respuesta vota positivo.

Saludos
__________________
Cada día se aprende algo nuevo
  #13 (permalink)  
Antiguo 28/07/2015, 09:54
Avatar de xfxstudios  
Fecha de Ingreso: junio-2015
Ubicación: Valencia - Venezuela
Mensajes: 2.448
Antigüedad: 8 años, 9 meses
Puntos: 263
Respuesta: Página web en dos versiones para móviles e Internet.

bootstrap es excelente para ello y tiene una infinidad de plantillas en linea, puedes iniciar por alli
__________________
[email protected]
HITCEL

Etiquetas: html, página, versiones
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 18:32.