Ir al contenido principal

Los atributos

Todos los elementos pueden tener atributos. Estos atributos dan información complementaria sobre el elemento y siempre se posicionan en la etiqueta de apertura.
Deben respetar el siguiente formato: nombre="valor". ej: id="navegacion", style="color:red", class="botones"

Algunos atributos están reservados a elementos específicos.
Es el caso de width, height, href, alt y src reservados a elementos multimedia que abordaremos en detalle en el capítulo 2.

El estándar HTML5 no requiere atributos en minúsculas y atributos dotados de comillas. Su uso facilita la lectura del código. W3C recomienda el uso de minúsculas y de comillas en HTML, y lo exige para documentos de tipo XHTML.
No es obligatorio pero en algunos casos si no las usas tienes errores. En el ejemplo siguiente el atributo contiene espacios. Y si no usamos comillas obtenemos un error en el despliegue del elemento.

Se suelen usar comillas (" "), pero también se pueden usar apóstrofes (' ').
En algunos casos, si el texto contiene comillas debes cambiar las comillas del atributo por apóstrofes para no ocasionar errores.

El atributo Style

Se utiliza para cambiar reglas de estilo como el color, la fuente, el tamaño de letra...
Estudiaremos con más detalles esta parte del lenguaje de marcas cuando abordemos las hojas de estilo. Pero antes de nada, indicar que:

  • El atributo style tiene prioridad sobre cualquier otra regla de estilo establecida en la página web y por este motivo es preferible no usar atributos style en el documento HTML. Esto facilitará la gestión o la actualización de la página web.
  • Es preferible usar marcas de aspecto como [STRONG] o [EM] para atribuir una función especial al cambio de formato del texto. Porque los robots que indexan la página entienden el significado de las marcas de aspecto y no tanto de un cambio de estilo con CSS.

Uso inadecuado de los atributos:
<p>Este texto es un <span title=Parte importante del párrafo>ejemplo del uso</span> que se puede hacer del atributo style</p>

Uso con comillas y Apóstrofes:
<p>Este texto es un <span title='Parte del párrafo copiada del "Petit Robert", el diccionario francés'>ejemplo del uso</span> que se puede hacer del atributo style</p>
También se admite:
<p>Este texto es un <spantitle="Parte del párrafo copiada del 'Petit Robert', el diccionario francés">ejemplo del uso</span> que se puede hacer del atributo style</p>

Ejemplo de Uso que se puede hacer con el atributo style:
<p>Este texto es un <spanstyle="color:red">ejemplo del uso</span> que se puede hacer del atributo style</p>

Ejemplos de uso del atributo Lang:
<html lang="es-ES"> o <html lang="en-US">
Las dos primeras letras definen el idioma. Las dos últimas la versión utilizada.

El atributo Lang

Este atributo se suele emplear en la declaración del documento HTML en el elemento [HTML].
Es importante porque permite a las aplicaciones de accesibilidad web definir el idioma empleado en la página web.

El atributo Title

Cuando se hace uso del atributo title para un elemento, este se ve dotado de una descripción emergente que se activa cuando sobrevolamos el elemento con el ratón.

Ilustración del atributo title con un libro abierto

Los comentarios:

Sirven para comentar el código fuente. Muy usado por los programadores porque permiten escribir algo que no se va a imprimir en pantalla y que podremos utilizar para explicar un tramo de código, recordardespués de años el sentido de una frase o para que otro programador sepa qué utilidad tiene un código concreto.

Para HTML empleamos <!-- para abrir y --> para cerrar

Los atributos Id y Class

El atributo id específica un código de identificación único para un elemento.
El atributo class especifica un código de identificación que se puede repetir tantas veces como sea necesario en el documento HTML.
Veremos con más detalles el uso de estos dos atributos en el próximo Módulo formativo.

Newsletter

Si mandas tu email desde este formulario, te responderé con una oferta de 5% aplicable a tu próximo presupuesto. Más adelante, te enviaré ofertas y noticias acerca de mi actividad.
No spam. Tus datos están protegidos y no compartidos.

imagen Captcha correspondiente a pitchcar

Por favor, escribir el nombre visible en esta imagen sin tilde, mayúscula, símbolo...

Parte inferior de la sección rellenada por fotos de gente