Documentos de Académico
Documentos de Profesional
Documentos de Cultura
Los atributos se incluyen dentro de la etiqueta de apertura. No todos los atributos se pueden
utilizar en todas las etiquetas. Por ello, cada etiqueta define su propia lista de atributos
disponibles. Aunque cada una de las etiquetas HTML define sus propios atributos, algunos de los
atributos son comunes a muchas o casi todas las etiquetas. Los atributos comunes se dividen en
cuatro grupos segn su funcionalidad:
ATRIBUTOS BSICOS
Los siguientes cuatro atributos bsicos se pueden aplicar prcticamente a todas las etiquetas
HTML:
Respecto al valor de los atributos id y class, slo pueden contener guiones medios (-), guiones
bajos (_), letras y/o nmeros, pero no pueden empezar por nmeros. Adems, los navegadores
distinguen maysculas de minsculas y no se recomienda utilizar letras como y acentos, ya que
no es seguro que funcionen correctamente.
Estos atributos son tiles para aquellas pginas que muestran sus contenidos en varios idiomas y
para aquellas que quieren indicar de forma explcita el idioma de sus contenidos:
Siempre que se incluye el atributo lang. Los idiomas se indican mediante un cdigo estandarizado
(es para espaol, en para ingls, etc.). Como la palabra internacionalizacin es muy larga, se suele
sustituir por la abreviatura i18n (el nmero 18 se refiere al nmero de letras que existen entre la
letra i y la letra n de la palabra internacionalizacin).
ATRIBUTOS DE EVENTOS
Estos atributos slo se utilizan en las pginas web que incluyen cdigo JavaScript para realizar
acciones dinmicas sobre los elementos de la pgina. Cada vez que el usuario pulsa una tecla,
mueve su ratn o pulsa cualquier botn del ratn, se produce un evento dentro del navegador.
Utilizando JavaScript y los siguientes atributos, es posible responder de forma adecuada a cada
evento.
ATRIBUTOS DE FOCO
Cuando el usuario selecciona un elemento en una aplicacin, se dice que "el elemento tiene el
foco del programa". Si por ejemplo un usuario pincha con su ratn sobre un cuadro de texto y
comienza a escribir, ese cuadro de texto tiene el foco del programa, llamado "focus" en ingls. Si el
usuario selecciona despus otro elemento, el elemento original pierde el foco y el nuevo elemento
es el que tiene el foco del programa.
Los documentos HTML se encuentran estrictamente organizados. Cada parte del documento est
diferenciada, declarada y determinada por etiquetas especficas. En esta parte del captulo vamos
a ver cmo construir la estructura global de un documento HTML y los nuevos elementos
semnticos incorporados en HTML5.
EL <!DOCTYPE>
En primer lugar necesitamos indicar el tipo de documento que estamos creando. Esto en HTML5
es extremadamente sencillo:
<!DOCTYPE html>
IMPORTANTE: Esta lnea debe ser la primera lnea del archivo, sin espacios o lneas que la
precedan. De esta forma, el modo estndar del navegador es activado y las incorporaciones de
HTML5 son interpretadas siempre que sea posible, o ignoradas en caso contrario.
LA ETIQUETA <html>
Luego de declarar el tipo de documento, debemos comenzar a construir la estructura HTML. Como
siempre, la estructura tipo rbol de este lenguaje tiene su raz en el elemento <html>. Este
elemento envolver al resto del cdigo:
<!DOCTYPE html>
<html lang=es>
</html>
El atributo lang en la etiqueta de apertura <html> es el nico atributo que necesitamos especificar
en HTML5. Este atributo define el idioma del contenido del documento que estamos creando.
LA ETIQUETA <body>
<!DOCTYPE html>
<html lang="es">
<head>
</head>
<body>
</body>
Nota: Hasta el momento tenemos un cdigo simple pero con una estructura compleja. Esto es
porque el cdigo HTML no est formado por un conjunto de instrucciones secuenciales.
LA ETIQUETA <meta>
Una de las partes ms importantes de la metainformacin de la pgina son los metadatos, que
permiten incluir cualquier informacin relevante sobre la propia pgina. La especificacin oficial
de HTML no define la lista de metadatos que se pueden incluir, por lo que las pginas tienen
libertad absoluta para definir los metadatos que consideren adecuados. La etiqueta empleada
para la definicin de los metadatos es <meta>.:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset=UTF-8>
</head>
<body>
</body>
</html>
La innovacin de este elemento en HTML5, como en la mayora de los casos, es solo simplificacin.
La nueva etiqueta <meta> para la definicin del tipo de caracteres es ms corta y simple.
LA ETIQUETA <title>
La etiqueta <title>, como siempre, simplemente especifica el ttulo del documento, y no hay nada
nuevo para comentar:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Este texto es el ttulo del documento</title>
</head>
<body>
</body>
</html>
Nota: El texto entre las etiquetas <title> es el ttulo del documento que estamos creando.
Normalmente este texto es mostrado en la barra superior de la ventana del navegador.
LA ETIQUETA <link>
Este elemento es usado para incorporar estilos, desde archivos externos. Uno de los usos ms
comunes para <link> es la incorporacin de archivos con estilos CSS:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Este texto es el ttulo del documento</title>
<link rel=stylesheet href=misestilos.css>
</head>
<body>
</body>
</html>
En HTML5 solo necesitamos dos atributos para incorporar nuestro archivo de estilos: rel y href. El
atributo rel significa relacin y es acerca de la relacin entre el documento y el archivo que
estamos incorporando por medio de href.
Comentarios en html
Al igual que la mayora de lenguajes, HTML permite incluir comentarios dentro de su cdigo para
aadir informacin que no se debe mostrar por pantalla.
Aunque los comentarios no se muestran por pantalla y por tanto son invisibles para los usuarios.
La mayor parte del contenido de las pginas web estn formado por texto, llegando a ser ms del
80% del cdigo de la pgina. Por este motivo, es muy importante conocer los elementos y
etiquetas que define HTML para el manejo del texto.
El lenguaje HTML incorpora al tratamiento del texto muchas de las ideas y normas establecidas en
otros entornos de publicacin de contenidos. De esta forma, HTML define etiquetas para
estructurar el contenido en secciones y prrafos y define otras etiquetas para marcar elementos
importantes dentro del texto.
LA ETIQUETA <p>
Una de las etiquetas ms utilizadas de HTML es la etiqueta <p>, que permite definir los prrafos
que forman el texto de una pgina. Para delimitar el texto de un prrafo, se encierra ese texto con
la etiqueta <p>, como muestra el siguiente ejemplo:
<p>El segundo prrafo de la pgina tambin se define encerrando su texto con la etiqueta p..</p>
Las pginas HTML habituales suelen tener una estructura ms compleja que la que se puede crear
solamente mediante prrafos. De hecho, es habitual que las pginas se dividan en diferentes
secciones jerrquicas.
Los ttulos de seccin se utilizan para delimitar el comienzo de cada seccin de la pgina. HTML
permite crear secciones de hasta seis niveles de importancia.
Las etiquetas que definen los ttulos de seccin son <h1>, <h2>, <h3>, <h4>, <h5> y <h6>. La
etiqueta <h1> es la de mayor importancia y por tanto se utiliza para definir los titulares de la
pgina. La importancia del resto de etiquetas es descendiente, de forma que la etiqueta <h6> es la
que se utiliza para delimitar las secciones menos importantes de la pgina.
Entre las etiquetas ms utilizadas para marcar texto se encuentran <em> y <strong>.
La etiqueta <em> marca un texto indicando que su importancia es mayor que la del resto del
texto.