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?