Software y servicios de internet mapa conceptual.pdf
QUÉ ES EL DISEÑO RESPONSIVO.docx
1. ¿QUÉ ES EL DISEÑO RESPONSIVO?
Diseño web Responsivo (RWD) es un enfoque de desarrollo web que
crea cambios dinámicos a la aparición de un sitio web, dependiendo del
tamaño y la orientación del dispositivo que se utiliza para poder verla.
RWD es la solución de diseñar para la multitud de dispositivos
disponibles actualmente, que van desde diminutos teléfonos a los
monitores de escritorio enormes .
RWD utiliza los llamados puntos de corte para determinar cómo
aparecerá el diseño de un sitio:
Uno diseño se utiliza por encima de un punto de ruptura y otro de diseño
se aplica por debajo de ese punto de ruptura. Los puntos de corte se
basan comúnmente en la anchura del navegador.
2. Este breve video muestra el Transporte de respuesta para el sitio web de
Londres cambiando a medida que la ventana del navegador se estrecha
y se amplia.
La misma HTML sirve a todos los dispositivos, utilizando CSS (que
determina el diseño de la página web) para cambiar la apariencia de la
página. En lugar de crear un sitio separado y una base de código
correspondiente para monitores de pantalla ancha, computadoras de
escritorio, computadoras portátiles, tabletas y teléfonos de todos los
tamaños, una única base de código puede ayudar a los usuarios con
ventanas de diferentes tamaños.
En el diseño de responsivo los elementos de la página ejm. como la
ventana, crece o se reduce. Un diseño de escritorio de tres columnas de
podrá reorganizar a dos columnas para una tableta y una sola columna
para un teléfono inteligente. El diseño responsivo se basa en proporción
a reorganizar contenido y elementos de diseño.
3. Si bien el diseño responsivo surgió como una forma de ofrecer igualdad
de acceso a la información sin importar el dispositivo, también es posible
ocultar ciertos elementos – tales como imágenes de fondo, como en el
transporte, por ejemplo, por encima de Londres, la página secundaria o
complementaria de navegación – en las pantallas más pequeñas. Las
decisiones sobre el contenido y la funcionalidad ocultar o alterar la
apariencia de diferentes tipos de dispositivos, debe estar basada en el
conocimiento acerca de sus usuarios y necesidades.
RWD tiene ventajas potenciales sobre el desarrollo de sitios para los
diferentes tipos de dispositivos. El uso de un solo código base puede
hacer el desarrollo más rápido, en comparación con el desarrollo de 3 o 4
sitios distintos, y facilita el mantenimiento,RWD es a prueba del futuro, ya
que puede soportar nuevos puntos de corte en cualquier momento. Si un
dispositivo de 5 pulgadas o un dispositivo de 15 pulgadas sale al
mercado, el código se puede agregar a los nuevos dispositivos. RWD no
ata el diseño a un dispositivo en particular.
CREACIÓN DE EXPERIENCIAS UTILIZABLES
Debido a que el diseño responsivo se basa en encajar elementos
alrededor de la página, que el diseño y el desarrollo que tenga trabajen
en estrecha colaboración para asegurar una experiencia utilizable a
través de dispositivos.El diseño responsivo a menudo se convierte en la
solución a un rompecabezas – cómo reorganizar los elementos en las
páginas de mayor tamaño para adaptarse a uno más angosto, las
páginas más alargadas o viceversa. Sin embargo, lo que garantiza que
los elementos encajen dentro de una página no es suficiente. Para un
diseño responsivo exitoso, el diseño también debe ser utilizable en todas
las resoluciones de pantallas y tamaños.
Cuando los elementos se mueven alrededor de la página, la experiencia
del usuario puede ser completamente diferente de una vista de la página
a la siguiente. Lo importante de que los equipos de diseño y desarrollo
trabajen juntos no es determinar hasta qué punto el contenido debe estar
4. arrastrando los pies alrededor, sino ver también lo que el resultado final
de ese cambio se parece y cómo afecta a la experiencia del usuario.
Muchos equipos buscan framewoks sensibles al diseño responsivo,
como Bootstrap para ayudar a crear diseños. Estos marcos pueden ser
de gran ayuda en el desarrollo del movimiento a lo largo. Sin embargo,
considere cuidadosamente cómo el framework trabajará con el contenido
y la funcionalidad de su sitio, en lugar de cómo funciona en general.
Nosotros siempre recomendamos la realización de las pruebas de
utilidad en los diseños. Para los diseños sensibles, se recomienda la
prueba en todas las plataformas. Ya es bastante difícil de diseñar un sitio
web que se puede utilizar en un escritorio, pero es aún más difícil de
diseñar un sitio web que se puede utilizar en muchos reordenamientos o
configuraciones de sus elementos, a través de diversos tamaños de
pantalla y orientaciones. El mismo elemento de diseño que puede
funcionar a las mil maravillas en un escritorio puede trabajar
horriblemente en un teléfono inteligente, o viceversa.
CENTRÁNDOSE EN EL CONTENIDO
Priorización de contenido es un aspecto clave para hacer bien el diseño
responsivo. Mucho más contenido es visible sin necesidad de
desplazarse en un monitor de escritorio grande que en una pequeña
pantalla del teléfono inteligente. Si los usuarios no ven al instante lo que
quieren en un monitor de escritorio, se puede echar un vistazo fácilmente
alrededor de la página para descubrirlo. En un teléfono inteligente, los
usuarios pueden tener que desplazarse sin cesar para descubrir el
contenido de interés. El priorizar inteligentemente el contenido ayuda a
los usuarios a encontrar lo que necesitan de manera más eficiente.
RENDIMIENTO CONSIDERADO
[mpc_sh_side_image align=»left» hor_offset=»0″ ver_offset=»0″
image=»http://asd.mx/2015/wp-
content/uploads/2014/10/responsive300x400.gif»] Rendimiento también
puede ser un problema con el diseño responsivo. RWD ofrece el mismo
5. código para todos los dispositivos, independientemente de si la pieza de
código se aplica al diseño o no. Los cambios en el diseño se producen en
el lado del cliente, es decir, cada dispositivo – el teléfono, tablet o
computadora – recibe el código completo para todos los dispositivos y
toma lo que necesita.
Un teléfono inteligente de 4 pulgadas recibe el mismo código como un
monitor de escritorio de 24 pulgadas. Esto puede empantanar el
rendimiento en un teléfono inteligente, lo que puede ser un partido
basado en una conexión de datos más lento. (Esto es por qué algunos
sitios recurren a diseño adaptativo, en el que el servidor que aloja la
página web detecta el dispositivo que hace la solicitud y entrega
diferentes lotes de código HTML basadas en ese dispositivo.)
Para evaluar verdaderamente la experiencia del usuario de un diseño
responsivo, la prueba es que sus diseños no responden sólo en la
comodidad de su propia oficina, en su conexión de alta velocidad, debe
también aventurarse con su smartphone- entre edificios altos en una
ciudad, en salas de conferencias interiores o sótanos, en áreas remotas
con conectividad irregular, en puntos problemáticos conocidos para la
conexión a la red de su propio teléfono celular – y ver cómo su sitio se
presenta en condiciones variadas. El objetivo de muchos diseños
responsivos es dar facilidades equivalentes de acceso a la información
sin importar el dispositivo. Un usuario de smartphone no tiene una
experiencia equivalente a un usuario de escritorio si los tiempos de
descarga son intolerables.
CONCLUSIÓN
Diseño responsivo es una herramienta, no una panacea. El diseño
responsivo tiene muchas ventajas en todos los dispositivos. Los equipos
deben centrarse en los detalles del contenido, diseño, y el rendimiento
con el fin de apoyar a los usuarios en todos los dispositivos.
Para más información sobre el diseño de diferentes dispositivos, consulte
nuestra página web www.asd.m