HTML 5 の設計原則の紹介
はじめに:
HTML5 は、Web コンテンツを構築するための言語記述方法です。 HTML5 はインターネットの次世代標準であり、インターネット コンテンツを構築および表示するための言語方式です。インターネットの中核技術の 1 つと考えられています。 HTML は 1990 年に作成され、HTML4 は 1997 年にインターネット標準となり、インターネット アプリケーションの開発に広く使用されています。
実は、html5 は w3c によって直接策定されたものではなく、w3c の方向性は html5 ではなく xhtml2 です。 xhtml2 が現実と乖離しており、実用化できないと、w3c ワーキング グループは研究の方向性を html5 に切り替えました。なぜ xhtml2 は実現しなかったのでしょうか?それは、有名なバーシュタールの法則である、送信するときは保守的であり、受信するときはオープンであるという設計原則に違反するためです。 html5 の設計プロセスでは一連の原則が採用され、html5 を迅速に推進できるようになりました。この記事では、html5
不必要な複雑さを避ける
html4
<!DOCTYPE html PUBLIC "-//W3C/DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
html5
<!DOCTYPE html>
html4
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> html5 <meta charset="utf-8">
既存のコンテンツのサポート
次の 4 つのコードは、xhtml では最初の段落のみが正しいですが、html5 ではすべて正しいです
<img src="foo" alt="bar" /> <p class="foo">Hello world</p> <img src="foo" alt="bar"> <p class="foo">Hello world <IMG SRC="foo" ALT="bar"> <P CLASS="foo">Hello world</P> <img src=foo alt=bar> <p class=foo>Hello world</p>
(学習ビデオの共有: html ビデオ チュートリアル)
現実の問題を解決する
HTML4 では、2 つのブロックレベル要素が同じリンク アドレスを持つ場合でも、別々に記述する必要があります。インライン要素にはブロック レベルの要素を含めることができないためです
<h2><a href="/path/to/resource">Headline text</a></h2> <p><a href="/path/to/resource">Paragraph text.</a></p>
また、HTML5 では、コンテンツ モデルの使用により、 要素にはブロック レベルの要素も含めることができます
<a href="/path/to/resource">
<h2>Headline text</h2>
<p>Paragraph text.</p>
</a>コンテンツモデル
html5 は、セクション、記事、サイド、ナビなどの多数の新しい要素を追加します。これらは、新しいコンテンツ モデル、つまりコンテンツの分割を表します。これまで人々は div を使用してページ上のコンテンツを整理してきましたが、他の同様の要素と同様に、div 自体にはセマンティクスがありません。しかし、section、article、side、nav は、実際には、このセクションが文書内の別の文書のようなものであることを明確に伝えています。これらの要素内にあるコンテンツには、独自の概要、独自のタイトル、独自のフッターを含めることができます。
スムーズな劣化
ブラウザは、認識できない type 値を検出すると、type の値を text として解釈します
input type="number" input type="search" input type="range" input type="email" input type="date" input type="url"
関連する推奨事項: html5 チュートリアル
以上がHTML 5 の設計原則の紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
AI Hentai Generator
AIヘンタイを無料で生成します。
人気の記事
ホットツール
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
ドリームウィーバー CS6
ビジュアル Web 開発ツール
SublimeText3 Mac版
神レベルのコード編集ソフト（SublimeText3）
ホットトピック
C# 開発経験の共有: オブジェクト指向プログラミングと設計原則
Nov 22, 2023 am 08:18 AM
C# (CSharp) は、ソフトウェア開発の分野で広く使用されている強力で人気のあるオブジェクト指向プログラミング言語です。 C# 開発プロセスでは、オブジェクト指向プログラミング (OOP) の基本概念と設計原則を理解することが非常に重要です。オブジェクト指向プログラミングは、現実世界の物事をオブジェクトに抽象化し、オブジェクト間の対話を通じてシステム機能を実装するプログラミング パラダイムです。 C# では、クラスはオブジェクト指向プログラミングの基本的な構成要素であり、オブジェクトのプロパティと動作を定義するために使用されます。 C# を開発する場合、いくつかの重要な設計原則があります。
C++ クラスの設計原則は何ですか?
Jun 02, 2024 pm 03:30 PM
C++ ではクラス設計の原則が重要であり、次の 5 つの原則は効果的で保守可能なクラスの作成に役立ちます。 単一責任の原則: 各クラスは 1 つのタスクのみを担当します。オープンクローズの原則: クラスは変更せずに拡張できます。依存関係逆転の原則: モジュールは、具体的な実装ではなく、抽象インターフェイスに依存します。インターフェイス分離の原則: インターフェイスは可能な限り小さく、対象を絞ったものにする必要があります。リスコフ置換原則: サブクラスは親クラスをシームレスに置き換えることができます。
REST APIデザインの原則とは何ですか？
Apr 04, 2025 am 12:01 AM
Restapiの設計原則には、リソース定義、URI設計、HTTPメソッドの使用、ステータスコードの使用、バージョンコントロール、およびHATEOASが含まれます。 1。リソースは名詞で表され、階層で維持される必要があります。 2。HTTPメソッドは、GETを使用してリソースを取得するなど、セマンティクスに準拠する必要があります。 3.ステータスコードは、404など、リソースが存在しないことを意味します。 4。バージョン制御は、URIまたはヘッダーを介して実装できます。 5。それに応じてリンクを介してhateoasブーツクライアント操作をブーツします。
Go 言語での RESTful API 設計の原則
Jan 22, 2024 am 11:23 AM
インターネット アプリケーションの急速な発展に伴い、RESTfulAPI は多くの Web アプリケーションの中核設計となり、高速で効率的なプログラミング言語として Go 言語が徐々に RESTfulAPI の開発に好まれる言語になってきました。 Go 言語では、RESTful API の設計原則も非常に重要です。以下では、Go 言語で高品質の RESTful API を開発するのに役立ついくつかの重要な原則を紹介します。単一責任の原則 Go 言語では、単一責任の原則が広く使用されています。
学校管理システムの MySQL テーブル構造の設計原則
Oct 31, 2023 am 10:10 AM
MySQL テーブル構造の概要 学校管理システムの設計原則 現代の教育業界では、学校管理システムが重要な役割を果たしています。学校が生徒、教師、コース、その他の主要な業務を効率的に管理するのに役立ちます。 MySQL は、学校管理システムのデータベースを設計する場合に強力なツールです。この記事では、学校管理システムの MySQL テーブル構造の設計原則を紹介し、具体的なコード例を示します。 1. 標準化されたデータベース設計 データベースを設計する場合、標準化は重要な原則です。標準化により、データベースのデータが確実に保存されます。
データベース制約設計の原則: PHP プログラミングのヒント
Jun 22, 2023 pm 08:22 PM
PHP プログラミングでは、データベース制約の設計は非常に重要な部分です。データベース制約により、データの整合性、一貫性、セキュリティが保証され、データが悪意を持って改ざんされたり、誤って挿入されたりするのを防ぐことができます。したがって、この記事では、PHP プログラミングにおけるデータベース制約設計の原則とテクニックを紹介します。 1. 主キーと外部キー 主キーは、リレーショナル テーブル内の各レコードを一意に識別する列または列のセットです。テーブルを作成するときは、必ず主キーを定義する必要があります。主キーによりデータの一意性が確保され、クエリ時のデータの取得が高速化されます。外部キーはリレーショナル データベースにおけるもう 1 つの重要な制約です
優れたユーザー インターフェイスの構築: Webman の設計原則とガイドライン
Aug 13, 2023 pm 07:24 PM
優れたユーザー インターフェイスの構築: WebMan のデザイン原則とガイドライン インターネットの急速な発展に伴い、ユーザー インターフェイスのデザインは Web サイトやアプリケーションの重要な部分になりました。優れたユーザー インターフェイスはユーザー エクスペリエンスを向上させるだけでなく、ユーザーの満足度とロイヤリティも向上します。この記事では、優れたユーザー インターフェイスの作成に役立つ WebMan の設計原則とガイドラインをいくつか紹介します。 1. シンプルで明確なインターフェイス シンプルで明確なインターフェイスは、明確なガイダンスとナビゲーションを提供し、ユーザーが Web サイトや Web サイトを理解し、使用することを容易にします。
Java 関数の設計原則とベスト プラクティス
Apr 20, 2024 am 08:21 AM
適切な機能設計原則とベスト プラクティスに従うと、理解しやすく効率的な Java コードを作成することができます。これらの原則には、単一責任、オープン/クローズ、低結合と高凝集が含まれます。ベスト プラクティスには、命名規則、パラメーターの設計、例外処理、ドキュメント、テストが含まれます。これらの原則に従うことで、2 つの数値の平均を計算する関数など、高品質で再利用可能で保守可能な関数を作成できます。
