La W3C (organismo que tiene como fin establecer normas para el desarrollo y uso de tecnologías Web) nos dice que el lenguaje HTML se compone de elementos (aproximadamente 100) formados por una etiqueta de apertura, un contenido y una etiqueta de cierre; además, en la etiqueta de apertura puedemos incluir atributos con determinados valores y las etiquetas deben encerrarse entre los signos de menor "<" y mayor ">".
Es decir, el lenguaje HTML es un lenguaje de "marcas" y todo lo que aparece en una página web lo debemos marcar antes, de manera que el contenido de la página más las marcas forman el archivo HTML.
Los elementos pueden tener o no una o varias parejas "atributo-valor" y algunos elementos se consideran vacios y no tienen contenido ni etiqueta de cierre.
Toda página Web se incluye dentro del elemento "html", es decir comienza con la etiqueta <html> y termina por </html>. Estos archivos se guardan normalmente con extensión .html, podemos crearlos incluso con el bloc de notas y es norma que el primer archivo de nuestro sitio web se llame index.html o default.html para que no tengamos que acordarnos de la página de inicio cuando le indicamos a alguien la dirección de una página web (URL).
Además, toda página Web tiene dos partes: la cabecera o elemento "head" y el cuerpo o elemento "body", de manera que el esqueleto, por así llamarlo, de una página Web es:
Además es muy conveniente decirle al navegador que tipo de lenguaje usamos, en este caso HTML 5, para que todo funcione correctamente y se interprete de la misma forma por todos los navegadores.
Antes solo se utilizaba código html para realizar páginas Web, el diseño de los elementos se realizaba directamente en el archivo html. Como un Sitio Web (Website) normalmente se compone de cientos de páginas Web, cambiar el aspecto, aunque sólo fuera el fondo, suponía un trabajo tan grande que no se lo deseo a nadie.
Por suerte, con el tiempo el lenguaje HTML dio paso a XHTML (Extensible Hypertext Markup Language, que podemos decir que es como una actualización de HTML) y posteriormente a HTML5 que, claramente será un nuevo estandar, y el diseño se separó del código html para escribirse sólamente en las llamadas Hojas de Estilo en Cascada (CSS).
La 2ª y 3ª etiqueta <meta> se utizan para dispositivos móviles (smartphone y tablet)
CSS: Hojas de Estilo en Cascada :
La W3C decidió que HTML y XHTML no deberían contener directamente información de cómo debe verse un elemento sino que esa información debe estar especificada en una hoja de estilos. Las hojas de estilos css utilizan un lenguaje para controlar la presentación del código html de forma que, actualmente, una página Web se hace así:
Un archivo de hojas de estilo se compone de una o más "reglas" con esta sintaxis:
Básicamente, en CSS existen 4 tipos de selectores:
- Los selectores por TIPO (que se corresponden con elementos del lenguaje HTML)
- los selectores por CLASE (que se corresponden con el atributo CLASS de ciertos elementos HTML) y que en la hoja CSS comienzan por un punto (.)
- los selectores por IDENTIFICADOR (que se corresponden con el atributo ID de algunos elementos HTML y que son únicos en el archivo HTML) y que en la hoja CSS comienzan por el signo de almohadilla (#)
- Separar la definición de los contenidos y la definición de su aspecto presenta numerosas ventajas, ya que obliga a crear documentos HTML/XHTML bien definidos y con significado completo (también llamados "documentos semánticos"). Además, mejora la accesibilidad del documento, reduce la complejidad de su mantenimiento y permite visualizar el mismo documento en infinidad de dispositivos diferentes.