Diseño receptivo versus diseño receptivo – Usabilidad web y seo

Diseño receptivo versus diseño receptivo

Vistas: 65
0 0
Tiempo de lectura:5 Minutos, 0 Segundos


Mudita Batagoda

Durante las últimas semanas, he realizado varias entrevistas con colegas para atraer nuevos diseñadores a la organización. Mientras escuchaba las preguntas y respuestas, seguí pensando en las maravillas tecnológicas que usamos estos días para brindar a los usuarios la mejor experiencia con los productos que desarrollamos. Diseñamos e implementamos productos para una variedad de dispositivos y tamaños de pantalla. Por lo general, hablamos de un enfoque centrado en los dispositivos móviles cuando trabajamos con aplicaciones web. Los desarrolladores de aplicaciones móviles deben servir a varios dispositivos al implementar interfaces de usuario. Comprender la diferencia entre diseño receptivo y receptivo ayudará a los diseñadores a planificar y ejecutar con mejores metas, objetivos y resultados.

Hablemos de lo básico

Diseño adaptativo

Recurso de imagen: https://www.lazerpics.com/website-design-and-hosting-in-newton-abbot-torquay-exeter-plymouth-totnes-paignton-ivybridge-dartmoor-south-devon-south-west-england /

El término diseño receptivo es una palabra de moda en la comunidad del diseño. La palabra “diseño receptivo” fue acuñada por primera vez en el libro “Diseño web receptivo” de Ethan Marcott. Un sitio web receptivo muestra contenido según el espacio disponible del navegador. El diseño receptivo reacciona a los cambios en el ancho del navegador y cambia la ubicación de los elementos de acuerdo con el espacio disponible. El contenido se moverá dinámicamente para encajar de manera óptima en la ventana del navegador. El diseño receptivo es simple. En pocas palabras, la capacidad de respuesta es fluida y se adapta al tamaño de la pantalla independientemente del dispositivo de destino. Responsive usa consultas de medios CSS para cambiar estilos según el dispositivo de destino, como el tipo de pantalla, el ancho, la altura, etc., y solo se necesita una de ellas para adaptar el sitio a diferentes pantallas.

Diseño adaptativo

Fuente de la imagen: https://www.atilus.com/responsive-vs-adaptive-web-design/

Adaptive es útil para actualizar un sitio existente y hacerlo más compatible con dispositivos móviles. El diseño receptivo permite a los diseñadores controlar el diseño y desarrollarlo para diferentes perspectivas. El diseñador puede seleccionar puntos de vista de acuerdo con las necesidades del usuario y los tipos de dispositivos que utilizan los grupos focales. Responsive Web Design fue introducido en 2011 por el diseñador web Aaron Gustafson en su libro Responsive Web Design: Building Rich Experience with Progressive Improvement. Esto también se conoce como mejora progresiva del sitio web.

El diseño receptivo se basa en cambiar la plantilla de diseño para que coincida con el espacio disponible; el diseño receptivo tiene varios tamaños de diseño fijos. Cuando el sitio detecta espacio, elige el diseño que mejor se adapta a la pantalla.

¿Qué elegir para su implementación?

Fuente de la imagen: https://public-media.interaction-design.org/images/uploads/46ac555d77d8ef5bcae83631f9e3b6a7.jpg

Es fácil trabajar con el diseño receptivo cuando se piensa en trabajar con diseño receptivo. Los diseñadores tienen menos trabajo administrando el diseño y tienen que escribir menos código para que funcione para el usuario. Actualmente es la práctica recomendada para los diseñadores.
Responsive no ofrece tanto control como responsive, pero requiere mucho menos trabajo tanto para construir como para mantener. Los diseños receptivos también son flexibles, y aunque los diseños receptivos pueden usar y utilizan porcentajes para dar una sensación más suave cuando se escalan, pueden volver a causar un salto cuando se cambia el tamaño de la ventana. Por ejemplo, en la imagen de abajo, que muestra un diseño flexible, el diseñador usa un ancho porcentual para hacer que la vista sea personalizable para cada usuario.

Adaptive es útil para actualizar un sitio existente y hacerlo más compatible con dispositivos móviles. Esto le permite controlar el diseño y desarrollar para múltiples vistas específicas. Por lo general, debe comenzar diseñando para una ventana gráfica de baja resolución y avanzar hacia arriba para asegurarse de que el diseño no se limite al contenido. Como se mencionó anteriormente, el diseño estándar es de seis resoluciones. Sin embargo, puede tomar una decisión más informada al revisar sus análisis web para los dispositivos más utilizados y luego diseñar para esas vistas.

Pros y contras del diseño receptivo frente al diseño receptivo (para llevar)

Diseño receptivo (pros)

  • Muchas plantillas para usar.
  • Optimizado para SEO.
  • Suele ser más fácil de implementar

Diseño receptivo (contras)

  • Menos control sobre el diseño de la pantalla.
  • Los elementos pueden moverse
  • Los anuncios se pierden en la pantalla.
  • Tiempos de descarga más largos desde el móvil.

Diseño receptivo (pros)

  • Los diseñadores tienen más control sobre UX para sus respectivos dispositivos.
  • En los dispositivos móviles, los dispositivos pueden determinar el entorno del usuario.
  • Los anuncios se pueden optimizar en función de los datos del usuario de dispositivos inteligentes.

Diseño receptivo (contras)

  • Se tarda más en construir
  • Los dispositivos cambian constantemente los tamaños de pantalla, lo que puede cambiar su diseño.
  • Difícil para la optimización de motores de búsqueda porque es difícil para los motores de búsqueda evaluar el mismo contenido en varios sitios.

Recursos

What Is The Difference Between An Adaptive Design And A Responsive Design?

https://www.uxpin.com/studio/blog/responsive-vs-adaptive-design-whats-best-choice-

Happy
Happy
0
Sad
Sad
0
Excited
Excited
0
Sleepy
Sleepy
0
Angry
Angry
0
Surprise
Surprise
0
Previous post Design Tokens 101. Los desarrolladores web lo codificaron todo
Next post Principales noticias de diseño de la semana: 11 de enero de 2021-17 de enero de 2021

Average Rating

5 Star
0%
4 Star
0%
3 Star
0%
2 Star
0%
1 Star
0%

Deja una respuesta