Guía 03

DAWM / Proyecto01

Actividades previas

Diseño

• Decide y diseña el contenido de su CV para incorporar un formulario. Algunas sugerencias de contenido, según Bard.
• Decide y diseña el contenido de su CV para incorporar una imagen o un video. Algunas sugerencias de contenido, según Bard.
• Decide y diseña el contenido de su CV para agregar un mapa. Algunas sugerencias de contenido, según Bard.

Contenido

En caso de necesitar contenido de relleno, utilice los siguientes sitios:

• Como texto de Lorem Ipsum, e
• Imágenes como marcadores de posición, en Placehold.

Actividades en clases

1. Clona localmente tu repositorio curriculum.
2. Modifica el archivo index.html del repositorio curriculum.
   • Organiza y agrega contenido a cada una de las secciones (etiquetas semánticas) de su CV mediante las etiquetas contenedoras <div>, <span>, <p>, <ul>, <ol>, <table> y <a>.

   Algunas sugerencias según Bard.

• Diseñe y modifique, o agregue, secciones (etiquetas semánticas) de su CV, que cuyo contenido sea formulario, multimedia (una imagen y un video) y un mapa.

  Consulta con ChatGPT o Bard por alguna recomendación para el uso de estas etiquetas en el contexto de su sitio.

1. (STOP 1) Compruebe el resultado en el navegador.
2. Versiona local y remotamente el repositorio curriculum.

Documentación

• HTML en la documentación de MDN.
  • Lista de atributos en W3Docs - HTML Attributes.
• Soporte para elementos HTML:
  • Formularios y sus elementos.
  • Imágenes y sus atributos.
  • Archivos videos en formato mp3 o enlaces a videos en Youtube.
  • Mapas en Google o Leaflet.

Fundamental

• Protocolo HTTP en X

HTTP 1.0 -> HTTP 1.1 -> HTTP 2.0 -> HTTP 3.0 (QUIC).

What problem does each generation of HTTP solve?

The diagram below illustrates the key features.

🔹HTTP 1.0 was finalized and fully documented in 1996. Every request to the same server requires a separate TCP connection.… pic.twitter.com/V9uSXv0tvn

— Alex Xu (@alexxubyte) August 18, 2023

• Inside look at modern web browser en Chrome Developer Network Parte 1, Parte 2, Parte 3 y Parte 4

Términos

etiquetas contenedores, multimedia, imagenes, videos, formulario

Referencias

• HTML: Lenguaje de etiquetas de hipertexto MDN. (2021). Retrieved 18 May 2022, from https://developer.mozilla.org/es/docs/Web/HTML HTML Standard. (2022). Retrieved 18 May 2022, from https://html.spec.whatwg.org/multipage/
• HTML5. Ejemplo de estructura global para página web con HTML5. (2022). Retrieved 18 May 2022, from http://www.edu4java.com/es/web/html5-estructura-global.html
• Conceptos básicos de HTML - Aprende sobre desarrollo web MDN. (2020). Retrieved 18 May 2022, from https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/HTML_basics
• Todos los ELEMENTOS SEMÁNTICOS de HTML. (2022). Retrieved 18 May 2022, from https://www.kikopalomares.com/blog/todos-los-elementos-semanticos-de-html
• HTML, E. (2022). Etiquetas HTML - Acerca de HTML. Retrieved 18 May 2022, from https://acercadehtml.com/etiquetas-html.html