第 1 章 HTML5 の概要_html/css_WEB-ITnose

学習ポイント:

1. HTML5 の歴史
2. HTML5 の機能
3. HTML5 の特徴
4. コースの学習上の問題

講師: Li Yanhui

HTML5 は HTML4 の後継です。 01 および XHTML1.0 以降の最新バージョンの Hypertext Markup Language。 自由な発想を持つチームによって設計され、その結果、マルチメディアのサポート、インタラクティブ性、よりスマートなフォーム、より優れたセマンティック マークアップが実現しました。

HTML5 は単なる HTML 仕様の最新バージョンではなく、最新のリッチ Web コンテンツを作成するために使用される一連の関連テクノロジーの総称です。最も重要な 3 つのテクノロジーは、HTML5 のコア仕様 (タグ要素)、CSS (カスケード スタイル) です。シート第 3 世代)、および JavaScript。

1つ。 HTML5 の歴史 HTML は 1993 年にインターネット ドラフトとして初めてリリースされ、その後 2.0、3.2、4.0 を経て、1999 年の HTML4.01 バージョンが安定しました。開発が遅かったため、徐々により厳密な XHTML に置き換えられました。

XHTML の盛衰 バージョン HTML4.01 以降、HTML 仕様を管理する World Wide Web Consortium (W3C) 組織は新しい標準をリリースしていませんが、XHTML1.0 およびそれ以降の XHTML2.0 を中心に取り組んできました。 XHTML は、より厳格で統一されたコーディング標準の実現を目的とした XML ベースの HTML のバージョンで、以前の HTML4.01 バージョンでの非標準コーディングによって引き起こされたブラウザのさまざまな奇妙な動作を解決します。したがって、Web 開発者は XHTML を非常に支持しています。 XHTML の大きな利点は、開発者が適切なコーディング習慣を身につけ、面倒な HTML の記述を放棄することを強制できることです。これにより、最終的にブラウザによるページの解析の困難さが軽減され、より多くのプラットフォームへの移植が容易になります。
しかし、より良い方向に発展しようとすればするほど、壊滅的な災害を引き起こすことは、世の中のあらゆることに当てはまります。 XHTML2.0 では、より厳格なエラー処理ルールが指定されており、ブラウザーに無効な XHTML2 ページを拒否するよう強制し、Web 開発者に下位互換性がない一方で完全に正しい標準化されたコードを作成するよう強制し、HTML が残した奇妙な動作やコーディング習慣を放棄します。論理的に言えば、本質を取り、カスを捨てるのが良いことのはずです。ただし、この場合、何億ものページが互換性がなく、Web 開発者にとってはさらに困難になり、この標準を策定するのに時間がかかりすぎて、最終的には廃止されることになります。

HTML5の復活 2008年にW3CがHTML5のワーキングドラフトをリリースし、2009年にXHTML2計画は中止されました。約 1 年後、HTML5 仕様によって多くの実際的な問題がさらに解決され、主要なブラウザ メーカーは HTML5 をサポートするために製品をアップグレードし始めました。このように、ブラウザーからの実験的なフィードバックのおかげで、HTML5 仕様は改善を続け、Web プラットフォームの大幅な改善に迅速に統合されます。
HTML5の仕様を策定した人々は、XHTML2.0とは異なり、これまでのHTMLのさまざまな欠点を取り出して修正するのではなく、Web開発者が緊急に必要とするさまざまな機能を完成させるために全力を尽くしました。これらの機能には、より強力な CSS3、フォーム検証、オーディオとビデオ、ローカル ストレージ、位置情報、ペイント (キャンバス)、Web 通信などが含まれます。

2つ。 HTML5の機能 HTML5はどのような機能をカバーしているのでしょうか？これらの機能は主流のブラウザでどの程度サポートされていますか?

1.HTML5 コア: この部分は主に W3C 公式仕様で構成されており、新しいセマンティック要素、新しい強化された Web フォーム、オーディオとビデオ、JavaScript を介して描画するための Canvas が含まれます。この部分はほとんどの主流ブラウザで十分にサポートされています。 2. 元の HTML5 標準
: この部分は主に元の HTML5 仕様から来ており、そのほとんどは JavaScript を必要とし、リッチな Web アプリケーション開発をサポートしています。例: ローカル データ ストレージ、オフライン アプリケーション、メッセージング。 3. 非 HTML5 標準: この部分は通常、HTML5 標準に組み込まれたことはありませんが、依然として HTML5 の一部として認識されています。これらには、最も一般的な CSS3 と非常に一般的な地理位置情報が含まれます。 最も一般的に使用される実用的な部分については、基本的にすべての主流ブラウザがそれらを適切にサポートしています。 特別なニーズがある部分については、ブラウザごとに必要な機能をサポートしているかどうかを確認する必要があります。

3つ。 HTML5 の特徴

HTML5 が発展する一方で、XHTML2.0 も継続的に発展しています。では、HTML5 の最終的な勝利につながる特徴は何でしょうか?

1. 下位互換性

XHTML2.0はルールに従う必要があり、そうでないと表示されませんが、HTML5は「Webを破壊しない」という原則を実装しています。つまり、過去に存在したWebページも引き続き正しく表示できるのです。 もちろん、開発者にとって、HTML5 仕様は、過去の悪いコーディング習慣と放棄されたタグ要素の放棄を要求しますが、ブラウザーのメーカーにとっては、下位互換性を達成するために HTML が残したすべてのものと互換性があることを要求します。

2. ユーザーファースト
HTML5は「ユーザーファースト」の原則に従い、特定の問題が発生した場合、ユーザーが最初に優先され、次に開発者、次にブラウザメーカー、最後に仕様作成者が優先されます。たとえば、開発者がコーディングを厳密に行っていなかったため、警告やエラーが発生するはずのときにページが正常に表示されました。

3. 複雑さを単純化する
以前の XHTML と比較して、HTML5 は多くの単純化作業を行っています。詳細は次のとおりです。
(1) 複雑な JavaScript を置き換えるために、DOCTYPE が極限まで簡素化されます。
(4)。強力な API 。

4. プラグインフリーのパラダイム

HTML5 が登場する前は、多くの機能はプラグインまたはハック (描画 API など) を介してのみ実現できましたが、HTML5 はこれらのサポートをネイティブに提供します。プラグインの使用には、次のような多くの問題があります: (1) プラグインのインストールが失敗しやすいです
(2) プラグインがブラウザまたはソフトウェアによって無効化され、ブロックされます。 );
(3). プラグインには脆弱性が存在し、悪用された攻撃がブロックされることがよくあります (4)。


5. アクセシビリティ

この原則は 3 つの概念に分かれています: (1) アクセシビリティ: たとえば、障害のある人にとってより役立つ読書ソリューション (2) メディアの中立性: たとえば、HTML5 メディア。再生 さまざまなデバイスやプラットフォームを正常に実行できます
(3). 新しい要素 など、すべての言語をサポートします。


6. セマンティクスの導入

HTML5 では、さまざまな意味とコンテンツを区別するためにいくつかのマークアップ要素が導入されています。 このアプローチにより、コーダーの読みやすさが大幅に向上し、コード領域のクエリが容易になります。
7. ネイティブ メディア サポートの導入

HTML5 の大幅な改善により、Lifejacket はブラウザでのビデオおよびオーディオ ファイルの直接再生をサポートしました。これまでは、そのような機能を実現するにはプラグインが必要でした。
8. プログラム可能なコンテンツの導入

HTML5 の最大の変更点は、JavaScript プログラミングを必要とするさまざまなエフェクトの導入であり、その多くは HTML5 にネイティブです。したがって、HTML5 は HTML + CSS + JavaScript の総称として理解できるようになりました。
4つ。コース学習の問題

HTML5 を学習するには、テスト用のブラウザ、コーディング用の開発ツール、および推奨される学習方法が必要です。
1. ブラウザの選択

IE9+ Firefox 3.5+

Chrome 3.0+

Safari 3.0+
Opera 10.5+

ここでのポイントはIEブラウザです。歴史的およびシステム上の理由により、かなりの数のコンピュータが依然として IE9 より前のバージョンのブラウザを使用しています。 Microsoft は IE8 を維持しないとの声明を発表し始めていますが、このグループは依然として一定のシェアを占めています。したがって、このグループのユーザーに対応するかどうかは、市場とコストの考慮事項に対する個人的な判断に依存します。

2. 開発ツール

このコースでは、HTML5 コースのコーディング ツールとして Sublime Text3 を使用します。ソフトウェアインターフェイスのテーマとしてSoda Dark 3が使用されています。
3. 学習方法

基本的には初心者向けのコースとなっておりますが、すでにXHTMLコースの基礎を身につけている方であれば、非常に簡単に学ぶことができます。もちろん、XHTML の基本はすでに記録されていますが、HTML5 コースを記録するときは、依然としてすべての学生を初心者として扱います。 もちろん、ここで言うゼロベースや初心者にもある程度の経験は必要ですが、私たちは長年の指導の仕事のせいで、QQも使えない、メールも送れない、という生徒たちとたくさん接してきました。サンダーがダウンロードできない。これらの学生は初心者前であり、基本的な知識がないため、初心者であれば通常は大きな問題はありません。