Curso HTML

Qué es HTML

Una página web puede estar desarrollada por muchísimas tecnologías y multitud de lenguajes, sin embargo, la base de todos los sitios web es HTML. El HTML es un lenguaje de marcado o etiquetado, no es un lenguaje de programación, no confundas este concepto. En el HTML de nuestro sitio web podemos añadir imágenes, vídeos, textos y toda la estructura de nuestro sitio web, para dar estilos y dejar bonito nuestro sitio web utilizaremos CSS.

Para trabajar con HTML necesitaremos un navegador web (Google Chrome o Mozilla Firefox), en estos navegadores iremos cargando nuestros sitio web e iremos viendo su evolución y además necesitaremos un programa para codificar nuestro código HTML (Notepad ++ o Sublime Text).

¿Qué es una etiqueta HTML?

Todo el código HTML está formado por etiquetas, una etiqueta es cualquier código que está codificado de la siguiente forma: <etiqueta> </etiqueta>, encontraremos multitud de etiquetas y cada etiqueta cumplirá una función determinada, tenemos etiquetas para párrafos, etiquetas para vídeos etc.

Además estas etiquetas podrán tener ciertos atributos y modificarán el comportamiento de la etiqueta principal.

<etiqueta atributo=”valor”>Aquí el texto</etiqueta>

De esta forma podremos modificar el comportamiento de cada una de las etiquetas.

Estructura HTML

La estructura principal de cualquier web en HTML tendrá que ser la siguiente:


<!DOCTYPE html>

<html lang=”es”>

<head>

<title>Aquí el título de la web</title>

</head>

<body>

<h1>Encabezado 1</h1>

<h2>Encabezado 2</h2>

<h2>Encabezado 3</h2>

</body>

<footer>

</footer>

</html>

 

Etiquetas para textos

Dentro del body de nuestro sitio web podemos añadir algunas etiquetas para textos, la etiqueta más utilizada es la del párrafo y la del salto de línea.

<p>Esto es un párrafo</p>

<p>Esto es un otro párrafo</p>

<p>Esto es el tercer párrafo</p>

Si queremos hacer un salto de línea, es común utilizar la etiqueta <br/>, si quisiéramos hacer un salto de línea con una línea pintada utilizaríamos la etiqueta <hr/>.

La etiqueta strong nos permitirá añadir texto en negrita, <strong>todo el texto de dentro de la etiqueta será en negrita</strong>. También podríamos mencionar la etiqueta em, esta etiqueta nos permitirá añadir texto en cursiva <em>el texto de dentro estará en cursiva</em> y la etiqueta span, esta etiqueta propiamente no tiene ninguna funcionalidad <span>esto será texto dentro del span</span>, a esta etiqueta le podríamos añadir un identificar y una clase, por ejemplo <span id=”identificador1″ class=”esto es una classe”>aquí el texto dentro del span</span>, posteriormente podríamos maquetar el texto que encontramos dentro de la etiqueta span a través del CSS.

Listas

Imágenes

Tablas

Formularios