¿Cuál es el tamaño de pantalla ideal para diseñar un sitio web para computadoras de escritorio, tabletas o dispositivos móviles? ¿Qué 2-3 formatos cubren lo mejor para todo el dominio?

Answer 1

Utiliza un diseño receptivo. Ya no existe un formato universal único. Más y más tamaños de pantalla están llegando y ya es hora de que pienses en un diseño receptivo.

Así es como se construye nuestro sitio http://smartvectorpics.com/.
Puede abrirlo en una computadora de pantalla grande o en un teléfono móvil de pantalla pequeña o abrirlo en una tableta. Los elementos en la pantalla se ajustan automáticamente.

Vea abajo.

Así es como se ve en una pantalla normal de computadora portátil / computadora

El mismo sitio se ve a continuación en un dispositivo móvil . Las opciones como Acerca de, Blog, Contacto, Licencia, etc., se ajustan automáticamente (ver en la imagen a continuación)

Además, cuando un sitio es compatible con dispositivos móviles (receptivo), verá un pequeño texto “Compatible con dispositivos móviles” cuando Google muestre el sitio. Por ejemplo, cuando hace clic en https://www.google.com/search?q=…

Verá a continuación nuestro sitio http://smartvectorpics.com que se muestra como compatible con dispositivos móviles

Muy importante (para ganar más dinero)
Otra ventaja de que un sitio sea amigable para dispositivos móviles es que cuando implementa Adsense (anuncios de Google), en realidad puede mantener un bloque de anuncios receptivo que se ajusta automáticamente según el tamaño de la pantalla, lo que le da más dinero en anuncios.

Hay varias compañías que obtuvieron miles de dólares simplemente haciendo que su sitio responda.

Actualización de Google a partir del 21 de abril de 2015 La Búsqueda de Google ampliará su uso de la compatibilidad móvil como señal de clasificación.

Answer 2

Use un diseño receptivo, como han dicho los demás. Yo agregaría esto: iniciar mobile-first y agregar puntos de interrupción donde se rompe el diseño: ¿Todos los dispositivos móviles / tabletas con menos consultas de medios? – CSS-Trucos.

Diseñe con fuentes web en el navegador: Typecast es una herramienta que puede ayudar con esto. El año pasado, recibió un rediseño para admitir un enfoque de diseño más móvil primero: tipo y diseño móvil primero – Typecast.

Answer 3

Sí, consulte el desarrollo de interfaz de usuario sensible; dependiendo del tipo de aplicación que esté desarrollando (basada en la web o .net XAML, etc.) hay diferentes bibliotecas dedicadas a asegurarse de que su GUI se ajuste a cualquier tamaño de ventana.

Answer 4

No pienses más en términos estáticos. “Responsive” es tu nueva regla de diseño.