関連性がないことを表す

hidden属性は、現時点においてはその要素が無関係であることを表します。

• 対応しているブラウザでは、この属性が指定された要素は表示されなくなります。

hidden属性は、次のような要素に指定することができます。

• 今は関連性がないが、これから関連するかもしれない要素。
• 以前は関連性があったが、今はもう関連していない要素。

次の例では、fieldset要素にhidden属性を指定して、ユーザー情報の入力欄を隠しています。これは、ユーザーが規約に同意しない限り、そのコンテンツが利用できない（無関係である）ことを表しています。

<script>
function visible(){
    if (document.getElementById("agree").checked) {
        document.getElementById("user").hidden = false;
    }
    else {
        document.getElementById("user").hidden = true;
    }
}
</script>

<p><label><input type="checkbox" name="agree" value="1" id="agree" onchange="visible()">規約に同意する</label></p>

<fieldset id="user" hidden>
<legend>ユーザー情報</legend>
<p>お名前：<input type="text" name="name"></p>
</fieldset>

hidden属性が適さないケース

この属性は、現時点において関連性のある要素に対しては、指定してはならないとされています。（関連性はあるけど隠しておきたい、といったコンテンツには適さないことになります）

例えば、タブ付きボックスで表示内容を切り替える場合に、非表示のコンテンツにこの属性を使用するのは不適切となります。（これは、非表示のコンテンツが無関係であるとは言えないためです）

また、この属性が指定された要素は、すべてのユーザーに対して隠される必要があります。そのため、ユーザーの環境により表示内容を変える（一部を隠す）ような使い方にも適さないことになります。

リンクについて

hidden属性が指定されていない要素は、hidden属性が指定された要素に対してリンクするべきではないとされています。（関連性のないコンテンツにリンクするのは不自然だからです）

指定できる要素

hidden属性はグローバル属性のため、HTML5の全ての要素に指定することができます。