Foros del Web » Creando para Internet » HTML »

[SOLUCIONADO] Web aparece de forma extraña en móviles

Estas en el tema de Web aparece de forma extraña en móviles en el foro de HTML en Foros del Web. Hola a todos, resulta que mi página web tiene un ancho de 850 px y cuando se muestra en dispositivos móviles aparece con franjas negras ...
  #1 (permalink)  
Antiguo 05/09/2014, 15:44
Avatar de Luisa29  
Fecha de Ingreso: enero-2013
Mensajes: 193
Antigüedad: 9 años, 10 meses
Puntos: 4
Pregunta Web aparece de forma extraña en móviles

Hola a todos, resulta que mi página web tiene un ancho de 850 px y cuando se muestra en dispositivos móviles aparece con franjas negras a los lados.
Pues bien, he intentado usar esta meta tag para que ocupe la pantalla completa en los dispositivos:

Código:
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
El problema es que nada más abrir la web en el dispositivo móvil se muestra ampliada por defecto y sólo se ve una esquina. Pero al hacer el gesto típico de pellizco la web se coloca en su sitio, sin franjas negras a los lados, es decir, perfecta.

¿Por qué no se muestra así desde el principio? ¿por qué al abrir la web sólo se muestra esa porción de la esquina ampliada?

A ver si es cosa de esa meta que he de añadir algo más, ¿alguien me echa una mano?


EDITO:

Aquí un chico con el mismo problema en Stackoverflow (no solucionado):

http://stackoverflow.com/questions/2...to-have-effect





Aquí su web, sigue sin solucionarlo, lo he mirado en mi móvil y su web tiene el mismo problema que la mía:

http://litvin.co.nf/viewport_index.html

No logro encontrar la solución, ese chico tampoco. ¿Podéis echarme una mano?

Última edición por Luisa29; 05/09/2014 a las 16:01
  #2 (permalink)  
Antiguo 05/09/2014, 22:53
 
Fecha de Ingreso: julio-2014
Mensajes: 179
Antigüedad: 8 años, 4 meses
Puntos: 26
Respuesta: Web aparece de forma extraña en móviles

Cuales franjas negras yo no las vi

Bueno, básicamente es por que tu web no esta diseñada para este tipo de resoluciones!

Es, por así decirlo, si yo trato de meter una hoja tamaño tabloide a un porta retratos es obvio que en dado caso veré sólo una parte del tabloide, lo mismo esta pasando en los dispositivos, tu web debe estar diseñada con un ancho mayor a los 800px por esta razón alguno de los usuarios del link que dejaste dice que en width=device-width lo cambie por el ancho de su sitio, que en ese caso es de 800px

Si te interesa que se vea el contenido perfectamente lee un poco de media queris en css esto hará que tu diseño se ajuste al ancho del dispositivo con el que se esta visualizando tu sitio web.

El tema de que se vea esa esquina del lado izquierdo es cuestion del navegador, seguramente se coloca ahí por que en ese punto es donde se encuentra la coordenada 0.

Si dije alguna estupidez que alguien me corrija pero en general esas son mis observaciones, espero te sirvan.

Saludos
__________________
Si haces las cosas como nadie las ha hecho, cobralas bien, si las vas a hacer como todos las han hecho, cobralas bien!!
MecanizandoWeb.com
  #3 (permalink)  
Antiguo 06/09/2014, 08:23
Avatar de Luisa29  
Fecha de Ingreso: enero-2013
Mensajes: 193
Antigüedad: 9 años, 10 meses
Puntos: 4
Respuesta: Web aparece de forma extraña en móviles

Gracias por contestar DesgraciadoGabo, resulta chocante pero he logrado solucionarlo, no sé si se verá bien en los demás dispositivos.

de esta forma, poniendo esto así: initial-scale=-1.0

A ver si me podéis decir si esto está bien o mal.
  #4 (permalink)  
Antiguo 06/09/2014, 08:55
 
Fecha de Ingreso: julio-2014
Mensajes: 179
Antigüedad: 8 años, 4 meses
Puntos: 26
Respuesta: Web aparece de forma extraña en móviles

Esta bien si cumple tu necesidad, lo mejor es diseñar un sitio que se ajuste segun la resolucion del dispositivo.

Lo digo principalmente por que en el caso de tu sitio con un smartphone, el que sea, tendrás que hacer zoom en el texto para poder leerlo, en el caso de un diseño adaptativo tu sitio web se verá sin necesidad de hacer zoom, tal vez esta imagen ilustre un poco lo que te comento:


Eso se hace con media queris @media screen and (max-width:anchopx) y la cosa es ir modificando tus estilos segun el ancho por el que vas enfocado ya sea el de una tablet, un smartphone u otra resolucion.

Espero no haberte confundido, pero si no te queda muy claro puedes googlear un poco acerca de media queris, Saludos!!!
__________________
Si haces las cosas como nadie las ha hecho, cobralas bien, si las vas a hacer como todos las han hecho, cobralas bien!!
MecanizandoWeb.com
  #5 (permalink)  
Antiguo 06/09/2014, 11:15
Avatar de Luisa29  
Fecha de Ingreso: enero-2013
Mensajes: 193
Antigüedad: 9 años, 10 meses
Puntos: 4
Respuesta: Web aparece de forma extraña en móviles

Cita:
Iniciado por DesgraciadoGabo Ver Mensaje
Esta bien si cumple tu necesidad, lo mejor es diseñar un sitio que se ajuste segun la resolucion del dispositivo.

Lo digo principalmente por que en el caso de tu sitio con un smartphone, el que sea, tendrás que hacer zoom en el texto para poder leerlo, en el caso de un diseño adaptativo tu sitio web se verá sin necesidad de hacer zoom, tal vez esta imagen ilustre un poco lo que te comento:


Eso se hace con media queris @media screen and (max-width:anchopx) y la cosa es ir modificando tus estilos segun el ancho por el que vas enfocado ya sea el de una tablet, un smartphone u otra resolucion.

Espero no haberte confundido, pero si no te queda muy claro puedes googlear un poco acerca de media queris, Saludos!!!
Muchas gracias Gabo, pero prefiero que se vea tal y como realicé la web. Es un tanto complejo todo.
De todas formas yo incluso a su tamaño puedo leerla perfectamente, además de poder hacer zoom cuando quiera si hay algo que vea muy pequeño.

Etiquetas: extraña, forma, página, todo
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 00:48.