En ocasiones, los creadores de páginas web pasan largas horas en la aplicación
de estilos hermosos a sus proyectos, los cuales son visualizados de forma
parcial por algunos usuarios, debido a la diversidad existente de teléfonos
inteligentes.
Por lo tanto, a fin de especificar estilo
independiente al dispositivo, describiremos el diseño web adaptable en el desarrollo de proyectos para internet, según
los requerimientos del programador.
Existen empresas con la posibilidad de invertir en
la creación de un diseño diferente para cada página web, a fin de mostrarse con excelencia en cualquier dispositivo y en
pantallas de diferentes tamaños. Sin embargo, en ocasiones los creadores de
páginas web se inclinan al uso del
enfoque llamado Responsive Web Design,
conocido en español como Diseño Web
Adaptable o Diseño Web Receptivo.
El enfoque anterior se refiere a crear un diseño
adaptable a diferentes tipos de pantallas, con la finalidad de favorecer la
lectura.
061-01_1402_ilu01.
Objetivo del diseño web adaptable
En el ejemplo de la imagen anterior, sería difícil
leer una página web en un teléfono
móvil, con el texto en dos columnas como la mostrada en la computadora.
El diseñador independiente, Ethan Marcotte, es el
pionero en el RWD. Él posee una página web
donde es posible estudiar todo su trabajo, tiene publicados varios libros y,
constantemente, ofrece talleres y conferencias donde explica sus propuestas de
diseño receptivo. Ha trabajado con grandes empresas como Google, Universidad de
Stanford, eBay, entre otros. Su lema es “crear diseños hermosos que funcionen
en todas partes”.
La importancia de utilizar el RWD radica en la cantidad
de usuarios con dispositivos móviles, la cual supera desde año 2016 al uso de
las computadoras. Por ende, es importante brindar al usuario el mismo contenido,
independientemente del dispositivo. Lo anterior se logra con la especificación
de diseño y se mantiene el marcado con el lenguaje HTML.
Por ejemplo, si tenemos una página con cuatro
columnas visualizadas en una computadora, la mayoría de los diseñadores web especifican para pantallas pequeñas
la presentación en una columna debajo de la otra, como aparece en la siguiente
ilustración:
061-01_1402_ilu02.
Enfoque del diseño web adaptable
La mayoría de los teléfonos inteligentes tienen una
configuración por defecto, en la cual modifican la presentación de una pantalla,
con la finalidad de mostrarla lo mejor posible al usuario, sin embargo, es
necesario hacer zoom para alcanzar a
leer todo el texto. Por ende, el sitio deja de ser amigable, sin aportar una
excelente experiencia para el usuario. Debido a ello, el diseño web receptivo es utilizado por los
creadores de páginas y llamado, en ocasiones, solo diseño web.
Keynotes
- Los creadores de páginas web
se inclinan al uso del enfoque llamado Responsive
Web Design, conocido en español como Diseño Web Adaptable o Diseño Web
Receptivo..
- El diseñador independiente, Ethan Marcotte, es el pionero en
el RWD. Él posee una página web donde
es posible estudiar todo su trabajo, tiene publicados varios libros y,
constantemente, ofrece talleres y conferencias donde explica sus propuestas de
diseño receptivo.
- La importancia de utilizar el RWD radica en la cantidad de
usuarios con dispositivos móviles, la cual supera desde año 2016 al uso de las
computadoras. Por ende, es importante brindar al usuario el mismo contenido,
independientemente del dispositivo.
MisiónCon la finalidad de especificar estilos
independientes del dispositivo, implementa el diseño web adaptable, en el desarrollo de proyectos para internet, según
los requerimientos del programador.
Pasos a seguir:
- Investiga en la página web oficial de CSS la especificación del
diseño web adaptable.
- Ivestiga en la página de Ethan
Marcotte sobre la especificación del diseño web
adaptable.
- Crea un proyecto con dos
especificaciones de RWD.
- Pide a un especialista en
la materia mediante vKonnect una
sugerencia para optimizar tu proyecto.
- Realiza las modificaciones
necesarias al resumen.
Sabrás que has tenido éxito cuando tu proyecto se
ejecute exitosamente en el navegador de preferencia.
Modifica el proyecto después de la sugerencia del
especialista, y comparte el resultado final en vPages.
Tiempo disponible: 3 horas.
CierreCon la descripción del diseño web adaptable en el desarrollo de proyectos para internet, según
los requerimientos del programador, hemos identificado el proceso a seguir para
asegurar la visualización correcta de nuestros proyectos por todo tipo de
usuarios. Además, especificamos estilos independientes del dispositivo. Con
organización y estudio constante aplicaremos el enfoque RWD con excelencia.
