Profesor: Roy García Gaitán Grado: 10° Asignatura: Tecnología e informática Periodo: 4

Datos de contacto:
WhatsApp: 3203202911
Correo electrónico: roygarcia2911@gmail.com
INDICACIONES
Las actividades deben ser entregadas el 6 de noviembre del 2020, vía correo electrónico o WhatsApp.
Sólo enviar las actividades y soluciones.

GUÍA DE TRABAJO
FUNDAMENTOS DE HTML
Glosario:
Estándar. Es un documento que provee los requisitos, especificaciones, guías, o características que
pueden ser usadas en forma consistente para asegurar que las materias primas, productos, procesos,
y servicios cumplan con su propósito1.
W3C. El Consorcio World Wide Web (W3C) es una comunidad internacional donde las organizaciones
Miembro, personal a tiempo completo y el público en general trabajan conjuntamente para desarrollar
estándares Web2.
CSS. en español «Hojas de estilo en cascada», es un lenguaje de diseño gráfico para definir y crear
la presentación de un documento estructurado escrito en un lenguaje de marcado 3.
Página web. Son páginas electrónicas que contienen recursos multimedia como son imágenes, texto,
audios, videos, entre otros y pueden dar acceso a otras páginas web, mediante hipervínculos, las
páginas están codificadas en HTML.
Lenguaje de marcado. Un lenguaje de marcado o lenguaje de marcas es una forma de codificar un
documento que, junto con el texto, incorpora etiquetas o marcas que contienen información adicional
acerca de la estructura del texto o su presentación4.
Extensión. Una extensión de navegador es un pequeño módulo de software para personalizar un
navegador web5.
Extensión de archivo. La extensión de un archivo es la parte de su nombre que indica de qué tipo es.
El nombre completo de cualquier archivo consta siempre de dos partes separadas por un punto (por
ejemplo "Windows.exe" o "recetas.doc"). Lo que está a la izquierda del punto es el nombre en sí del
archivo. Lo que está a la derecha es su extensión6.

1
Definición tomada de http://www.btlconsulting.net/estandar.php
2
Definición tomada de https://www.w3c.es/Consorcio/
3
Definición tomada https://es.wikipedia.org/wiki/Hoja_de_estilos_en_cascada
4
Definición tomada de https://es.wikipedia.org/wiki/Lenguaje_de_marcado
5
Definición tomada de https://es.wikipedia.org/wiki/Extensi%C3%B3n_de_navegador
6
Definición tomada de https://elcomoputo.blogspot.com/2019/09/extension-de-archivos.html
HTML
Es un lenguaje de marcado que define el contenido de la página web (texto, imágenes, video, tablas,
entre otros) y hasta cierto punto el estilo de la página, color de letra, tipo de fuente, fondo, etc., pero
dar el estilo a la página con las etiquetas del HTML, se desaconseja, pues este no fue planeado para
esta función, para el manejo de estilos se aconseja usar CSS.
Una página web se crea con un código HTML, escrito en un archivo de texto plano, que al ser guardado
debe llevar la extensión .html o .htm. El software que se puede usar para crear y modificar un archivo
de texto plano se denomina editor de texto, un ejemplo de este tipo de software es el bloc de notas.
El archivo de texto sólo contendrá texto, por eso otro tipo de contenido como imágenes o videos,
deberán ser referenciados en el código HTML, ya es cuestión del software que visualiza la página, por
lo general un navegador web, el unir todos los componentes para ser mostrado al usuario.

Breve historia
En 1989 Tim Berners Lee describió el protocolo de transferencias de hipertextos, que dio lugar a la
primera web que utilizaba HTML (Lenguaje de Marcas de Hipertexto), HTTP (Protocolo de
transferencia de hipertexto) y un navegador web. Este sistema fue implementado en el CERN
(Organización Europea para la Investigación Nuclear) y en 1991 fue abierto al público, pero fue hasta
1995 que IETF (Internet Engineering Task Force), publica el estándar HTML 2.0, siendo este el primer
estándar oficial.
En 1997, W3C (World Wide Web Consortium), publica el estándar 3.2, a partir de ese año sería este
el encargado de publicar las nuevas versiones de HTML.
En 1999 se publica la versión 4.01 de HTML.
En 2007 el W3C, comenzó a trabajar en la actualización del estándar HTML 4.01.
En 2014 W3C, libero el HTML 5 como estándar oficial, esta versión incorpora nuevas etiquetas, por
ejemplo, para trabajar audio y video de forma directa, sin necesidad de complementos(plugin) en los
navegadores. Desde esa fecha el W3C ha trabajado para la mejora del estándar HTML 5.

Etiqueta
La etiqueta son fragmentos de código que forman parte de un elemento.
Las partes de una etiqueta son:
< indica el inicio de la etiqueta
Nombre. Letra o palabra que identifica la etiqueta.
Atributos. puede o no tener ninguno, estos son valores adicionales que permiten ajustar el
comportamiento de un elemento. El atributo está compuesto por un nombre y valor.
> indica el cierre de la etiqueta.
Ejemplo de etiqueta:

Atributo

Inicio de la etiqueta Fin de la

etiqueta

< p id=”parrafo1”>

Nombre del
Valor del Atributo
Nombre de la etiqueta Atributo

Esta es la etiqueta de párrafo, el uso de atributo en esta etiqueta es opcional, es decir, sin él no hay
inconvenientes en el código.

Elemento
Es el componente básico del lenguaje HTML, normalmente está compuesto por una etiqueta de
apertura y otra de cierre y un contenido que esta entre las etiquetas de apertura y cierre.
Ejemplo de elemento con etiqueta de apertura y de cierre

Etiqueta de apertura Etiqueta de cierre

<p> texto del párrafo</p>

Contenido

Nota: la etiqueta de cierre tiene la estructura parecida a la de apertura, pero con el símbolo / antes del
Nombre de la etiqueta. En este caso no se usó un atributo. También hay que aclarar que el atributo
sólo puede ir en la etiqueta de cierre.

Estructura básica de una página web

Para la creación de una página web, se necesitan 3 elementos:

<html> …</html> Define un documento html

<head> … </head> Contiene la información o referencias que no son contenido de la página web,
como puede ser el título de la página que aparecerá en la pestaña del navegador, el llamado a un
archivo de hoja de estilo, etc.
<body>…</body> Contiene el contenido de que será mostrado al usuario, texto, imágenes, videos,
tablas, etc.

Ejemplo de código HTML de una página web simple:

El resultado en un navegador es: Título de la página web, el cual es el

contenido del elemento <title> </title>

Texto, el cual es el contenido del

elemento <p> </p>

Se empleo el elemento < br />, el cual es un salto de línea y es sólo una etiqueta sin atributos y sin
contenido.
Se empleo el elemento <title> </title>, el cual pone el título a la página web.
Resumen de los elementos vistos en la guía:
Elemento Función
<html> </html> Define un documento HTML
Contiene la información o referencias que no
son contenido de la página web, como puede
<head> </head> ser el título de la página que aparecerá en la
pestaña del navegador, el llamado a un archivo
de hoja de estilo, etc.
<title> </title> Pone el título a la página web.
Se emplea para escribir los párrafos de la
<p> </p>
página web.
<br/> Se emplea para un salto de línea.

Actividades
Con base en la información de la guía conteste las siguientes preguntas:
1. ¿Cuál es el año en el que se publica el primer estándar oficial de HTML?
2. ¿Para qué sirve HTML?
3. ¿Qué es una etiqueta?
4. ¿Qué es un elemento?
5. Mencione los elementos mínimos para la creación de una página web.
6. ¿cómo se denomina al software que permite la creación y edición de un archivo plano con
extensión .html?

Con los elementos aprendidos en la guía, escriba en su cuaderno el código HTML necesario, para que
un navegador web muestre: