Introducción a HTML

 Hoy en día a través de las redes sociales puedes compartir con tus amigos tus fotos,

videos, pensamientos, así como conocer personas, encontrar contenido de todo tipo, todo

ello, gracias al Internet que vino a facilitar y darnos acceso a mucha información. Con la

llegada de los Smartphone ha sido aún más sencillo navegar en la red y encontrar sitios

web de cualquier tema de interés, pero ¿Alguna vez te has preguntado cómo se construyen

esos sitios web? En esta lección aprenderás cómo se construye un sitio web y sus

principales características.

Para empezar se debe planificar la estructura del sitio a través de un mapa general en el

que se definan algunas características como:

El objetivo del sitio web

Tipo de público al que va dirigido

Los contenidos que tendrá (secciones)

Estilo del sitio (colores, diseño)

Una vez que se termina el proceso de planeación, es momento de conocer el lenguaje que

se emplea para el desarrollo, construcción o escritura de sitios web, se llama HTML

(HyperText Markup Language), en español se traduce Lenguaje de Marcas de Hipertexto.

Este lenguaje está compuesto por una serie de instrucciones a las que se les denomina

etiquetas o marcas.

Todos los archivos HTML son sólo texto, así que se necesita un editor de texto, aplicación

o programa que permita escribir texto plano sin agregar ningún formato específico, por

ejemplo un bloc de notas.

el mouse sobre dicho archivo, dar clic con el botón derecho y seleccionar la opción abrir),

es el navegador el que interpreta y da forma en la pantalla para que el usuario pueda ver

lo que se ha diseñado.

El lenguaje HTML permite crear muchos elementos y hacer dinámico y atractivo un sitio

web, todos los elementos que imagines se establecen a través de etiquetas o líneas de

escritura y existen etiquetas para insertar imágenes, figuras, para agregar colores de

fondo o color de la fuente, para insertar tablas y formularios, para crear listas, y para

hipervínculos que nos permiten dirigirnos a otras páginas, entre otros. Es el lenguaje HTML

el que permite crear páginas web, darles estructura y contenido. Existen diferentes tipos

de etiquetas que se utilizan para crear un sitio web.

Es muy cómodo navegar por internet de una página a otra en busca de la información que

te interese. Generalmente, las páginas suelen ser muy atractivas en cuanto a su diseño,

colores, las imágenes que muestran pero hay un trabajo de programación detrás de ellas.

Vas a conocer cómo se ven desde su escritura siguiendo el procedimiento que se muestra

a continuación:

1. Entra a internet desde un equipo de cómputo.

2. Busca una página de tu interés.

3. Presionar Ctrl+U y observa cómo se abre una pestaña con el código fuente HTML.

Distribución gratuita-Prohibida su venta

33

4. Observa el código y localiza las etiquetas que se utilizan. Trata de identificar las

que revisaste en esta lección.

También hay otra forma más rápida consiste en hacer clic con el botón derecho del ratón

en cualquier punto del área donde el navegador muestra la página web y elegir «Ver código

fuente de la página».

Aparte de poder ver el código fuente HTML de una página web con las opciones antes

descritas, Internet Explorer, Firefox y Google Chrome tienen también unas herramientas

conocidas como inspectores de página que se pueden activar con F12. Con estas

herramientas es posible visualizar una página web y seleccionar dentro de ella un

elemento concreto del cual queremos conocer cuál es el código HTML con el que está

hecho señalando el elemento en cuestión simplemente con el ratón. Al hacer esto, el

código se mostrará en un área especial dentro del navegador en el que el usuario podrá

ver el código HTML en cuestión, además, de las reglas CSS que aplican a ese código HTML

en concreto. Este tipo de análisis resulta sumamente instructivo para aprender a

desarrollar en HTML.

Ahora que has visto el código HTML de una página web realizarás una práctica sencilla.

1. Abre el bloc de notas de tu computadora. Se que encuentras en el Menú Inicio >

Programas > Accesorios >Bloc de notas.

2. Una vez que tengas abierto el bloc de notas escribe cuidadosamente las siguientes

etiquetas:

Etiqueta de apertura de documento HTML: <html>

Etiquetas de apertura y cierre del encabezado: <head> y </head>

Etiquetas de apertura y cierre del cuerpo: <body> y </body>

Etiqueta de cierre de documento HTML </html>

3. Encabezado. Escribe cuidadosamente entre las etiquetas de apertura y cierre del

encabezado las siguientes etiquetas y texto para crear el tema principal:

<h4>

HTML es un lenguaje que se utiliza para el desarrollo de páginas de Internet

</h4>

4. Cuerpo. Escribe cuidadosamente entre las etiquetas de apertura y cierre del cuerpo

las siguientes etiquetas y texto para crear el tema principal, como se muestra.

<body b

<p><b>BIENVENIDOS</b></p>

<p>- Un curso donde será una manera práctica de aprender -</b>.</p>

<p>La excelencia no es un acto, es un hábito (Aristóteles)</p>

<h4>

Datos del ceador

</h4>

Escribe aquí tu nombre<br>

WhatsApp: Escribe aquí tu número telefónico<br>

email: Escribe aquí tu email<br>

</body>