Puede comenzar a escribir el Código 1.3en un archivo HTML e ir añadiendo cada uno de los nuevos elementos que presentaremos en las próximas páginas.
Después de declarar el tipo de documento, tenemos que construir la estructura de árbol del HTML. Como siempre, el elemento raíz de este árbol es . Éste es el elemento que contendrá todo el código HTML.
Código 1-4
Uso del elemento .
El atributo lang
en la etiqueta de apertura es el único que necesitará indicar en HTML5. Recuerde que hemos dicho que este atributo define el idioma que se utiliza para el contenido del documento, que en este caso es, obviamente, español.
Para conocer otros idiomas para el atributo lang, puede seguir este enlace:
http://www.w3schools.com/tags/ref_language_codes.asp
Importante
HTML5 es muy flexible en cuanto a la estructura y a los elementos utilizados para su construcción. El elemento también puede ser incluido sin ningún atributo o incluso puede ser ignorado. Sin embargo, por razones de compatibilidad y otros motivos en los que no vale la pena extendernos en este manual, le recomendamos que siga nuestras reglas básicas. Tenga en cuenta que le explicaremos cómo crear documentos HTML de acuerdo con las que consideramos que son las mejores prácticas.
Continuemos avanzando en la construcción del documento. El código HTML insertado entre las etiquetas ha de estar dividido en dos secciones principales. Tal como sucedía en versiones anteriores de HTML, la primera sección es la cabeza ( head
) y la segunda el cuerpo ( body
). Así que el próximo paso será la creación de estas dos secciones en el código utilizando las etiquetas
y .
Evidentemente, el elemento
va primero y, como el resto de los elementos estructurales, tiene una etiqueta de apertura y una etiqueta de cierre.
Código 1-5
Uso del elemento
.
La etiqueta en sí no ha cambiado respecto a versiones anteriores y su propósito también sigue siendo exactamente el mismo. Dentro de las etiquetas
vamos a definir el título de nuestra página web, a declarar la codificación de caracteres, a proporcionar información general sobre el documento y a incorporar archivos externos con los estilos, los scripts e incluso las imágenes necesarias para identificar la página. A excepción del título y de algunos iconos, la información incorporada al documento entre las etiquetas normalmente no está a la vista del usuario.
La siguiente sección en un documento HTML contiene la parte visible del documento y se identifica con la etiqueta
.Se trata, nuevamente, de una etiqueta que no ha cambiado respecto a las versiones anteriores de HTML.
Código 1-6
Uso del elemento
.
A continuación construiremos el elemento head
del documento. El contenido de este elemento ha sufrido algunos cambios y uno de ellos es la etiqueta que define la codificación de caracteres del documento, que es la etiqueta meta
, que indica cómo debe presentarse el texto en la pantalla.
Código 1-7
Uso del elemento
.
La novedad de este elemento en HTML5, como en la mayoría de los casos, es la simplificación alcanzada. La nueva etiqueta
para la codificación de caracteres es más corta y más simple. Por supuesto, puede utilizar la codificación que prefiera en lugar de utf-8 y además puede añadir las etiquetas o , tal como mostramos en el ejemplo siguiente.
Código 1-8
Uso de otros elementos
.
Conceptos básicos
Hay varias etiquetas
que pueden ser utilizadas en un documento para declarar la información general que no será mostrada en la ventana del navegador. Se trata de información que es utilizada por los motores de búsqueda y los dispositivos que necesitan obtener una vista previa o conseguir un resumen de los datos relevantes del documento. En el
Código 1-8, el atributo
name
dentro de la etiqueta especifica el tipo y el atributo
content
declara su valor, pero ninguno de estos valores se muestra en la pantalla. Para obtener más información sobre las etiquetas , visite nuestro sitio web y siga los enlaces de este capítulo.
Debe saber que en HTML5, no es necesario cerrar las etiquetas individuales con una barra al final, pero es recomendable hacerlo por razones de compatibilidad. A continuación, añadimos al código anterior barras inclinadas:
Código 1-9
Etiquetas con barras de cierre.
La etiqueta , tal como sucedía en versiones anteriores, simplemente indica el título del documento, de manera que no hay ninguna novedad que comentar sobre la misma.
Código 1-10
Uso del elemento .
Conceptos básicos
El texto que se encuentra entre las etiquetas es el título del documento que estamos creando. Por lo general, los navegadores muestran este texto en la parte superior de la ventana.
Otra parte importante del elemento
o la cabeza de un documento HTML5 es el elemento
.Este elemento se utiliza para incorporar estilos, scripts, imágenes o iconos desde archivos externos en el documento. Uno de sus usos más habituales es la incorporación de estilos mediante la inserción de un archivo CSS externo.
Código 1-11
Читать дальше