どうしてHTML5が廃止されたのか | フューチャー技術ブログ
フロントエンド連載の5記事目です。 HTML5が2021年の1月に廃止されました。 Webエンジニアとしてバリバリ活躍されてる方やエグゼクティブテックリードのような肩書きを持つ方にとっては「何をいまさら」という話題かと思います。 しかしながら、今年も新人さん入ってきてくださったので、プログラミングを学習中にHTML5という文字列に悩まされないように、そもそもHTML5とは何かや、廃止された経緯をまとめてみます。 HTML5とはWebサイトを作るときに必ず書くことになるHTML。Webサイトのコンテンツ、つまり中身や構造を作るために使うマークアップ言語です。 そして、その最近版として10年ほど前に登場したHTML5。当時は Webニュースなどで盛んに特集が組まれていましたが、このHTML5がついこないだ、2021年1月28日に廃止されました。 広義のHTML5 / 狭義のHTML5HTML5
HTML Living Standard
Table of contents 1 Introduction2 Common infrastructure3 Semantics, structure, and APIs of HTML documents4 The elements of HTML5 Microdata6 User interaction7 Loading web pages8 Web application APIs9 Communication10 Web workers11 Worklets12 Web storage13 The HTML syntax14 The XML syntax15 Rendering16 Obsolete features17 IANA considerationsIndexReferencesAcknowledgmentsIntellectual property rights F
<details>: 詳細折りたたみ要素 - HTML: ハイパーテキストマークアップ言語 | MDN
<details> は HTML の要素で、ウィジェットが「開いた」状態になった時のみ情報が表示される折りたたみウィジェットを作成します。概要やラベルは <summary> 要素を使用して提供する必要があります。 折りたたみウィジェットはふつう、回転して開閉状態を示す小さな三角形を使用し、その隣のラベルと共に画面上に表現されます。 <summary> 要素の内容が折りたたみウィジェットのラベルとして使用されます。 <details> ウィジェットは 2 つの状態のうち 1 つを取ります。既定の閉じた状態は <summary> を使用して指定されたラベル文字列（または <summary> がない場合はユーザーエージェントが定義した既定の文字列）とウィジェット自身による三角形だけを表示します。 ユーザーがウィジェットをクリックするか、フォーカスしてスペースバーを押すと、ウィジェットは「ツイスト
<header> - HTML: HyperText Markup Language | MDN
HTML チュートリアル HTML の基本 HTML 入門 HTML 入門の概要 HTML を始めよう ヘッド部には何が入る? HTML のメタデータ HTML テキストの基礎 ハイパーリンクの作成 高度なテキスト整形 文書とウェブサイトの構造 HTML のデバッグ 評価課題: 手紙のマークアップ 評価課題: コンテンツのページの構造化 マルチメディアとその埋め込み マルチメディアとその埋め込みの概要 HTML の画像 動画と音声のコンテンツ object から iframe まで — その他の埋め込み技術 ウェブへのベクターグラフィックの追加 レスポンシブ画像 評価課題: Mozilla のスプラッシュページ HTML の表 HTML の表の概要 HTML の表の基本 HTML 表の高度な機能とアクセシビリティ 評価課題: 太陽系の惑星データの構造化 リファレンス HTML 要素 <a>
<figcaption>: 図キャプション要素 - HTML: ハイパーテキストマークアップ言語 | MDN
HTML チュートリアル HTML の基本 HTML 入門 HTML 入門の概要 HTML を始めよう ヘッド部には何が入る? HTML のメタデータ HTML テキストの基礎 ハイパーリンクの作成 高度なテキスト整形 文書とウェブサイトの構造 HTML のデバッグ 評価課題: 手紙のマークアップ 評価課題: コンテンツのページの構造化 マルチメディアとその埋め込み マルチメディアとその埋め込みの概要 HTML の画像 動画と音声のコンテンツ object から iframe まで — その他の埋め込み技術 ウェブへのベクターグラフィックの追加 レスポンシブ画像 評価課題: Mozilla のスプラッシュページ HTML の表 HTML の表の概要 HTML の表の基本 HTML 表の高度な機能とアクセシビリティ 評価課題: 太陽系の惑星データの構造化 リファレンス HTML 要素 <a>
<main> - HTML: ハイパーテキストマークアップ言語 | MDN
HTML チュートリアル HTML の基本 HTML 入門 HTML 入門の概要 HTML を始めよう ヘッド部には何が入る? HTML のメタデータ HTML テキストの基礎 ハイパーリンクの作成 高度なテキスト整形 文書とウェブサイトの構造 HTML のデバッグ 評価課題: 手紙のマークアップ 評価課題: コンテンツのページの構造化 マルチメディアとその埋め込み マルチメディアとその埋め込みの概要 HTML の画像 動画と音声のコンテンツ object から iframe まで — その他の埋め込み技術 ウェブへのベクターグラフィックの追加 レスポンシブ画像 評価課題: Mozilla のスプラッシュページ HTML の表 HTML の表の概要 HTML の表の基本 HTML 表の高度な機能とアクセシビリティ 評価課題: 太陽系の惑星データの構造化 リファレンス HTML 要素 <a>
<wbr>: 改行可能要素 - HTML: ハイパーテキストマークアップ言語 | MDN
HTML チュートリアル HTML の基本 HTML 入門 HTML 入門の概要 HTML を始めよう ヘッド部には何が入る? HTML のメタデータ HTML テキストの基礎 ハイパーリンクの作成 高度なテキスト整形 文書とウェブサイトの構造 HTML のデバッグ 評価課題: 手紙のマークアップ 評価課題: コンテンツのページの構造化 マルチメディアとその埋め込み マルチメディアとその埋め込みの概要 HTML の画像 動画と音声のコンテンツ object から iframe まで — その他の埋め込み技術 ウェブへのベクターグラフィックの追加 レスポンシブ画像 評価課題: Mozilla のスプラッシュページ HTML の表 HTML の表の概要 HTML の表の基本 HTML 表の高度な機能とアクセシビリティ 評価課題: 太陽系の惑星データの構造化 リファレンス HTML 要素 <a>
HTML5 - Indexed Database API - とほほのWWW入門
サンプルでは、DBの作成、データの追加、データの1件参照、データの全件参照、DBの削除を実装しています。Firefox 12, Chrome 19 で、動作を確認しています。 Indexed Database API Sample <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Indexed Database API Sample</title> <style> #message { margin: 1em; padding: 1em; border: 1px solid gray; font: 9pt Courier; white-space: pre; } </style> <script> var ver = 201205201; var indexedDB = window.indexedDB || wind
web.dev
Stay organized with collections Save and categorize content based on your preferences. Explore our growing collection of courses on key web design and development subjects. An industry expert has written each course, helped by members of the Chrome team. Follow the modules sequentially, or dip into the topics you most want to learn about.
オフライン ウェブ アプリケーション－HTML5のAPI、および、関連仕様
■オフラインでもウェブアプリケーションを利用可能に HTML5では、インターネットに接続していないオフラインの状態でも、 ユーザーがウェブアプリケーション（ウェブサイト）を利用できるようにするための、 キャッシュマニフェストと呼ばれる仕様が追加されています。 この仕様の基本的な仕組みは、ユーザーがインターネットに接続してウェブアプリケーションを利用した際に、 HTMLファイル・CSSファイル・JavaScriptファイル・画像ファイル…などの ウェブアプリケーションの利用に必要となるファイルをユーザーのローカル環境にダウンロード保存して、 次回からはオフラインでもウェブアプリケーションを利用できるようにするというものです。 このような仕組みでサーバー上のファイルをローカル環境にダウンロード保存することをキャッシュ（CACHE＝貯蔵所・貯蔵物）といいますが、 ウェブアプリケーションをオフライ
<mark>－HTML5タグリファレンス
<mark>タグは、文書内の該当テキストをハイライトして目立たせる際に使用します。 <strong>や<em>のようにその部分を強調することが目的ではなく、ユーザーが参照しやすいように目立たせることが目的です。 <mark>は、作者が重要と考えている箇所ではなく、ユーザーの操作に関連している箇所に使用します。 例えば、検索結果画面で文書中の検索ワード部分をハイライト表示する場合などに適しています。 ■HTML4.01からHTML5へのバージョンアップによる変更点 mark要素は、HTML5から新たに追加された要素です。 ■使用例 HTMLソース <h2><em>機能</em> の検索結果</h2> <p> HTML5では、これまでのHTML 4と同じようなHTML文書を作成する<mark>機能</mark>が改良されているのに加えて、ウェブアプリケーションを開発するための様々な仕様が新たに
<figure>: キャプションが付けられる図要素 - HTML: ハイパーテキストマークアップ言語 | MDN
HTML チュートリアル HTML の基本 HTML 入門 HTML 入門の概要 HTML を始めよう ヘッド部には何が入る? HTML のメタデータ HTML テキストの基礎 ハイパーリンクの作成 高度なテキスト整形 文書とウェブサイトの構造 HTML のデバッグ 評価課題: 手紙のマークアップ 評価課題: コンテンツのページの構造化 マルチメディアとその埋め込み マルチメディアとその埋め込みの概要 HTML の画像 動画と音声のコンテンツ object から iframe まで — その他の埋め込み技術 ウェブへのベクターグラフィックの追加 レスポンシブ画像 評価課題: Mozilla のスプラッシュページ HTML の表 HTML の表の概要 HTML の表の基本 HTML 表の高度な機能とアクセシビリティ 評価課題: 太陽系の惑星データの構造化 リファレンス HTML 要素 <a>
<input type="image">－HTML5タグリファレンス
<input>タグのtype属性の値にimageを指定すると、画像ボタンを作成します。 画像ファイルはsrc属性で指定します。画像ボタンにはalt属性が必須となります。 ■type="image"の場合に指定可能な属性 type="image" 画像ボタンを作成する name属性 ボタンに名前をつける value属性 ボタンの値を指定する src属性 ボタンに使用する画像ファイルのURIを指定する alt属性 type="image"の場合に、画像の代替テキストを指定（type="image"の場合には必須属性） height属性 type="image"の場合に、画像の高さを指定 width属性 type="image"の場合に、画像の幅を指定 formaction属性 送信先URLを指定 formenctype属性 送信するデータの形式を指定（application/x-www-for
<link>: 外部リソースへのリンク要素 - HTML: ハイパーテキストマークアップ言語 | MDN
HTML チュートリアル HTML の基本 HTML 入門 HTML 入門の概要 HTML を始めよう ヘッド部には何が入る? HTML のメタデータ HTML テキストの基礎 ハイパーリンクの作成 高度なテキスト整形 文書とウェブサイトの構造 HTML のデバッグ 評価課題: 手紙のマークアップ 評価課題: コンテンツのページの構造化 マルチメディアとその埋め込み マルチメディアとその埋め込みの概要 HTML の画像 動画と音声のコンテンツ object から iframe まで — その他の埋め込み技術 ウェブへのベクターグラフィックの追加 レスポンシブ画像 評価課題: Mozilla のスプラッシュページ HTML の表 HTML の表の概要 HTML の表の基本 HTML 表の高度な機能とアクセシビリティ 評価課題: 太陽系の惑星データの構造化 リファレンス HTML 要素 <a>
HTML［cite要素］作品のタイトルを表す - TAG index
cite要素は、作品のタイトルを表します。 デフォルトスタイル（イタリック体） <cite>作品のタイトルを表します</cite> cite要素は、ある作品について述べる場合に、その作品のタイトルを示す目的で使用します。また、引用元のタイトルを示す際にも使用することができます。 作品の例としては、書籍、映画、ゲーム、絵画、論文、Webサイト、展覧会、SNSの投稿、などが挙げられます。 次の例では、作品について言及する際に、その作品のタイトルをcite要素で示しています。 <p>私の好きな肖像画は<cite>モナ・リザ</cite>です。昔、この作品が日本に ...</p> 次の例では、引用元のサイト名を示しています。 <p><cite>TAG index</cite>には、<q>作品のタイトルを表します。</q>と書かれていました。</p> 次の例では、Webページのタイトルを示しつつ、引
<button>－HTML5タグリファレンス
<button>タグは、ボタンを作成する際に使用します。 type属性はボタンの種類を指定する際に使用します。 type属性の値には、以下の３種類のいずれかを指定することができます。 初期値はtype="submit"です。 type="submit" …… フォーム入力内容を送信するサブミットボタン（初期値） type="reset" …… フォーム入力内容をリセットするリセットボタン type="button" …… 何もしない汎用的な押しボタン form属性は、どのフォームと関連付けるかを指定する際に使用します。 <button>は初期値では直近の親要素となる<form>と関連付けられますが、 <form>のid属性の値と<button>のform属性の値を一致させることで、 ボタンを特定のフォームと関連付けることができます。 ボタンを任意の場所に配置できるので、ウェブアプリケーショ
<input type="submit">－HTML5タグリファレンス
<input>タグのtype属性の値にsubmitを指定すると、フォームの送信ボタンを作成します。 ボタンに表示させる[送信する]などのテキストは、value属性で指定します。 また、name属性は送信ボタンに名前を付ける属性ですが、<form>でデータが送信される際、 name属性で指定した名前とvalue属性の値が一組になって送信されます。 formaction属性（送信先URL）・ formenctype属性（送信するデータの形式）・ formmethod属性（送信方法）・ formnovalidate属性（入力されたデータの妥当性を確認しない）・ formtarget属性（フォーム送信するターゲット先）は、 <form>の属性でも同様の指定をすることができますが、 <input>要素側でこれらの属性を指定すると、<form>の指定より優先されます。 formaction属性・for
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML Standard 日本語訳
【HTML】dialogでモーダルを作ってみる - Qiita
HTML5 & CSS3 リファレンス - accesskey属性 （マウス操作の代替キー設定）