テキスト入力欄に文字を打っていると、単語の下に赤い波線が引かれることがあります。これはブラウザのスペルチェック機能が「辞書にない語＝スペルミスかもしれない」と知らせているものです。便利な機能ですが、ユーザー名やコード、住所などを入力する欄では、辞書にない語ばかりで波線が邪魔になることもあります。HTML には、この波線の表示を要素ごとにオン・オフできる spellcheck というグローバル属性が用意されています。この記事では、spellcheck で何が変わるのか、textarea や input での基本的な書き方、true / false / 継承（default）という値の意味、そして「波線が消えない・効かない」といったつまずきやすいポイントまで、順に解説します。
目次
spellcheck 属性とは（波線が付くかどうかを決める）
spellcheck は、ブラウザのスペルチェック機能（誤字とみなした語に赤い波線を引く機能）を、その要素で有効にするか無効にするかを指定するグローバル属性です。グローバル属性なので、原則としてすべての HTML 要素に書けますが、実際に効果があるのは <textarea> や、テキストを入力できる <input>、contenteditable を付けた編集可能な要素など、ユーザーが文字を編集できる要素です。
ここで押さえておきたいのは、spellcheck があくまでブラウザ任せの入力支援だという点です。波線を出すかどうか、どんな語を誤字と判定するかは、ブラウザや OS のスペルチェック設定、入力中の言語などに左右されます。spellcheck は入力内容を検証（バリデーション）する仕組みではなく、送信されるデータそのものは一切変わりません。あくまで「波線という見た目の支援を出すか出さないか」を要素ごとに切り替える属性だと捉えてください。
基本の使い方（textarea と input でオン・オフ）
書き方はとてもシンプルで、対象の要素に spellcheck="true"（チェックする）または spellcheck="false"（チェックしない）を付けるだけです。次の例では、コメント本文を書く <textarea> ではスペルチェックを有効にし、ユーザー名を入れる <input> では無効にしています。
<!-- 本文入力：スペルチェックを有効にして誤字を知らせる --> <label>コメント <textarea spellcheck="true"></textarea> </label> <!-- ユーザー名入力：辞書にない語が多いのでチェックを無効にする --> <label>ユーザー名 <input type="text" spellcheck="false"> </label>
spellcheck は列挙属性（あらかじめ決められた値の中から選ぶ属性）で、正式に意味を持つ値は "true" と "false" の 2 つです。真偽値属性（disabled のように書くだけで有効になるもの）とは異なる点に注意してください。とはいえ実装上は、spellcheck="" のように空文字を指定した場合や、値を省いて spellcheck とだけ書いた場合も true と同じ扱いになります。意図を明確にするためにも、通常は "true" か "false" を明示して書くのがおすすめです。
値の意味（true / false と、未指定の default）
spellcheck の状態は、実は「オン」「オフ」の 2 つだけではありません。属性を書かなかったときの未指定（default）という第 3 の状態があり、これは真偽が確定していない、親要素から引き継がれる中間的な値です。3 つの状態を整理すると次のようになります。
| 値 | 意味 |
|---|---|
true | スペルチェックを有効にする。誤字に波線を付けてよい状態。spellcheck="" や値なしの spellcheck もこれと同じ扱い。 |
false | スペルチェックを無効にする。波線を付けない。 |
| default（未指定） | 属性を書かない状態。真偽は確定せず、親要素の設定を継承し、最終的にはブラウザや要素ごとの既定の挙動に従う。 |
ポイントは、未指定の default が「必ずオフ」でも「必ずオン」でもないことです。spellcheck の値は親要素から子要素へ継承されるため、たとえば親に spellcheck="false" を付けておくと、その中にある未指定の入力欄も無効側に引き継がれます。どちらとも書いていない要素の挙動は、こうした継承と、ブラウザ・要素ごとの既定によって決まる、と理解しておくとつまずきにくくなります。
実践：どの欄でオフにして、どの欄でオンにするか
使い分けの基本は、「辞書にない語が多く、波線が邪魔になる欄はオフ」「自然な文章を書く欄はオン」です。オフにしたい代表例は、ソースコードを貼り付ける入力欄、ユーザー名やアカウント ID、メールアドレス、住所や郵便番号、型番・シリアルなどの識別子です。これらは一般的な辞書に載っていない語ばかりで、波線がびっしり付くと入力の妨げになります。次のように spellcheck="false" を付けておくと快適です。
<!-- コード入力欄：記号や英単語が多いのでチェックを切る --> <label>コードを貼り付け <textarea spellcheck="false"></textarea> </label> <!-- メールアドレス：辞書にない語なのでオフ --> <label>メールアドレス <input type="email" spellcheck="false"> </label> <!-- 自己紹介文：日本語や英語の文章なのでオンにして誤字を支援 --> <label>自己紹介（lang で言語を明示） <textarea spellcheck="true" lang="ja"></textarea> </label>
逆に、コメント欄・レビュー・問い合わせ本文・ブログ記事の入力欄など、自然な文章を書く場所では spellcheck="true" にしておくと、打ち間違いに気づけて親切です。上の例で <textarea> に lang="ja" を付けているのは、どの言語の辞書でチェックするかを明示するためです。スペルチェックは言語ごとの辞書を使うため、英語の文章に日本語の辞書を当てると正しい語まで誤字扱いされてしまいます。lang 属性で入力欄（または祖先要素）の言語を正しく指定しておくと、その言語に合った判定が期待できます。
spellcheck が効かない・波線が消えないとき
spellcheck を書いたのに思ったとおりに動かない、というのはよくある悩みです。原因はいくつかに分かれるので、順に確認していきましょう。
そもそもブラウザや OS の設定に依存する
もっとも多いのがこのケースです。spellcheck は「チェックしてよい／しないでほしい」というヒントであり、実際に波線を出すかどうかは最終的にブラウザや OS のスペルチェック設定に委ねられています。ブラウザ側でスペルチェック自体をオフにしている、対応する言語の辞書がインストールされていない、といった環境では、spellcheck="true" を書いても波線は出ません。自分の環境で出ないからといって属性が間違っているとは限らない、という点をまず押さえてください。
type によっては input で無視される
<input> はすべての type でスペルチェックが働くわけではありません。とくに type="password" のように、内容を他人に見せない・言語的な文章を想定していない入力欄では、spellcheck="true" を付けてもチェックされないのが一般的です。数値や日付を入れる専用の入力タイプなども、そもそもスペルチェックの対象になりません。自由なテキストを扱う type="text" や <textarea> でこそ意味を持つ属性だと考えるとよいでしょう。
contenteditable では継承に注意する
contenteditable を使った編集可能な領域で波線が消えないときは、値の継承を疑ってみてください。前述のとおり spellcheck は親から子へ継承されるため、対象の要素で spellcheck="false" を書いても、その内側にさらに編集可能な要素があり別途 true になっている、あるいは想定と違う祖先の設定が効いている、といったことが起こり得ます。オフにしたい範囲の要素に明示的に spellcheck="false" を指定し、内側で上書きされていないかを確認すると原因を切り分けやすくなります。
まとめ
spellcheck は、入力欄などで誤字に赤い波線を出すスペルチェックを、要素ごとに有効・無効にできるグローバル属性です。列挙属性であり、意味を持つ値は true（チェックする）と false（しない）の 2 つで、spellcheck="" や値なしの記述は true と同じ扱いになります。属性を書かない未指定（default）は真偽が確定せず、親要素からの継承とブラウザ・要素の既定に従います。ユーザー名・メールアドレス・コード・住所など辞書にない語が多い欄では false、コメントや本文など自然な文章を書く欄では true にし、lang 属性でチェックする言語を明示するのが実践的です。ただし実際に波線を出すかはブラウザや OS の設定にも依存し、type="password" では無視されるなど例外もあります。spellcheck はあくまで表示上の支援でありバリデーションではない、と理解して使い分けてください。