Global Attributes - Part 1

There are some attributes that can be used on any element (including undefined elements); these are called 'Global Attributes' and they are used just like every other attribtute.

<element attribute-name="attribute-value"> </element>

The id Attribute

The id attribute is a unique identifier for an element. It can be used to refer to the element in CSS or JavaScript.

The only constraints the id attribute has is that it must be unique, contain at least one character and not contain any spaces. Everything else is perfectly valid.

The title Attribute

The title attribute represents advisory information (such as in a tooltip), but you should ensure that you do not rely on the title being visible as many user agents do not make it sufficiently available (e.g., web browsers on a smart phone).

The title attribute is inherited from the elements parent unless overridden.

The lang Attribute

The lang attribute specifies the language of the element and is inherited from the elements parent unless overridden.

The lang attribute should be specified using a 'BCP 47' code, e.g., jp for Japanese.

The translate Attribute

The translate attribute is used to specify if the elements content should be translated if the page is localised.

By default, the translate attribute is set to 'inherit' which means that the element should only be translated if its parent should be translated.

The root element defaults to 'yes' so unless it is specifically overridden, all elements will be translated when the page is localised.

In various cases, this would be incorrect behaviour, such as when you have a website devoted to comparing Japanese and English text.

In those situations, you should set the translate attribute of the relevant attributes to 'no'.