web-dev-qa-db-ja.com

W3C検証について気にする必要がありますか？

私はAngularJSを学習していて、次のような単純なコードを見つけました。

<!DOCTYPE html>
<html>
   <head>
    <meta charset='utf-8'>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js"></script>
</head>
<body ng-app ng-init="name = 'World'">
    <h1>Hello, {{name}}!</h1>
</body>
</html>

主に非標準の属性（ng-app、ng-init）があるため、W3C検証テストに合格しません。

問題は、アプリケーションのW3C検証を気にする必要があるかどうかです。 AngularJSを放棄すべきですか？

angularjsvalidationw3c-validation
29
ContentiousMaximus

data-html5属性を使用できます。これは標準であり、私が知る限り、Angularでも同じように機能します。何かのようなもの：

data-ng-app=""
data-ng-init="xxx"

Angular）でも同じように機能し、W3Cによって検証されます。

これも見てください： ng-appとdata-ng-appの違いは何ですか？

それとは別に、標準を使用した私の経験から、さまざまなクライアント、バージョンなどを使用して、製品が可能性のある大規模な群集（WebサイトやパブリックWebアプリケーションなどを構築する）に配信される場合は常に優れています。 angularを使用してSPAを再構築し、場合によっては電話ギャップを作成して、ネイティブアプリとしてモバイルデバイスにインストールされるモバイルアプリを作成します。標準はそれほど重要ではありません。重要なことは、機能することです。ターゲットデバイスで。

49
S.Magnaschi

W3C HTML5バリデータメンテナはこちら。 Angularのng-*属性などのカスタム属性を含むドキュメントの検証をより効率的に処理する方法について話し合いました。ただし、非標準でありながら、非常に広く正しく使用されているため、バリデーターが「それらに関するエラーメッセージは、実際には作者を助けていません。

これを軽減するためにHTML5バリデーターに追加した機能の1つは、「メッセージフィルタリング」機能です。この機能を使用すると、重要ではない、または役に立たないエラー/警告メッセージを永続的に無視できます。フロントエンドはここにあります：

http://validator.w3.org/nu/

チェック用のドキュメントを送信すると、結果ページにメッセージフィルタリングボタンが表示され、それを押すと、表示/非表示チェックボックスを使用して、セットにグループ化されたすべてのエラーメッセージのリスト。

validator screen shot showing Message Filtering button

2017年2月6日更新：議論中のカスタム属性のHTML仕様の提案

最近、カスタムelements のサポートを HTML Checker （W3Cバリデーター）に追加しました。したがって、カスタムattributes、私はそれを実装するために使用したものと同様のメカニズムを使用できます。

ただし、HTML仕様が更新されて許可されるまで、HTMLチェッカーを変更してカスタム属性名を許可することはできません。そのためには、 HTML仕様の課題追跡で議論されている提案を参照 です。

46
sideshowbarker

気にすべきかどうかはあなた次第です。そこには多くのページがあります これは有効なHTMLではありません 。

HTML5では カスタム属性 をプレフィックスとしてdata-を付けると許可されるため、次のように 他の同等のディレクティブの1つ を使用できます。

<span data-ng-bind="name"></span>
5
Uooo

HTMLの規則は、アンチパターンを防ぎ、コードを保守しやすくするためにあります。

うん。それらについて、最近、「なぜ検証するのか？」でもう少し詳しく書きました。 HTML5バリデーターの「About」セクションに追加したセクション：

http://validator.w3.org/nu/about.html#why-validate

そのセクションのテキストのソースはここにあります：

https://github.com/validator/validator/blob/master/site/nu-about.html#L16

そして、提案された改良/追加を伴うプルリクエストは大歓迎です。

私が現在持っているのはこれです：

適合性チェッカーを介してHTMLドキュメントを実行する主な理由は単純です。予期しない間違いを発見するため（そうでない場合は見逃していたかもしれない間違い）、修正できるようにするためです。

それ以外にも、HTML仕様の一部のドキュメント適合要件（妥当性ルール）は、ユーザーとドキュメントのユーザーが特定の種類の潜在的な問題を回避するのに役立ちます。これらの要件の根拠を説明するために、HTML仕様には次の2つのセクションが含まれています。

これらの2つのセクションで述べられていることを要約すると、

  • アクセシビリティ、使いやすさ、相互運用性、セキュリティ、または保守性の潜在的な問題である、またはパフォーマンスの低下を招く可能性がある、またはトラブルシューティングが困難な方法でスクリプトが失敗する可能性があるため、エラーとして定義されているマークアップケースがいくつかあります。
  • それに加えて、HTML解析やエラー処理動作で潜在的な問題が発生する可能性があるため、一部のマークアップケースはエラーとして定義されます。つまり、DOMで直感的で予期しない結果が発生することになります。

ドキュメントを検証すると、これらの潜在的な問題が警告されます。

3
sideshowbarker

ビルドシステム GulpJs を使用して、私が書いたプラグインを試してみてください。

変換中ng-directivesからdata-ng-directivesこれは、html5検証用のW3Cの仕様です。

厳しくテストされており、ここにあります： https://github.com/pgilad/gulp-angular-htmlify

https://www.npmjs.com/package/gulp-angular-htmlify

2
Gilad Peleg

angularアプリで接頭辞「data-」を使用します。例：

<body data-ng-app data-ng-init="name = 'World'">
   <h1>Hello, {{name}}!</h1>
</body>
2
Dmitry Paloskin

あなたはできる install with npm：

$ npm install --save-dev gulp-angular-htmlify
2
Vivek Pokhriyal