0% encontró este documento útil (0 votos)
28 vistas5 páginas

1 Laboratorio de Práctica 1

En este laboratorio de práctica, crearás una página web básica utilizando solo HTML. El objetivo es aplicar los conocimientos adquiridos sobre la estructura básica de un documento HTML y el uso de etiquetas HTML para crear contenido.

Cargado por

ingjorgepertuz1
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
0% encontró este documento útil (0 votos)
28 vistas5 páginas

1 Laboratorio de Práctica 1

En este laboratorio de práctica, crearás una página web básica utilizando solo HTML. El objetivo es aplicar los conocimientos adquiridos sobre la estructura básica de un documento HTML y el uso de etiquetas HTML para crear contenido.

Cargado por

ingjorgepertuz1
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
Está en la página 1/ 5

LABORATORIO DE PRÁCTICA: CREACIÓN DE UNA PÁGINA WEB BÁSICA CON HTML.

1 DESCRIPCIÓN DE LA ACTIVIDAD:

En este laboratorio de práctica, crearás una página web básica utilizando solo HTML. El

objetivo es aplicar los conocimientos adquiridos sobre la estructura básica de un documento

HTML y el uso de etiquetas HTML para crear contenido.

2 OBJETIVO:

Crear una página web simple utilizando HTML y Visual Studio Code.

2.1 OBJETIVOS ESPECÍFICOS:

• Organizar un proyecto web con una estructura de carpetas adecuada.

• Utilizar etiquetas HTML para estructurar el contenido de la página.

3 ¿QUÉ SE ESTÁ SOLICITANDO HACER AL APRENDIZ?

Se solicita al aprendiz realizar lo siguiente:


3.1 CONFIGURAR EL ENTORNO DE TRABAJO:

• Abrir Visual Studio Code.

• Crear un nuevo espacio de trabajo llamado "MiPrimerProyectoWeb".

• Dentro de este espacio de trabajo, crear una carpeta llamada "ProyectoWeb".

3.2 ESTRUCTURAR EL PROYECTO:

• Dentro de la carpeta "ProyectoWeb", crear las siguientes subcarpetas: "css",

"images", y "js".

• Crear un archivo HTML llamado "index.html" dentro de la carpeta "ProyectoWeb".

• Abrir el archivo "index.html" en Visual Studio Code.

3.3 ESCRIBIR LA ESTRUCTURA BÁSICA DE UN DOCUMENTO HTML:

• Abrir el archivo "index.html" en Visual Studio Code.

• Escribir la estructura básica de un documento HTML incluyendo las etiquetas

<html>, <head>, y <body>.

• Utilizar las etiquetas <meta charset="UTF-8"> y <title> para establecer la

codificación de caracteres y el título de la página respectivamente.

• Dentro del <body>, crear un encabezado (<h1>) con un mensaje de bienvenida

y un párrafo (<p>) con una breve descripción.


• Adicional crea una lista ordenada para mostrar las opciones:, quienes somos,

contacto.

3.4 VISUALIZACIÓN Y PRUEBAS:

• Guardar todos los cambios realizados.

• Abrir el archivo "index.html" en un navegador web para visualizar que la página

creada se asemeje lo más posible a la siguiente imagen.

• Verificar que la página se muestra correctamente y que el contenido está

estructurado de manera adecuada utilizando solo HTML, de lo contrario realiza los ajustes

según sea necesario para mejorar el diseño y el contenido de la página.


3.5 RECURSOS ADICIONALES:

Para esta actividad, se enfoca exclusivamente en el uso de HTML para crear una página

web básica. No se requieren conocimientos previos de CSS. Puedes utilizar las etiquetas HTML

aprendidas como <html>, <head>, <meta>, <title>, <body>, <h1>, <p>, <h2>, <ul>, <li>,

etc., para construir la estructura y contenido de la página web.

Esta actividad práctica te permitirá aplicar tus conocimientos sobre HTML y desarrollar

una comprensión básica sobre cómo crear y estructurar una página web utilizando solo

elementos HTML. ¡Disfruta explorando y creando tu primera página web con HTML!

3.6 EVIDENCIA A ENTREGAR:

Como aprendiz la evidencia a entregar consiste en un documento pdf que contenga las

imágenes de:

• Una imagen de la estructura básica del proyecto web (donde se visualice

correctamente las carpetas y subcarpetas que componen el proyecto).

• Una imagen del código fuente (html) de la página índex. Html creada con Visual

Studio Code.

• Una imagen de la página web abierta en el navegador que permita contemplar su

aspecto final.
3.7 RUTA POR ENTREGAR LA PRÁCTICA 1:

• Ingresó el curso aprender a programar.

• Dirigirse a la sección “trabajo en clase”.

• Ubique en la sección “estructura de proyecto web”.

• Presionar sobre “1 laboratorio de práctica 1”.

• Presionar sobre la opción “ver instrucción”.

• Presiones sobre la opción “agregar o crear”.

• Luego seleccione la opción “archivo”.

• Ubicado en la pestaña subir, elije la opción “explorar”. Navegue en su dispositivo

hasta encontrar el pdf con la solución de la actividad.

• Una vez haya la actividad y presionando sobre ella, ésta se carga y está lista para

entregar.

• Presione la opción “entregar”.

• Confirme nuevamente presionando la opción “entregar”.

También podría gustarte