¿Qué es HTML?

HTML, sigla en inglés de HyperText Markup Language (lenguaje de marcas de hipertexto), hace referencia al lenguaje de marcado para la elaboración de páginas web. Define una estructura básica y un código para la creación de contenido en estas. Se considera el lenguaje web más importante, siendo su invención crucial en la aparición y desarrollo de la World Wide Web (WWW).

Basa su desarrollo en la diferenciación. Para añadir un elemento externo a la página, no se incrusta en el código, sino que se hace una referencia a la ubicación de dicho elemento. Así, la página web contiene solamente texto mientras que recae en el navegador web la tarea de unir todos los elementos y visualizar la página final. Busca ser un lenguaje que permita que cualquier página web pueda ser interpretada de la misma forma por cualquier navegador web actualizado.

A lo largo de sus versiones se han ido incorporado y suprimido diversas características. Para interpretar correctamente una nueva versión, los desarrolladores deben incorporar estos cambios y el usuario debe usar la nueva versión del navegador. Un navegador desactualizado no será capaz de interpretar correctamente una página web escrita en una versión superior a la que pueda interpretar. Así mismo, las páginas escritas en una versión anterior deberían ser actualizadas o reescritas, lo que no siempre se cumple. Por ello, ciertos navegadores todavía mantienen la capacidad de interpretar páginas web de versiones HTML anteriores.

Marcadores HTML

El HTML se escribe en forma de «etiquetas», rodeadas por corchetes angulares (/,>). Puede describir la apariencia de un documento e incluir un tipo de programa llamado script. Consta de varios componentes: elementos, atributos, tipos de data y la declaración de tipo de documento.

Códigos básicos de HTML

< html >: Inicio del documento, le indica al navegador que lo siguiente debe ser interpretado como código HTML. Aunque en teoría lo que define el tipo de documento es el DOCTYPE.

< head >: Define la cabecera del documento HTML; a suele contener información que no se muestra directamente al usuario como, por ejemplo, el título de la ventana del navegador.

< body >: Define el contenido principal o cuerpo del documento. Esta es la parte que se muestra en el navegador; dentro pueden definirse propiedades comunes a toda la página.

Dentro del cuerpo body es posible encontrar numerosas etiquetas. Por ejemplo:

< h1 > a < h6 >: Encabezados o títulos del documento con diferente relevancia.

< a >: Hipervínculo o enlace. Debe definirse el enlace mediante href.

< img >: Incluye una imagen. Requiere del atributo src, que indica la ruta en la que se encuentra la imagen.

< li >, < ol > y < ul >: Etiquetas para listas.

< strong >: Texto en negrita.

< em >: Texto en cursiva.

< del >: Texto tachado.

< u >: Texto subrayado.

¿Qué es CSS?

CSS (Cascading Stylesheets: Hojas de estilo en cascada). Es un lenguaje de diseño gráfico con el que podemos definir y crear la presentación de un documento escrito en un lenguaje de marcas, como HTML.Podemos establecer el diseño visual de las páginas web.

CSS está diseñado para marcar la separación del contenido del documento y la forma en la que este está presentado, incluyendo colores y tipos de fuentes. Podemos conseguir que varios documentos HTML compartan un mismo estilo usando una sola hoja de estilos separada en un archivo .css , reduciendo así la complejidad y la repetición de código.

CSS está creado en diferentes niveles. La primera especificación fue CSS1 (1996), siendo la primera recomendada por el World Wide Web Consortium. El Nivel 2 de CSS necesitó 9 años, desde Agosto de 2002 hasta Junio de 2011, para alcanzar el estado de Recomendación. Esto fué debido al hecho de que algunas características secundarias fueron retiradas de las especificaciones globales, con el fin de acelerar la normalización de las características no problemáticas. Formalmente, no existe un estándar de CSS3 por sí solo, cada módulo es estandarizado independientemente, por lo que el estándar CSS consiste en CSS2.1 modificado. Se emplea la etiqueta < style > de HTML y solamente se pueden incluir en la cabecera del documento (sólo dentro de la sección < head >).

Componentes de estilo CSS

Regla: cada uno de los estilos que componen una hoja de estilos CSS. Se compone de una parte de selectores, otra de declaración y llaves de cierre y apertura.

Selector: indica los elementos HTML a los que se aplica la regla CSS.

Declaración: especifica los estilos que se aplican a los elementos.

Propiedad: característica que se modifica en el elemento seleccionado.

Valor: establece el nuevo valor de la característica modificada en el elemento.

Selectores CSS

Un selector CSS es el nexo de unión entre la hoja de estilos y los documentos a los que se aplique dicha hoja. En CSS vamos a encontrar los siguientes tipos de selectores:

Universales: que seleccionan todos los elementos de la página. Se indica mediante un asterisco (*), aunque no se suelen usar mucho.

De tipo o etiqueta: selecciona todos los elementos de la página cuya etiqueta HTML coincide con el valor del selector

Descendente: Selecciona los elementos que se encuentran dentro de otros elementos.

De clase: con este podemos por ejemplo aplicar estilo CSS a todo un párrafo.

De ID: permite seleccionar un elemento de la página a través del valor de su atributo id.

Además tenemos una serie de selectores más avanzados: de hijos, adyacente y de atributos.