W3C仕様日本語訳置き場WikiYou signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
あなたがまだ使っていないかもしれないHTML5の便利機能10選 - Qiita
こんにちは、たかとーです🧑🎤 こちらは、10 useful HTML5 features, you may not be usingの翻訳記事になります。 当記事は、Tapasさんの許可を得て翻訳しています。Tweet 10 useful HTML5 features, you may not be using HTML5は新しいものではありません。最初のリリース（2008年1月）以来いくつかの機能を使用してきました。100DaysOfCodeの取り組みの一環として、HTML5の機能リストをもう一度よく見てみました。何か見つけたかな？私は今のところあまり使っていません。 この記事では、過去にあまり使ったことがなかったが、今では便利になったHTML5の機能を10個挙げています。また、Netlifyでホストされている、実際に動作する例を作成しました。参考になることを願っています。 htt
知っておくと便利なHTML5の機能、要素や属性のまとめ
今まであまり使用されていなかったけど、現在の環境では有用であるHTML5の便利な機能、要素や属性を紹介します。 10 useful HTML5 features, you may not be using by Tapas Adhikary 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに details要素 contenteditable属性 map要素 mark要素 data属性 output要素 datalist要素 値range meter要素 input要素 次に学ぶべきこと はじめに HTML5は、新しいものではありません。すでにわたし達は最初のリリース（2008年1月）からいくつかの機能を使用してきました。#100DaysOfCodeの取り組みの一環として、HTML5の機能リストを詳しく調べました。私が見つ
HTML5 入れ子チートシート | 吉川ウェブ
HTML 5.2のそれぞれの要素が入れ子にできる「子要素」、包含されることが可能な「親要素」の一覧のルールを視覚化して表示します。 ※1 a要素の親要素が包含可能であること※1 audio要素の親要素が包含可能であること※1 canvas要素の親要素が包含可能であること※1 del要素の親要素が包含可能であること※1 ins要素の親要素が包含可能であること子要素省略※1 map要素の親要素が包含可能であること※1 noscript要素の親要素が包含可能であること かつ body要素の子孫であること子要素省略※1 video要素の親要素が包含可能であること ルート要素＆文書メタデータ html 親 子 head 親 子 title 親 子 base 親 子 link 親 子※HTML 5.2から可能。フレージングコンテンツが期待される場所※head要素の子孫であること meta 親 子※he
なんとなくで書かないで！HTML5を書く時に気にしてみたいタグごとのお約束 - Qiita
はじめに この記事は クラウドワークスアドベントカレンダー2019 16日目の記事です。 こんにちは！本日25回目の誕生日を迎えたアクセシビリティ向上隊長 みーたです。 昨日は同じチームの@yamanokuさんによる「みんなに知ってもらいたいデザインシステムのこと」でした。 文中で紹介されていた「悲劇的なデザイン」は私もオススメします:) 私は今回、普段みなさんがHTMLを書く時に、よく使うタグごとでちょっと気をつけてみてもらいたい！と思う点をまとめてみました。 初学者ではありますが、正しくHTMLを理解してもらいたいって気持ちがあるので、マサカリは怖くない程度に投げていただいて、みんなで知識を共有していきたいです。 👻 真冬の怪談 突然ですがちょっと怖い話を... 先日、とある画面を改修しようと思って、今どんな感じにスタイル当たってるんだろうと本番環境を見てみたんですよ。 カードタイプ
WHATWG版とW3C版の主な差異：HTML5.3各要素別メモ
目次に戻る WHATWG版とW3C版の主な差異：HTML5.3各要素別メモ 細かい差異は、いちいち取り上げない。 W3C版では外部仕様だけど、WHATWG版ではHTML仕様本体に含まれているもの Microdata→グローバル属性としてのitemscope属性、itemprop属性、itemtype属性、itemid属性、itemref属性。 WHATWG版のみに存在するもの カテゴリーとしてのAutocapitalize-inheriting element グローバル属性としてのinputmode属性 グローバル属性としてのenterkeyhint属性 イベントハンドラ属性としてのonsecuritypolicyviolation属性 イベントハンドラ属性としてのoncontextmenu属性 イベントハンドラ属性としてのonformdata属性 body要素のonmessageerr
W3Cで現在公開されているHTMLとDOM仕様は将来廃止されます - 水底の血
まえがき W3C（とWHATWG）からの公式なアナウンスはまだ確認していませんが、何度目かに結成されるW3C HTML WorkingのDraft Charterと、このCharterから辿れるDRAFT Memorandum of Understanding Between W3C and WHATWG（Memorandumは日本語で覚書などと訳されるので、ここでも覚書と呼びます）がブログエントリーのタイトルのソースになります。もっとも、今確認できる覚書もドラフトですから、変更があるかもしれません。しかしながらURLで観測できるわけですから、大筋でW3CとWHATWGとの間で合意が取れているのではないかと推測します。あとは、覚書だけでなくCharterもドラフトということになっていますが、以下の文章では面倒なので省略します。最後にお約束ですが、このブログエントリーは「だいたいあってる」感
フロントエンドでバイナリファイルを扱うためのBlobオブジェクトとFileオブジェクト - 30歳からのプログラミング
このエントリで紹介するBlobやFile、FileReaderはHTML5で利用可能になったAPIで、ECMAScriptで定義されているわけではない。 そのため、Node.jsには存在せず、ブラウザ環境でのみ利用できる。 Blob Blobは、バイナリデータを表すimmutableなオブジェクト。 const blob = new Blob(['<xml>foo</xml>'], {type: 'text/xml'}); console.log(blob); // Blob(14) {size: 14, type: "text/xml"} 第二引数で設定しているtypeで、MIMEを設定できる。 何も設定しなかった場合は空の文字列になる。 File Fileはその名の通りファイルを表すオブジェクトで、Blobを継承している。 const file = new File(['<xml>fo
HTML 5.2の新機能・削除された機能、変更された記述ルールのまとめ
HTML 5.2は2017年12月14日に勧告（Recommendation）され、仕様がRECステージに達しました。これはW3Cメンバーとディレクターの正式な承認を受けたことを意味し、Web制作者として、新しい機能の実装を開始するのに最適な時期になります。 HTML 5.2ではいくつかの新機能と削除された機能があり、記述ルールもいくつか変更され、今までinvalidだったものがvalidになり、新しくinvalidになったものもあります。 すべての変更点はHTML 5.2: Changesで確認することができます。 Web制作に最も影響を与えると思われるいくつかの変更点について説明します。 What's New in HTML 5.2? 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 HTML 5.2の新機能 HTML 5.2
W3C、「HTML 5.2」勧告。同時にHTML 5.3のファーストドラフトを公開
Web技術の標準化団体であるW3Cは、HTML 5のマイナーバージョンアップである「HTML 5.2」の策定を完了し、勧告としました。 HTML 5.2ではいくつかの機能追加、削除、バグフィクスなどが行われています。 機能追加の例では、ダイアログボックスを表示する＜dialog＞要素が追加されました。下記は＜dialog＞要素を用いたサンプルです。 ... <body> <div> <!-- body content --> </div> <dialog> <h1>Add to Wallet</h1> <label for="num">How many gold coins do you want to add to your wallet?</label> <div><input name=amt id="num" type=number min=0 step=0.01 value=10
HTML5/CSS3モダンコーディング 読了 - rochefort's blog
HTML5/CSS3モダンコーディング フロントエンドエンジニアが教える3つの本格レイアウト スタンダード・グリッド・シングルページレイアウトの作り方 (WEB Engineer’s Books) 作者: 吉田真麻出版社/メーカー: 翔泳社発売日: 2015/11/03メディア: 大型本この商品を含むブログを見る 非常に良いです。とても身のある本でした。 対象は、初級者から中級者程度かな。入門書ではないです。 IE9以降の基本となる内容でした。 いつもはbootstrap使っちゃうエンジニア向けにもいいと思います。 最近はあまりhtml/css書かないので、知らないことが沢山あってとても楽しかったです。 例えば以下のようなお話。 rem と font-size: 62.5%; html に font-size: 62.5%: を指定しており、その理由が 主要ブラウザのデフォルトフォントサイ
HTML 5.1で追加されたHTMLフォームの検証メソッドとPromise関連の新機能
HTML 5.1で追加されたHTMLフォームの検証メソッドとPromise関連の新機能：特集：HTML 5.1概説（1/3 ページ） HTML 5.1で追加された新機能のうち、フォームの検証に使用できるreportValidityメソッドと、Promiseオブジェクトに関連した新機能を紹介する。 連載目次 HTML 5.1で追加された新機能の中から、本稿ではフォームの検証に使用できるreportValidityメソッドと、Promise関連の新機能を見ていくことにしよう。なお、本稿では「HTML 5.1」のようにマイナーバージョンを含むHTMLの表記には「HTML」とバージョンの間に半角スペースを挟むことにする。 HTMLInputElement.reportValidityメソッド 最初に「HTML 5.1 Implementation report」ページに記載されている「report
Uhyohyo web 2013 - HTML講座
HTML5講座 皆さんが日々見ているWebサイト。それを作るためのものがHTMLです。 様々なWebサイトを見て、自分もこういうものを作りたいと志す人も多いことと思います。そんな方たちのためのHTML入門のサイトとなるべくこのコンテンツを作りました。 というのも、実際のところ、現在（2011年）既に数多くのHTML入門サイトが存在していますが、質が低いものも多いと感じています。もちろん全てがそうだとは言いません。 ということで、質の高いサイトを目指していきます。 はじめに HTMLとは？ この講座の読み方 HTML編 第一章 HTMLの基本 HTMLのファイル タグとは HTMLの構造 HTMLの形式とブラウザ 第二章 基本的なコンテンツ 文章を書く 文字列のマークアップ マークアップとHTMLの理念 属性 文字列のマークアップ2 第三章 HTMLの構造 見出し セクションとは artic
新しいHTML5.1を使いこなせてますか？【HTML5.1新機能７選】｜SeleQt【セレキュト】
この記事ではHTML5.1の興味をそそる新機能を紹介します！ これらの機能はまだブラウザでサポートされていないものもありますが、紹介する機能に対応したブラウザを使ったと想定して説明します。 menu/menuitems要素を用いてContext Menuを利用 HTML5.1は二つの異なるmenu要素を使用します。contextとtoolbarです。 前者はもとから備わっているcontext menuを拡張するために利用し、後者は一般のメニューコンポーネントを表示する目的で利用します。開発の過程でtoolbarは廃止されましたが、contextメニューは残されました。 menuタグを使うと複数の<menuitem>要素からなるメニューを表示し、contextmenu属性を使ってあらゆる要素にメニューを結びつけられます。 この機能はFirefox49ではサポートされていますが、Chrome5
HTML 5.1で変更されたsection要素の使い方、header要素とfooter要素のネストについて解説
2016年11月1日に、HTML 5.1が勧告されました。HTML 5から新しく加えられた点、削除された点、変更された点がいろいろあります。 その中から、ページのアウトラインを組み立てる上で重要なsection要素の使い方、header要素とfooter要素のネストについて具体的な事例を添えて紹介します。 Document Outlines in HTML 5.1 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 私は以前、HTMLのページにvalidなアウトラインを持つ重要性について説明しました。 先日、HTML 5.1が公式にリリースされました。 興味深い変更が数多くあり、そのうちの2つはvalidなアウトラインに関係しています。 削除 アウトラインを作成するh1要素を入れ、ネストされたsection要素の使用。 変更 hea
HTMLチェッカーはchecker.html5.orgを推してみたい - 水底の血
次の3つのチェッカーについて、 Validator.nu Living Validator https://validator.nu/ Nu Html Checker https://validator.w3.org/nu/ Nu Html Checker https://checker.html5.org/ 次のHTMLコードを投入して比較してみたよという話。 <!DOCTYPE html> <html> <head> <title>Test</title> </head> <body> <!-- dlの中のdivは現時点のHTML 5.2に規定されない --> <dl> <div> <dt> Last modified time </dt> <dd> 2004-12-23T23:33Z </dd> </div> <div> <dt> Recommended update interva
HTML 5.1
HTML 5.1はHTML5の最初のマイナーバージョンアップであり、Webアプリ開発に役立つさまざまな機能が追加されている。 連載目次 HTML 5.1とは HTML 5.1*1は2016年11月1日にW3Cによって勧告されたHTMLの言語仕様。 現在ではHTMLの言語仕様自体はWHATWGとW3Cによって策定が進められているが、前者はWebの進化を推進するためのもの（HTML Living Standard）、後者は「HTML Living Standard」を基にW3Cの仕様策定プロセスにのっとった言語仕様の安定的なスナップショットとなる点が異なる*2。最新のWeb標準をフォローするには前者をチェックするのがよい。 HTML 5.1で仕様に追加された機能としては、以下のようなものがある（抜粋）。 <picture>要素、srcset属性： デバイスの画面特性に応じて表示する画像ファイル
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML 5.2
h1要素は複数回使って良いのか!? HTML5.1に関するW3CとWHATWGの主張の違い
WAI-ARIAを活用したJavaScriptによるDOM操作
