Evaluación: Estructurando datos planetarios
En nuestra evaluación te proporcionamos datos sobre los planetas de nuestro sistema solar y tu los estructurarás en una tabla HTML.
| Requisitos previos: | Antes de comenzar esta evaluación deberías de haber leído los artículos de este módulo. |
|---|---|
| Objetivo: | Comprobar si has comprendido las tablas HTML y las características asociadas. |
Punto de incio
Para comenzar esta evaluación, crea una copia local de blank-template.html, minimal-table.css, y planets-data.txt en una nueva carpeta de tu ordenador.
Nota: Como alternativa, puedes usar una web como JSBin o Glitch para realizar tu evaluación. Puedes pegar el HTML, CSS y JavaScript en uno de estos editores online. Si el editor online que estas usando no tiene paneles separados para JavaScript/CSS, sientete libre de ponerlos en línea dentro del mismo HTML mediante el uso de <script>/<style>.
Resumen del proyecto
Estás trabajando en la escuela; tus estudiantes están estudiando los planetas de nuestro sistema solar y quieres proporcionarles una forma sencilla de seguir los datos para buscar hechos sobre los planetas. Una tabla HTML sería ideal — tienes que coger los datos que tienes disponibles y convertirlos en una tabla siguiendo los pasos de abajo.
La tabla finalizada debería de verse así:
También puedes ver el ejemplo aquí (no mires el código fuente — ¡no hagas trampas!)
Pasos para completarlo
Los siguientes pasos describen lo que necesitas para completar el ejemplo de la tabla. Todos los datos que necesitarás están en el archivo planets-data.txt. Si tienes problemas para visualizar los datos, mira el ejemplo de arriba o intentalo dibujando un diagrama.
- Abre tu copia de
blank-template.html, y comienza la tabla dándole un contenedor exterior, una cabecera y un cuerpo. No necesitas un pie de tabla en este ejemplo. - Añade el subtítulo proporcionado a tu tabla.
- Añade una línea a la cabecera que contenga todos los encabezados de columna.
- Crea todas las líneas con su contenido, asegurandote marcar como cabecera aquellas celdas que lo sean.
- Asegurate de que el contenido esta insertado en las celdas correctas — en los datos del .txt, cada línea del planeta esta al lado de su planeta asociado.
- Añade atributos para que las líneas y columnas del encabezado no se puedan confundir con las líneas, columnas o grupos de líneas a las que encabezan.
- Añade un borde negro alrededor de la columna que contiene los nombres de los planetas y sus encabezados.
Pistas y consejos
- La primera celda de la línea de enbezado tiene que estar en blanco y unir dos columnas.
- Los encabezados de la filas agrupadas (p. ej. Jovian planets) que están a la izquierda de los encabezados de nombres de planetas (p. ej. Saturn) son algo complicados de resolver — asegurate de que cada uno agrupa el número correcto de líneas y columnas
- Una manera de asociar encabezados con sus líneas/columnas es mucha más fácil que la otra.
Evaluación
Si estas siguiendo esta evaluación como parte de un curso organizado, deberías de ser capaz de entregar tu trabajo a tu profesor(a)/mentor para ver la puntuación. Si estas aprendiendo por tu cuenta, puedes obtener la guía de puntuación preguntando en Learning Area Discourse thread o en el canal IRC #mdn en Mozilla IRC. Intenta hacer el ejercicio primero — ¡haciendo trampas no aprenderás nada!