Introducción a HTML
Introducción a HTML
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.
Etiquetas de texto
En una página web también puedes programar un formulario para obtener información de
los usuarios y, existen etiquetas para poder programarlos.
Etiquetas para la creación de formularios
Las tablas de contenido son un medio para organizar información en filas y columnas que
te permiten almacenar los datos de forma ordenada.
Etiquetas para la creación de tablas de contenido
Un documento HTML está delimitado por las etiquetas <html> y </html>. Dentro de este
documento, podemos asimismo distinguir dos partes principales:
1. El encabezado o cabecera, delimitado por <head> y </head> donde colocaremos
etiquetas de índole informativo como por ejemplo el título de la página.
2. El cuerpo, delimitado por las etiquetas <body> y </body>, que será donde
colocaremos el texto e imágenes delimitados a su vez por otras etiquetas.
A continuación se muestra un ejemplo sencillo de código HTML:
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.
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>
Comentarios
Publicar un comentario