HTML5ドキュメントの検証-SitePoint

HTML5検証：コードを簡素化し、Webページの品質を向上させる

キーポイント

• HTML5検証は、コードスタイルではなく、要素の正しい使用、属性値の精度、および必要な属性の整合性に重点を置いています。これは、タグがHTML5仕様に準拠することを保証するための貴重なツールです。
• オプションの要素と属性、ケースの無感覚、以前に非推奨されていた要素の有効性など、XHTMLとHTML5の検証には多くの違いがあります。 HTML5プロジェクト全体でスタイルを選択し、一貫性を維持することをお勧めします。
• HTML5の検証は、Webページがブラウザによって正しくフォーマットおよび解釈されるようにするために重要です。 HTML5検証に利用できるさまざまなオンラインおよびオフラインツールがあり、より厳格なガイドラインを遵守したい人には、より厳格な検証ツールが利用できます。

（以下は、Alexis Goldstein、Louis Lazaris、Estelle Weylが共著した本「HTML5＆CSS3、第2版」から抜粋しています。この本は世界中の店舗で入手できます。ここでは、電子書籍バージョンを購入できます 前の章では、HTML5にいくつかの構文の変更を導入し、検証関連の問題に触れました。これらの概念をより詳細に拡張して、ページの検証方法の変更をよりよく理解できるようにしましょう。

HTML5 VALIDATORは、コードスタイルに焦点を合わせなくなりました。大文字や小文字を使用したり、属性の引用符を省略したり、オプションの閉じたタグを除外したり、任意に一貫性を持つことができます。ページはまだ有効です。

では、HTML5バリデーターエラーと見なされるものは何ですか？要素の誤った使用、含まれるべきではない要素、必要な属性の欠落、間違った属性値などを思い出させます。要するに、Validatorは、タグが仕様と競合するかどうかを知らせるため、ページを開発するときはまだ貴重なツールです。

HTML5が過度に厳格なXHTMLとどのように異なるかについてのアイデアを与えるために、いくつかの詳細を見てみましょう。このようにして、HTML5で有効と見なされているものを理解できます：

XHTMLベースの構文では、XHTMLで必要とされる要素は、HTML5やボディ要素などを渡すためにHTML5では必要ありません。これは、たとえそれらを除外しても、ブラウザがドキュメントに自動的に含めるためです。

• 空の要素（つまり、対応する閉じたタグのない要素）は、閉じたスラッシュで閉じる必要はありません。
• 要素と属性は、大文字、小文字、または混合ケースです。
• 属性値の周りに引用符は必要ありません。例外は、複数の空間分離値を使用するか、URLが値として表示され、等記号（=）文字を持つクエリ文字列が含まれます。
XHTMLで廃止され、したがって無効な要素が埋め込まれた要素です。
どの要素にも表示されないが、ボディ要素に直接配置されたまっすぐなテキストは、XHTMLドキュメントを無効にします。
XHTMLで閉じる必要がある要素は、P、Li、DTなどのHTML5で閉じることはできません。
フォーム要素は、アクション属性を必要としません。
フォーム要素（入力など）は、フォーム要素の直接子として使用できます。
Textarea要素には、行とcolsの属性は必要ありません。
• リンクのターゲット属性は、以前はXHTMLで非推奨されています。現在、HTML5で有効になっています。
この章で前述したように、ブロックレベルの要素はリンク（a）要素内に配置できます。
＆character（＆）がページ上にテキストとして表示される場合、＆をエンコードする必要はありません。
• これは、XHTML StrictスキーマとHTML5検証の違いのかなり包括的な（網羅的ではありませんが）リストです。いくつかはスタイルの選択肢なので、スタイルを選択して一貫性を保つことをお勧めします。前の章では、優先スタイルの選択肢のいくつかを概説しました。これらの提案を独自のHTML5プロジェクトに組み込むことを歓迎します。

注：検証ツール

より厳しいガイドラインを使用して、文法スタイルのタグを検証する場合は、役立つツールがいくつかあります。ツールの1つは、フィリップウォルトンのHTMLインスペクターです。それを使用するには、開発フェーズ中にページにスクリプトを含めることができ、開発者ツールでブラウザのJavaScriptコンソールを開き、コマンドhtmlinspector.inspect（）を実行できます。これにより、コンソールに多くの警告と提案が直接表示され、マークアップを改善する方法を説明します。 HTML Inspectorでは、構成を変更して、ニーズに応じてツールをカスタマイズすることもできます。

概要

これまでのところ、HTML5の新しいセマンティックと構文の変更について学びました。この情報の一部は最初は消化するのが難しいかもしれませんが、心配しないでください！ HTML5に精通する最良の方法は、それを使用することです。次のプロジェクトから始めてください。前の章で紹介した構造要素のいくつか、またはこの章で見たテキストレベルのセマンティクスのいくつかを使用してみてください。要素の目的がわからない場合は、そのセクションについて戻って読んでください。または、さらに良いことに、仕様自体を読んでください。この本のテキストよりも言語は確かに退屈ですが（少なくとも私たちはそう願っています！）、仕様は特定の要素の意図された使用をより完全に説明できます。 HTML5仕様はまだ開発中であるため、カバーしたコンテンツの一部は、新しいHTML5.1バージョン（またはWhatWGの定義に従う場合はHTML5 "Dynamic Standard"）でまだ発生する可能性があります。仕様には常に最新の情報が含まれます。

次の章では、HTML5で導入された主要な新機能：フォームとフォーム関連の機能について説明します。

HTML5ドキュメント検証FAQ（FAQ）

HTML5の確認とは何ですか？それが重要な理由は何ですか？

HTML5検証は、HTML5仕様の正式な構文ルールに従って、Webページコードをチェックするプロセスです。これは、Webページが正しくフォーマットされ、ブラウザによって正しく解釈されることが保証されるため、非常に重要です。これにより、パフォーマンスが向上し、エラーが少なくなり、障害を持つユーザーのアクセシビリティが向上します。さらに、検索エンジンが十分に構造化されたエラーのないサイトを好むため、SEOに役立ちます。

HTML5ドキュメントを確認する方法は？

W3Cタグ検証サービスなどのオンラインツールを使用して、HTML5ドキュメントを確認できます。 WebページURLを入力するか、HTMLファイルをアップロードするだけで、ツールはHTML5標準に対してチェックし、エラーや警告を報告します。

最も有効なHTML5ドキュメントは何ですか？

最小有効なHTML5ドキュメントは、HTML5仕様によって設定された標準にまだ準拠している最も単純なHTML5ドキュメントです。ドキュメントタイプの宣言、ルート要素（HTML）、ヘッド要素、およびボディ要素が含まれます。

一般的なHTML5検証エラーは何ですか？

一般的なHTML5検証エラーには、閉じたタグの欠落、要素の誤ったネスト、非推奨要素または属性の使用、およびドキュメントの先頭にドキュメントタイプの宣言を含めるのを忘れることが含まれます。

HTML5検証エラーを修正する方法は？

HTML5検証エラーの修正には、検証ツールによって提供されるエラーメッセージに基づいてコードの修正が含まれます。これには、欠落したタグの追加、非推奨要素の削除または交換、または要素のネストの修正が含まれます。

HTML5検証におけるドキュメントタイプ宣言の役割は何ですか？

ドキュメントタイプ宣言は、HTML5ドキュメントの最初の行であり、HTMLのバージョンをブラウザに伝えます。ブラウザと検証ツールがコードの残りの部分を正しく解釈するのに役立つため、検証には重要です。

CSSとJavaScriptを含むHTML5ドキュメントを確認できますか？

はい、CSSとJavaScriptを含むHTML5ドキュメントを確認できます。ただし、検証はHTMLコードのみをチェックします。 CSSとJavaScriptの場合、個別の検証ツールを使用する必要があります。

HTML5バリデーターを使用することの利点は何ですか？

HTML5 VALIDATORを使用すると、問題が発生する前にエラーをキャッチおよび修正するのに役立ちます。ウェブサイトのパフォーマンス、アクセシビリティ、および検索エンジンのランキングを改善できます。また、HTMLについてさらに学び、コーディングスキルを向上させる素晴らしい方法です。

HTML5ドキュメントをオフラインで確認できますか？

はい、HTML5ドキュメントをオフラインで確認できるツールがあります。これらのツールには、コンピューターにインストールできるソフトウェアアプリケーションとコマンドラインツールが含まれます。

HTML5検証とHTML5の一貫性チェックの違いは何ですか？

HTML5検証とは、HTML5仕様に従ってコードの構文をチェックすることです。一方、一貫性チェックは、WebページがWebデザインとアクセシビリティのベストプラクティスに従うこと、および構文が正しいことを確認することです。

以上がHTML5ドキュメントの検証-SitePointの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。