Este curso te lleva en un viaje a través de las muchas facetas del diseño web responsivo moderno. Los primeros módulos te introducirán en la historia del diseño adaptable y en los fundamentos de los diseños adaptables. A partir de ahí, aprenderás sobre imágenes adaptativas, tipografía, accesibilidad y mucho más.
A lo largo del curso, descubrirás cómo hacer que los sitios web se adapten a las preferencias de los usuarios y a las capacidades de los dispositivos. Al final, también tendrás una idea de lo que puede deparar el futuro para el diseño adaptable.
Cada módulo cuenta con demostraciones y autoevaluaciones para que pongas a prueba tus conocimientos.
Este curso está dirigido a diseñadores y desarrolladores principiantes e intermedios. Una comprensión básica de HTML y CSS debería ser suficiente. No necesitas saber nada de JavaScript. Si eres completamente nuevo en la creación de sitios web, hay una introducción a HTML y otro curso para ayudarte a aprender CSS.
Esto es lo que aprenderás:
Introducción
Descubre el origen del diseño adaptable.
Consultas de medios
Adapta tus diseños a diferentes tamaños de pantalla utilizando CSS media queries.
Internacionalización
Prepara tus diseños para diferentes idiomas y modos de escritura.
Macropresentaciones
Diseñe composiciones de página utilizando una selección de técnicas CSS.
Micropresentaciones
Construya componentes flexibles que puedan colocarse en cualquier lugar.
Tipografía
Haz que tu texto sea legible y bonito, independientemente de dónde aparezca.
Imágenes adaptables
Ofrezca a sus visitantes las imágenes más adecuadas para sus dispositivos y pantallas.
El elemento imagen
Ejerza un mayor control creativo sobre sus imágenes.
Iconos
Utilice SVG para una iconografía adaptable.
Tematización
Adapte sus diseños a las preferencias del usuario, como el modo oscuro.
Accesibilidad
Asegúrese de que su sitio web está al alcance de todos.
Interacción
Prepare sus páginas para diferentes mecanismos de entrada: ratón, teclado y tacto.
Patrones de interfaz de usuario
Tenga en cuenta algunos elementos comunes de la interfaz de usuario que se adaptan a distintos tamaños de pantalla.
Funciones multimedia
Un resumen de todas las formas en que las funciones multimedia le permiten responder a dispositivos y preferencias.
Configuraciones de pantalla
Prepare su contenido para dispositivos con varias pantallas.
¿Qué es Responsive Design?
El diseño web responsive es un enfoque de diseño que se utiliza para asegurar que una página web se muestre correctamente en diferentes dispositivos y tamaños de pantalla. En lugar de crear una versión diferente de una página web para cada dispositivo, el diseño responsive utiliza un conjunto de técnicas de diseño que permiten que una única página web se adapte y se muestre de manera óptima en cualquier dispositivo.
Esto es importante porque cada vez son más las personas que acceden a internet desde dispositivos móviles, como smartphones y tablets, y es importante que una página web se muestre correctamente en estos dispositivos para que los usuarios puedan tener una buena experiencia al utilizarla. El diseño responsive también es beneficioso para los propietarios de sitios web, ya que les permite tener un solo conjunto de código en lugar de tener que mantener y actualizar varias versiones diferentes de una página web para diferentes dispositivos.
El diseño web responsive es beneficioso tanto para los usuarios como para los propietarios de sitios web. Los usuarios se benefician porque pueden acceder a una página web desde cualquier dispositivo y tener una experiencia de usuario óptima, independientemente del tamaño de la pantalla o la resolución del dispositivo. Esto puede mejorar su satisfacción al utilizar un sitio web y aumentar su tiempo de permanencia en él.
Los propietarios de sitios web también se benefician del diseño responsive, ya que pueden tener un solo conjunto de código para su página web en lugar de tener que mantener y actualizar varias versiones diferentes para diferentes dispositivos. Esto puede ahorrar tiempo y esfuerzo, y asegurar que todas las versiones de una página web se mantengan actualizadas y coherentes. Además, un diseño responsive puede mejorar la experiencia de usuario en un sitio web, lo que puede contribuir a aumentar el tráfico y las conversiones en el sitio.