W3C logo
ONLINE TRAINING FOR
WEB DEVELOPERS
  • Home
  • W3C HTML5 Training

Diseño Web Adaptable

banner curso Responsive Web Design

El curso Diseño Web Adaptable del W3C te enseñará cómo utilizar el HTML y el CSS para que tu página web se adapte a cualquier tipo de dispositivo. No obstante, antes de adquirir estos conocimientos, necesitarás comprender qué es el diseño adaptable y cómo se puede crear un diseño web adaptable que funcione.

La estructura de este curso es gradual y presenta un orden lógico. Primero, harás algunas prácticas generales de codificación que, tal y como la experiencia nos ha demostrado, son de gran interés tanto para los principiantes como para los diseñadores web avanzados. Tras esto, trabajarás la etiqueta meta viewport y los media queries (módulo CSS) para conseguir una maquetación, navegación, tipografía, tablas, formularios, vídeos e imágenes adaptables. Así pues, como podemos comprobar, las buenas prácticas, la accesibilidad y la optimización desempeñarán un papel crucial en este curso.

La duración de este curso es de 5 semanas. Cada semana se irán activando nuevos capítulos, con sus correspondientes tareas, y tendrás la oportunidad de tratar temas relacionados con el temario tanto con el profesor como con el resto de tus compañeros en el foro de discusión. La última semana constará de una práctica final, un formulario de evaluación y un enlace con el certificado de finalización del curso y la acreditación digital.

Si le echas un vistazo a los apartados “¿A quién va dirigido?” y “¿Qué necesito?”, podrás obtener información sobre el tipo de público al que va destinado este curso y los prerrequisitos necesarios para inscribirse. El tiempo estimado de dedicación es de 6 a 8 horas por semana, si bien es cierto que algunos temas implicarán más trabajo que otros.

Esquema del curso

Si no sabes lo que es el HTML, CSS o las buenas prácticas, ¡no te preocupes! Desde el momento en el que te inscribas en este curso, tendrás acceso a todos los materiales necesarios para que puedas empezar a estudiar. De esta forma, aprovecharás este curso al máximo. Una vez te hayas familiarizado con esta información, podrás hacer la primera tarea del curso: “Adquirir buenos hábitos”.

Primera semana: etiqueta meta viewport, media query (módulo CSS) y cómo conseguir una maquetación adaptable

En esta primera semana trataremos diversas técnicas que te permitirán 1) utilizar la etiqueta meta viewport y 2) aplicar estilos diferentes dependiendo de la situación, así como la importancia que esto posee en una maquetación adaptable.

En esta tarea se te pedirá que crees un diseño adaptable.

Segunda semana: Navegación, tipografía e imágenes adaptables

Aquellas imágenes pequeñas que se adapten a las pantallas de los móviles se visualizarán correctamente en la pantalla del escritorio. Sin embargo, las imágenes grandes, preparadas para la pantalla del escritorio, no se ajustarán a las pantallas pequeñas. Por lo tanto, ¿cómo podemos crear un menú que se adapte al escritorio de una pantalla pequeña? ¿Cómo podemos encontrar el tamaño de la fuente, el ancho de la línea y la longitud apropiada para que el usuario pueda leer el texto independientemente de la anchura y la altura del dispositivo?

En esta tarea deberás retomar el trabajo que realizaste la primera semana.

Tercera semana: Tablas, formularios y vídeos adaptables

Las tablas, los formularios y los vídeos son otro aspecto a tener en cuenta en una maquetación adaptable. Por norma general, las tablas necesitarán un ancho concreto, independientemente de si éste está disponible o no. De igual modo, también debemos pensar en los formularios y los vídeos.

En esta tarea, deberás crear una tabla, un formulario y un video adaptable.

Cuarta semana: Optimización

En esta cuarta semana nos centraremos en las técnicas utilizadas para reducir tanto la carga de la red como el tiempo del procesador, lo cual aumentará enormemente la duración de la batería.

En esta semana, optimizarás tu tarea con las técnicas adquiridas.

Quinta semana: Práctica final

Terminaremos este curso con una práctica final y un formulario de evaluación en el que deberás aportar tu opinión sobre el curso.

¿Cómo puedo obtener el certificado de finalización del curso?

Este curso contiene dos tareas calificadas por el profesor y una práctica final que se han de completar satisfactoriamente para poder obtener tanto el certificado de finalización del curso como la acreditación digital*.

* ¿Qué es una acreditación digital? Una acreditación digital es una representación online de una habilidad que has adquirido. Gracias a las Acreditaciones Digitales de Mozilla, W3DevCampus emite acreditaciones oficiales con el sello de la identidad. De esta forma, los estudiantes pueden agrupar sus acreditaciones digitales y utilizarlas en: su currículum, página web, red social, portal de trabajo, etc. Crea tu propia mochila de acreditaciones y empieza a coleccionar acreditaciones digitales de los cursos del W3C.

¿A quién va dirigido?

  • Desarrolladores web y autores de contenido que buscan actualizar sus conocimientos
  • Diseñadores web con conocimientos básicos que deseen adquirir nuevas habilidades

¿Por qué merece la pena invertir tu tiempo en aprender diseño web adaptable?

  • Porque hoy día se utilizan dispositivos de diferentes tamaños para visualizar una página web.
  • Porque es un enfoque poderoso, fácil de aprender y rápido de escribir.

¿Qué necesito?

Además del equipo informático, deberías tener acceso a:

  • Un editor de texto (para HTML, CSS, Javascript).
  • Posibilidad de tener documentos online. Puedes utilizar cualquier servicio de alojamiento web. No obstante, si no pudieras disponer de un servidor, te recomendamos que utilices alguna compañía que ofrezca alojamiento web gratuito como, por ejemplo, x10hosting o Free Web Hosting Area. Estas cuentas, aunque presentan limitaciones, te permitirán completar el curso sin problema.

También es necesario estar familiarizado con:

  • HTML: ser capaz de crear un documento HTML, utilizar identificadores y clases, y otras tareas básicas.
  • CSS: para este curso es necesario estar familiarizado con CSS, si bien, no es necesario ser diseñador.
  • JavaScript: puesto que el curso se centra principalmente en el HTML y el CSS, no es realmente necesario tener conocimientos de JavaScript, ya que sólo lo añadirás a tu trabajo si quieres.

Términos y Condiciones

  • W3C ofrecerá el curso de acuerdo con la descripción publicada para la tarifa publicitada.
  • El pago debe hacerse en su totalidad en el momento de la inscripción.
  • El pago se realizará mediante tarjeta de crédito o una cuenta PayPal.
  • Los reembolsos sólo se realizarán si el participante se retira antes del inicio de la segunda semana del curso.
  • El material del curso se mantendrá disponible para los participantes registrados durante al menos 2 meses después de la finalización del curso.
  • Todo el material, incluyendo el producido por los participantes en las tareas, tiene o se considera con copyright y no se puede copiar, duplicar, publicar en otro sitio Web, o utilizar de cualquier otra manera sin el consentimiento del autor original. Las conversaciones y los mensajes enviados son privadas y no se pueden copiar, duplicar, enviados o transmitidos a terceros sin la autorización del autor original.