Scribd
Cargar
4 vistas1 página

Practica HTML

El documento describe cómo crear una página de perfil profesional utilizando HTML con una estructura semántica adecuada. Incluye secciones para información personal, habilidades, multimedia, enlaces de navegación, y un formulario de contacto, así como pautas para verificar el funcionamiento de la página. Se enfatiza el uso de elementos como encabezados, listas, tablas, y multimedia para enriquecer el contenido.

Cargado por

Juan Pesantez
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
4 vistas1 página

Practica HTML

El documento describe cómo crear una página de perfil profesional utilizando HTML con una estructura semántica adecuada. Incluye secciones para información personal, habilidades, multimedia, enlaces de navegación, y un formulario de contacto, así como pautas para verificar el funcionamiento de la página. Se enfatiza el uso de elementos como encabezados, listas, tablas, y multimedia para enriquecer el contenido.

Cargado por

Juan Pesantez
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd

Ejercicio 2: Crear una Página para su perfil profesional

Objetivo:
Crear un perfil profesional con varias secciones usando las siguientes características:
 Estructura del documento correcta con <!DOCTYPE html>, etiquetas estructurales semánticas.
 Elementos de texto: usar encabezados, párrafos, citas, y formato.
 Enlaces: agregar enlaces internos (a secciones de la misma página) y externos.
 Multimedia: incluir imágenes, gráficos, y videos incrustados desde un iframe de YouTube.
 Listas: crear listas con información profesional o habilidades.
 Tablas: usar una tabla para mostrar detalles de contacto o habilidades técnicas.
 Formulario: incluir un formulario de contacto con varios tipos de elementos de entrada.
Estructura propuesta:
1. Encabezado (<header>):
 Título principal de la página con tu nombre.
 Un párrafo de introducción sobre quién eres.
2. Sección de Información Personal (<section>):
 Incluye tu descripción profesional usando párrafos y formato como <strong>, <em>, o <mark>.
 Añade una cita de alguien famoso que te inspire.
 Usa un bloque de código (etiqueta <code>) para mostrar una función sencilla en el lenguaje de
tu preferencia.
3. Sección de Habilidades (<section>):
 Usa una lista ordenada para mostrar tus habilidades principales.
 Usa una tabla para mostrar tus niveles de habilidad (por ejemplo, HTML5, CSS3, JavaScript) y
valoraciones.
4. Sección Multimedia (<section>):
 Inserta una imagen tuya o un gráfico representativo.
 Inserta un video de YouTube usando un iframe.
5. Enlaces (<nav>):
 Añade un menú de navegación con enlaces que dirijan a las diferentes secciones de la página
(Información, Habilidades, Multimedia).
 Incluye también enlaces externos a tus redes sociales.
6. Formulario de Contacto (<form>):
 Crea un formulario que incluya:
 Campos de entrada (<input>) para nombre, email.
 Una lista desplegable (<select>) para elegir el motivo del mensaje.
 Una caja de texto (<textarea>) para escribir el mensaje.
 Un botón de envío.
 Asegúrate de agregar atributos como required, placeholder, maxlength, etc.
7. Pie de página (<footer>):
 Información de derechos de autor y enlaces a tus redes sociales.
Verificar el Funcionamiento
1. Revisar el Contenido: Asegúrate de que todos los elementos (texto, imágenes, video, audio,
tablas) se muestren correctamente.
2. Probar los Enlaces: Si has incluido enlaces en tu contenido, haz clic en ellos para asegurarte de
que te lleven a la página correcta.
3. Verificar el código en el validador y corregir errores

También podría gustarte