¿Por qué no debería considerarse el diseño web "receptivo"?


9

Esto puede parecer más una pregunta de diseño gráfico que una pregunta de programación, pero creo que tiene mucho más mérito técnico / de programación que el diseño gráfico real.

El concepto de diseño web "receptivo" gira en torno al uso de consultas de medios en CSS3 para detectar el tamaño del dispositivo de visualización y ajustar las reglas de CSS en consecuencia, esencialmente, CSS dinámico. Esto llena el vacío en muchos casos de implementación, en particular para dispositivos móviles.

Creo que el uso de consultas de medios está surgiendo lentamente (descubrí que muchas personas realmente no lo saben), pero me pregunto si hay una razón para una adopción lenta. ¿No es práctico para aplicaciones web? ¿Hay algo que me falta que podría ser una trampa fundamental?


2
Mucha gente es simplemente ignorante y no aprende nuevos métodos.
Raynos

@Raynos, ¡pero aprender es muy divertido!
Nic

1
¿Es porque las velocidades de Internet aumentan a medida que pasa el tiempo y la capacidad de respuesta ya no es un problema real, y el esfuerzo ya no está justificado? ¡Puede estar equivocado, porque esta idea parece genial!
WinW

1
Migrar a webmasters.SE?
Peter Taylor

Respuestas:


9

Tienes que saltar a través de los aros para que realmente funcione. Para un sitio que estoy desarrollando, solía @media (max-width:800px)definir una hoja de estilo para teléfonos y otras pantallas más pequeñas. Pero no estaba siendo utilizado por, por ejemplo, iPhone.

Resulta que los desarrolladores del navegador del teléfono asumen que las personas no tendrán en cuenta las pantallas pequeñas, por lo que mienten al motor de renderizado (iPhone afirma tener más de 900 píxeles de ancho, por ejemplo) a menos que coloque una metaetiqueta adicional para decirle que no mentir. Cuando llegas al punto de que estás luchando contra los implementadores del navegador, comienzas a preguntarte si vale la pena el esfuerzo.


Entonces, tanto Zurb Foundation como Twitter Bootstrap manejan esto bastante bien. Requiere un poco de JavaScript para manejar la conmutación bajo demanda. También hay configuraciones de DPI, etc. El uso de esos marcos CSS hace que sea realmente fácil. O al menos partes de ellos.
Berin Loritsch

Vale la pena señalar que esta pregunta y respuesta son de hace 6 años y pueden no reflejar las tasas actuales de adopción.
Peter Taylor

Oh, lo siento. Fue en la alimentación principal ayer por alguna razón. No pensé en verificar la fecha.
Berin Loritsch

4

No puedo hablar por todos, pero desde mi propia experiencia el tiempo y el dinero han sido el factor decisivo. Mis colegas y yo siempre estamos viendo las últimas novedades, pero diseñar e implementar diferentes diseños para dispositivos de diferentes tamaños es un gran problema. Especialmente teniendo en cuenta que en mi Nokia 5800 de 3 años, todos nuestros sitios web se ven bien, barra que tengo que desplazar para obtener el contenido de la barra lateral. Diseñamos e implementamos sitios web para pequeñas empresas y personas autónomas.

Otra razón que puede ser válida es que sirve un sitio web completamente separado para las versiones móviles, con su propio mapa del sitio ( http://www.google.com/support/webmasters/bin/answer.py?hl=es&answer=34648 ), es una forma fácil y básica de mantener el sitio.


Bueno, creo que definitivamente es difícil introducir un diseño receptivo en un sitio que se implementa a mitad de ciclo, pero creo que sería mucho más fácil implementar algo como esto en lugar de tener un subdominio móvil completamente diferente. Afortunadamente, Rails está abstrayendo esta tarea un poco con plantillas heredadas.
Nic

Bueno, debo agregar que en nuestro caso el cliente realmente subcontrató la versión móvil a un competidor :( Yo personalmente iría con plantillas en lugar de un sitio diferente también.
Pelshoff

2

Si puede garantizar la recuperación confiable de los datos, está todo bien.

Pero imagine que alguien carga una página web en un navegador con ventana de una computadora de escritorio. ¿Los obliga a abrir la pantalla completa para leer todo, o acomoda el tamaño de la ventana reducida y presenta mucho espacio en blanco a medida que lo maximizan? ¡Sirve el CSS una vez, al cargar la página!

¿Qué pasa con un navegador de teléfono que cambia los modos horizontal / vertical mientras gira el teléfono? ¿Qué pasa con un navegador que simplemente tiene una resolución demasiado pequeña y la gente normalmente usa el zoom, pero ya se ha adaptado a la resolución demasiado pequeña informada y la página se vuelve ilegible?

Simplemente siga las pautas estándar de hacer un CSS escalable universal y decente y deje que el navegador maneje escalar la página a la resolución correcta.


99
Hay una nueva característica en CSS3 que permite reglas dinámicas para diferentes tamaños de pantalla, que cambian automáticamente.
Steffan Donal

@Ruirize Exactamente: use CSS estático que tenga reglas que adapten el contenido dinámicamente, está bien. Solicite CSS generado dinámicamente que tenga reglas que establezcan estáticamente el contenido para el tamaño de su pantalla, no.
SF.

2
El OP habla sobre el uso de consultas de medios, que ajustan dinámicamente las cosas según (entre otras cosas) el tamaño de la pantalla. No hay archivos adicionales cargados.
Travis Northcutt

1
@SF .: intente cambiar el tamaño de una ventana de Google Calendar (el nuevo tema rojo, no el antiguo azul), es espeluznante cómo lo manejan.
Lie Ryan

2
@SF: La publicación original hablaba de consultas de medios, no de diferentes CSS basados ​​en encabezados o w / e.
Pewpewarrows
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.