Ejercicio Técnico 1 - HTML & CSS

Creación de Páginas Web y Formularios con diferentes técnicas de CSS

Objetivo

El objetivo de este ejercicio técnico es crear una serie de páginas web y formularios, inicialmente sin utilizar ningún framework CSS y luego realizar lo mismo pero con Bootstrap 5 y luego con Tailwind CSS.

Descripción

Se desea desarrollar una serie de páginas web y formularios web que permitan a los usuarios visualizar listados de elementos (a elección) y formularios que incluyan los campos para agregar o editar elementos del listado. Las páginas y formularios deben ser responsive!

Requerimientos Técnicos

  1. Crear una carpeta para cada tipo de ejercicio: listado y formulario.
  2. Dentro de cada carpeta, crear tres subcarpetas con los siguientes nombres específicos que indiquen la tecnología utilizadas: html_css, bootstrap, y tailwindcss.
  3. Utilizar inicialmente, únicamente HTML y CSS, y luego re-crear las páginas pero esta vez con Bootstrap 5 y luego Tailwind CSS, para aplicar estilos y diseñar la apariencia de las páginas web y los formularios.
  4. Utilizar etiquetas semánticamente apropiadas en el HTML para cada página web y formulario.
  5. Aplicar estilos de los frameworks CSS para mejorar la legibilidad y la presentación de las páginas web y los formularios.

Criterios de Evaluación

  • Correcta estructura de carpetas y archivos que refleje la organización de los ejercicios.
  • Uso efectivo de los HTML y CSS, incluyendo los frameworks para diseñar interfaces de usuario atractivas y funcionales.
  • Presentación clara y ordenada de las páginas web y los formularios.
  • Cumplimiento de los requisitos técnicos especificados en el enunciado.
  • Creatividad en la presentación visual y la interactividad de las páginas web y los formularios.

Entregables

  1. Crear un nuevo repositorio público utilizando como template este repositorio (iaw-2024/ejercicio-tecnico-1-html-css). El nombre del repositorio debe ser <usuario-github>-1-html-css y debe estar dentro de la organización iaw-2024.
  2. Crear una rama o branch denominado entrega y realizar los ejercicios en esa rama o branch.
  3. Configurar GitHub pages sobre ese branch entrega, para que los ejercicios queden disponibles en la web.
  4. Crear un Pull Request del branch entrega al branch main con un link en la descripción del Pull Request a la página web pública.
  5. El branch entrega debe contener:
    1. Una carpeta listado que contenga tres subcarpetas: html_css, bootstrap, y tailwindcss, cada una con el archivo HTML correspondiente.
    2. una carpeta formulario que contenga tres subcarpetas: html_css, bootstrap, y tailwindcss, cada una con el archivo HTML correspondiente.
    3. archivo CSS con los estilos aplicados a la página web, incluyendo la barra de navegación, donde correspondan.
    4. Es posible que no se requiere un archivo CSS adicional cuando se utilicen los frameworks CSS, los cuales se integrarán directamente en los archivos HTML.

Notas Adicionales

  • Se recomienda utilizar las funcionalidades y componentes proporcionados por los frameworks CSS (cuando corresponda) de manera creativa para diseñar interfaces de usuario atractivas y funcionales.
  • Se sugiere probar las páginas web y los formularios en diferentes navegadores y dispositivos para asegurar la compatibilidad y la correcta visualización del contenido.