http://steemitimages.com/DQmZZaDoW4zhHzbwDE391ZNq7Bp7fQp72CDY16raWwveDee/Imagen1.png #

Las siglas en ingles significan: **Hyper Text Markup Language**, es un lenguaje para modelar documentos.

Modela la forma en que los documentos, mediante etiquetas para mejorar el diseño en la que la página es presentado mediante los distintos navegadores (Google, Firefox, Chrome, Opera, etc).

Html no se usa sola debe estar acompañado de CCS que es una plantilla de estilo u hoja de cascada y Js que es la parte interactiva del sistema.

Ejemplo si pensamos en una casa, el Html seria la estructura de la casa, el CCS serian los colores de la casa y el Js le dará las funciones ejemplo agua, electricidad, etc.

Nosotros podemos poner los códigos en un block de imágenes y al pasarlos al navegador, este automaticamente descifrará los códigos colocados.

# # ¿Qué es una etiqueta? #

https://media.giphy.com/media/BLxPkYMprCih7x4m48/giphy.gif

Son los códigos que utilizamos para indicarle a la máquina la manera en la que deseamos que nos muestre el texto. Siempre van acompañados de paréntesis angulares y tienen un código de inicio y uno de cierre. Ambas etiquetas son iguales solo que la de cierre viene acompañada por una barra inclinada antes del escrito de la etiqueta.

# # Programando con el block de notas: #

Esto lo aprendí con las clases de Juan Vizcaino, ingeniero en sistema de Universia, en windows el editor de texto por defecto es el block de notas. También podemos usar Sublime Text 2 que podemos descargar en la página www.sublime text.com. Debemos seleccionar nuestro sistema operativo, funciona para linux también.

https://media.giphy.com/media/JIX9t2j0ZTN9S/giphy.gif

# Paso 1 #

* Abrimos el block de notas.

# # Paso 2 #

* Iniciamos con la etiqueta HTML (abrimos y cerramos)

https://media.giphy.com/media/GiXbMe92rt9NS/giphy.gif

# Paso 3 #

* Entre ambas etiquetas escribimos " Mi primera página Web"

https://media.giphy.com/media/IoP0PvbbSWGAM/giphy.gif

# Paso 4 #

* Le damos a guardar como: En el nombre del archivo colocamos **paginatexto.html** y en el tipo de archivo colocamos "todos los archivos"

https://media.giphy.com/media/wpoLqr5FT1sY0/giphy.gif

# Paso 5: #

Buscamos el documento que guardamos en escritorio, tenemos dos opciones:

1) Arrastrar el archivo hacia una pestaña del navegador. 2) Darle doble click al documento.

# # Paso 6: # #

Si hemos cumplido todos los pasos, nos abrirá nuestra primera página web.

# https://steemitimages.com/DQmccusEmtKdxAh9R2Q55dVbZK8ckW1RbhuShYNCYmoJDXY/html.jpg #

En los siguientes tutoriales aprenderemos más etiquetas para mejorar la diagramación de la misma.

# Fuente de imagenes [1](https://cdn.pixabay.com/photo/2018/04/30/08/08/business-3362079_960_720.jpg ) Fuente de gift [1](https://media.giphy.com/media/BLxPkYMprCih7x4m48/giphy.gif) [2](https://media.giphy.com/media/JIX9t2j0ZTN9S/giphy.gif) [3](https://media.giphy.com/media/GiXbMe92rt9NS/giphy.gif) [4](https://media.giphy.com/media/IoP0PvbbSWGAM/giphy.gif) [5](https://media.giphy.com/media/wpoLqr5FT1sY0/giphy.gif)