参考にするリファレンスについて
とほほやHTML5リファレンスは最新の草案を反映しておらず内容が古い。
HTML5.JPにリストされていない要素は廃止もしくはHTML5.1に移動のため一旦削除されているので注意が必要。
HTML5.1各要素別メモも参考になる。
HTML5の要素
新要素はこれだけ
section,nav,article,aside,header,footer,main,figure,figcaption,video,audio,source,canvas,mark,time,data,ruby,rt,rp,rb,rtc,wbr,bdi,details,summary,template,dialog,progress,meter,output,datalist,keygen
[HTML5] 新要素まとめ【2014/2/14版勧告候補】 - Qiita
正式に仕様入りした要素
embed
変更された要素
strong,i,b,u,s,small,hr,address,cite,dl,a,label
[HTML5] 変更になった要素まとめ【2014/2/14版勧告候補】 - Qiita
廃止になった要素
basefont,big,center,font,strike,tt,frame,frameset,noframes,acronym,applet,isIndex,dir
HTML5.1に入る事になった要素(HTML5からは削除)
hgroup,command,menu
追加されたinputタイプ
search,tel,url,email,datetime,date,month,week,time,datetime-lodal,number,range,color
新グローバル属性
contenteditable,contextmenu,draggable,hidden,spellcheck,data-*
[HTML5] 新グローバル属性まとめ【2014/2/14版勧告候補】 - Qiita
マイクロデータ関連
itemid,itemprop,itemref,itemscope,itemtype
WAI-ARIA関連
role,area-*
新属性
[HTML5] 新しい属性が増えた要素まとめ【2014/2/14版勧告候補】 - Qiita
[HTML5] input要素まとめ【2014/2/14版勧告候補】 - Qiita
HTML5を読み解くキーワードたち
コンテンツ・モデル
ASCII.jp:3分でわかるHTML5のコンテンツモデルとカテゴリー (1/3)|浜 俊太朗のHTML5マークアップ移行ガイド
アウトラインをチェック
セマンティクス
- 新たな文脈を表す要素が多く追加
- いままでdivを使っていた部分は特に、他に適した要素がないか考慮
アクセシビリティ
HTML5 アプリケーションをビルドする - HTML5 によるアクセシビリティの設計
HTML5の周辺技術をチェックする
新時代の機能が満載!HTML5入門 新API一覧 | Web制作会社スタイル
ようこそ、HTML5裏APIの世界へ - HTML5 Conference 2013
CSS3
Canvas
Web GL
初心者でも絶対わかる、WebGLプログラミング<基礎知識編> | HTML5Experts.jp
CreateJS
[CreateJS] Canvasアニメーションを実装する時に便利で良く利用しているJSライブラリ、CreateJS - YoheiM .NET
CreateJSがWebGLを公式にサポート!爆速になったHTML5での描画パフォーマンスを検証してみた | ICS LAB
Selector API
連載:人気順に説明する初めてのHTML5開発:DOM操作の主流になるか!? セレクタAPIを使いこなそう - @IT
Drag&Drop API
連載:人気順に説明する初めてのHTML5開発:アドインなしで実現可能! ドラッグ&ドロップを使いこなそう (1/2) - @IT
Web Strage
連載:人気順に説明する初めてのHTML5開発:ブラウザでストレージ? Web Storageを使いこなそう (1/3) - @IT
Web Socket
連載:人気順に説明する初めてのHTML5開発:双方向通信を実現! WebSocketを使いこなそう (1/2) - @IT
Web Workers
連載:人気順に説明する初めてのHTML5開発:並列処理を実現!Web Workersを使いこなそう (1/2) - @IT
File API
連載:人気順に説明する初めてのHTML5開発:JavaScriptでファイル操作!? File APIを使いこなそう (1/2) - @IT
Geolocation
連載:人気順に説明する初めてのHTML5開発:位置情報をブラウザで活用! Geolocationを使いこなそう (1/2) - @IT
Indexed Database
連載:人気順に説明する初めてのHTML5開発:Webアプリもオフライン実行? Indexed Databaseを使いこなそう (1/2) - @IT
Web Audio API
Getting Started with Web Audio API - HTML5 Rocks
Application Cache
アプリケーション キャッシュ初心者ガイド - HTML5 Rocks
History API
HTML5 History API を徹底的に試してみる | nacika
Web Messaging
Web Messaging機能を試してみた - 一から勉強させてください( ̄ω ̄;)
Server Sent Events
Clipboard API
Progress Event
HTML5でプログレスバー付きファイルアップロードを実現する例:phpspot開発日誌
CORS
CORS(Cross-Origin Resource Sharing)について整理してみた | Developers.IO
Web Notifications
Web Notifications の使用 - WebAPI | MDN
Media Capture and Streams
スクリーンショットの取得
Capturing Audio & Video in HTML5 - HTML5 Rocks
HTML5の機能を検出する
ブラウザでHTML5の各機能が使える状態かどうか検出するためにはModernizr.jsを利用します。
Modernizr: the feature detection library for HTML5/CSS3
Modernizr.jsを使ってHTML5のクロスブラウザ問題に立ち向かう! - Taste of Tech Topics
HTML5文書として適切かチェックする
The W3C Markup Validation Service
HTML5の各ブラウザ対応状況を調べる
Can I use... Support tables for HTML5, CSS3, etc
その他
参考URL
HTML 要素 - HTML5タグリファレンス - HTML5.JP
HTML5.1各要素別メモ
HTML5プロフェッショナル認定試験 無料セミナー - Qiita
ゼロからはじめるHTML5でのサイト制作-目次 - MdN Design Interactive
参考書
Amazon.co.jp: 徹底解説HTML5マークアップガイドブック: 羽田野太巳: 本
Amazon.co.jp: カルタ付 HTML5マークアップ 現場で使える最短攻略ガイド (WEB PROFESSIONAL): 浜俊太朗: 本