-
Notifications
You must be signed in to change notification settings - Fork 4
/
640.txt
603 lines (453 loc) · 26.3 KB
/
640.txt
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
[1] 2007年頃から流行りだした[[バズワード]]としての [DFN[[[HTML5]]]] は、
色々な [[Web]] 技術を指す言葉です。
[2] 元々 [[HTML5]] は [[Web Forms 2.0]] と [[Web Applications 1.0]] により規定される
[[HTML]] の[[文書]]の構文や [[API]] の総称でした (2005年から2008年くらいまで) が、
次第にその意味が拡大していきました。
;; 元々の [[HTML5]] については、 [[HTML5 (仕様)]] を参照。
[3] 2008年から2010年頃には、
00年代半ば以降に [[Webブラウザー]]に追加された [[Web API]]、[[CSS3]]、
[[JavaScript]] などの新機能はすべて [[HTML5]] と呼ばれるようになりました。
[4] その後 [[HTML5]] は「[[Web]]」と同じ意味と理解せざるを得ないほど広い範囲を指すようになっています。
[EG[
[5] 例えば[[スマートフォン]]の[[アプリ]]開発においては、しばしば[[ネイティブアプリ]]と
「[[HTML5]] アプリ」は対立する開発手法として言及されます。この場合の [[HTML5]]
は [[HTML]] の他 [[CSS]]、[[DOM]]、[[JavaScript]]、 [[HTTP]] その他 [[Web]]
関連技術全体を表しています。
]EG]
;; [11] [[HTML5]] 仕様以前から [[HTML]] に含まれていた機能もまた [[HTML5]]
と呼ばれることがよくあります。
;; [13] その一方で「[[Webサイト]]に [[HTML5]] を導入」といった謎の表現も未だに使われており、
“[[HTML5]] でない [[Web]]”も残っているようです。謎は深まります。 [TIME[2015-02-23T02:41:14.300Z]]
;; [6] 同じ意味の[[バズワード]]として、過去には [[HTML 3.0]]、[[HTML 4.0]]、
[[DHTML]] がありました。 [[Ajax]] も近いですが、 [[HTML5]] はそれ以上に広い範囲を指しているようです。
;; [7] この結果 [[HTML5]] という言葉は意味をなさなくなり、仕様としての [[HTML5]]
は [[HTML]] ([[HTML Standard]]) に改称されています。
[54] 仕様としての [[HTML5]] が消滅した2011年以後の新機能も、
[[HTML5]] (バズワード) の一部ということになっているようです。
[25] 類義語に「HTML5関連」がありますが、これも何を指しているのか謎です。
「Web関連」や「HTML関連」ではなく「HTML5関連」というからには [[HTML5]]
と何か関係がありそうに思いますが、そのような規則性は今のところ見当たりません。
「Web と同義語である HTML5 (バズワード)」に「関連」しているとしか解釈しようがありません。
[27] 逆に [[HTML5]] (仕様) に含まれていたものも「HTML5関連」技術と言われることがあります。
「関連」には自身も含まれるという解釈なのでしょうか。。。
;; [26] 例えば [[HTML5]] で追加された [CODE(HTMLe)@en[[[canvas]]]]
[[要素]]を使う技術である [[WebGL]] は明らかに「HTML5関連」です。
しかし他の「HTML5関連」技術に必ずしもそのような明確な関連性が見出せるわけではありません。
間接的にでも関連があればいいのなら [[Web]] 関連技術はすべて (もっといえば
[[Web]] に関係ない[[インターネット]]技術だって) 「HTML5関連」ということになってしまいますが...
* HTML5 仕様の誕生と廃止
[49] [[HTML5]] は2004年から2005年にかけて [[WHATWG]] の [[HTML]]
関連仕様群の通称として使われるようになりました。2006年には、
[[Web Applications 1.0]] 仕様書中の用語としての [[HTML5]] が登場しました。
;; 詳細は [[Web Applications 1.0]] を参照。
[50] 2007年4月には [[W3C]] が方針転換して [[WHATWG]] の [[HTML]]
仕様の共同開発に参加することとなり、それを契機に [[Web Applications 1.0]]
は [[HTML5]] に改称されました。
;; 詳細は [[HTML 5]] を参照。
[48] [[HTML5]] は2010年1月に
[[HTML5 (including next generation additions still in development)]] に改称され、
更に2011年1月に [[HTML]] ([[HTML Standard]]) に改称されたことにより、
[[仕様]]としては発展的に消滅しました。
;; 詳細は [[HTML Standard]] を参照。
* バズワードとしての HTML5 の登場
[51] それまで [[Webブラウザー]]業界関係者と一部の先進的 [[Web開発者]]くらいにしか知れ渡っていなかった
[[HTML5]] は、 [[Google]] がカンファレンスで大々的に推進していくと発表したのを機に多くの開発者の知るところとなりました。
[52] 多くの人が使う語となるに従って意味も徐々に拡散し不明瞭になっていきました。
いつから[[バズワード]]化したか断定するのは困難ですが、
2010年には完全に[[バズワード]]となっていました。
[53] 2011年1月には、本来技術の正確な説明と普及に務めるべき立場であるはずの
[[W3C]] が [[CSS3]] や各種 [[Web API]] を含む広範囲の [[Web]] 関連技術を
「[[HTML5]]」と呼んで広報活動を展開するようになりました。
[[WHATWG]] はその時点で [[HTML5]] (仕様) は過去のものとして次の段階に開発を進めることとしたので、
もはや技術・仕様としての [[HTML5]] は歴史的なものとなり、
[[バズワード]]の [[HTML5]] だけが残りました。
* HTML5 (仕様) ではないのに HTML5 (バズワード) と呼ばれるもの
[8] [[HTML5]] (仕様) だったことが歴史的に一度もないもの:
[FIG(short list)[
- [[CSS]] [SRC[>>70]]
-- [[CSS3]]
-- [239] [[CSS Transitions]]
-- [[CSS Shapes]]
-- [[CSS 3D]] [SRC[>>72]]
- [[SVG]] [SRC[>>70]]
- [240] [[Selectors API]] [SRC[>>19]]
- [241] [[Web Fonts]] [SRC[>>71]]
- [[WOFF]] [SRC[>>70]]
- [[Geolocation API]] [SRC[>>19]]
- [[File API]] [SRC[>>19]]
- [[FileSystem API]] [SRC[>>34, >>36]]
- [243] [[IndexedDB]] [SRC[>>72]]
- [[Navigation Timing]]
- [[High Resolution Timing]]
- [[Web Speech API]]
- [[WebGL]]
- [[Clipboard API]]
- [265] [[Java]] [SRC[>>266]]
- [CODE(HTMLa)@en[[[lazyload]]]]
- [[Battery Status API]] [SRC[>>31, >>35]]
- [[MSE]]
- [[Web Notifications]] [SRC[>>15]] (>>16)
- [[Device Orientation API]] [SRC[>>19]]
-- [CODE(DOMe)@en[[[devicemotion]]]]
- コンテンツモデル [SRC[>>23]]
- セマンティックWeb [SRC[>>23]]
- [[Service Worker]] [SRC[>>24]]
- [[Web Audio API]] [SRC[>>28]]
- [[Vibration API]] [SRC[>>29]]
- [[FileReader]] [SRC[>>30]]
- [CODE(HTMLa)@en[[[x-webkit-speech]]]] [SRC[>>32]]
- [[Fullscreen API]] [SRC[>>33, >>38]]
- [[WebRTC]] [SRC[>>45, >>46]]
-- [CODE(DOMm)@en[[[getUserMedia]]]] [SRC[>>37]]
- [[Open Web Platform]] [SRC[>>70]]
- [[Cookie]] [SRC[>>72]]
- [[RDFa]] [SRC[>>72]]
- [[microformats]] [SRC[>>72]]
]FIG]
;; [16] かつて [[HTML5]] に含まれていた通知 API は後の [[Web Notifications]]
とは互換性がない。
;; [47] [[WebRTC]] はかつて
[[HTML5 (including next generation additions still in development)]]
に含まれていた機能から出発しているが、
分裂後に大きく変更されていてとても [[HTML5]] (仕様) の一部とはいえない。
[12] [[HTML5]] 以前から [[HTML]] だったもの:
[FIG(short list)[
- [CODE(HTMLe)@en[[[map]]]]
]FIG]
;; [59] [[HTML5]] には従来の機能も含まれるので間違いではありません。
[56] かつて [[HTML5]] に含まれていたが、
2010年1月 ([[HTML5 (including next generation additions still in development)]] への移行)
時点で [[HTML5]]/[[Web Applications 1.0]] に含まれていないもの:
[FIG(list middle)[
- [[XHR]] (2006年独立)
-- [[XHR2]] [SRC[>>72]]
-- [[XHR]] の [[CORS]] 対応 [SRC[>>17]]
- [[Web SQL Database]] (2009年独立)
]FIG]
;; [60] これらを [[HTML5]] の機能だというのは間違いとは言い切れません。
しかし [[XHR2]] や [[CORS]] は分離されてかなり後に、 [[HTML5]]
とは無関係に [[XHR]] に追加された機能です。
[57] 2010年1月 ([[HTML5 (including next generation additions still in development)]] への移行)
時点で存在せず、それ以後 [[HTML]] に追加された機能:
[FIG(middle list)[
- [CODE(HTMLe)@en[[[device]]]] [SRC[>>61, >>62]] (2009年12月追加)
-- 後の [[WebRTC]] である。
- [[WebVTT]] (2010年春追加)
- [242] [CODE(HTMLe)@en[[[track]]]] (2010年春追加)
- [CODE(HTMLe)@en[[[dialog]]]] [SRC[>>68]] (2012年4月追加)
- [CODE(HTMLe)@en[[[main]]]] [SRC[>>66, >>67]] (2013年2月追加)
- [[Web Components]] [SRC[>>40]]
-- [CODE(HTMLe)@en[[[template]]]] (2013年6月統合)
-- その他の機能は未統合
- [CODE(HTMLe)@en[[[picture]]]] [SRC[>>63, >>65]] (2014年6月統合)
]FIG]
;; [55] 2009年頃新機能の追加がしばらく凍結されていましたが、
[CODE(HTMLe)@en[[[device]]]] [[要素]]が「[[HTML5]] 後の最初の新要素」
として追加されました。技術的には以後の新機能はすべて [[HTML5]] ではありません。
;; [58] [[WebVTT]] はその後 [[HTML]] から独立しています。
;; [43] [CODE(HTMLe)@en[[[track]]]] や [CODE(HTMLe)@en[[[template]]]]
はなぜか [[W3C]] の [[HTML 5.0]] には含まれています。
[FIG(quote)[
[FIGCAPTION[
[266] [CITE@ja[高くついた反アップル戦略NTTドコモで通信障害続出の真相/町田 徹 (現代ビジネス) - Yahoo!ニュース]] ([TIME[2012-02-14 08:52:57 +09:00]] 版) <http://zasshi.news.yahoo.co.jp/article?a=20120214-00000001-gendaibiz-bus_all>
]FIGCAPTION]
>アンドロイドは「html5」という開発言語を用いるインターネットベースのOS
]FIG]
[15] [CITE@ja['''['''HTML5''']''' Desktopにメッセージを送るNotification]] ([TIME[2015-11-18 11:43:23 +09:00]] 版) <http://bitwave.showcase-tv.com/html5-desktop%E3%81%AB%E3%83%A1%E3%83%83%E3%82%BB%E3%83%BC%E3%82%B8%E3%82%92%E9%80%81%E3%82%8Bnotification/>
* 書籍
[14] [[HTML5]] を扱う書籍の多くは、バズワードとしての [[HTML5]] に関するものと見られます。
[FIG(amazon)[
HTML5
]FIG]
[FIG(quote)[
[FIGCAPTION[
[17] [CITE[フロントエンドエンジニアなら知っておきたい「HTML5のセキュリティ問題と対策技術」第44回HTML5とか勉強会レポート #html5j #HTML5|CodeIQ MAGAZINE]]
([TIME[2016-02-01 22:51:04 +09:00]] 版)
<https://codeiq.jp/magazine/2014/02/5736/>
]FIGCAPTION]
> HTML5以前からある機能だが、HTML5で新しくなっている。
> 以前は、同じオリジン内でしか通信ができなかった。しかしHTML5になり、クロスオリジン対応となった。
]FIG]
[18] [[XHR]] が初めて標準化されたのは [[Web Applications 1.0]] (通称 [[HTML5]])
だから [[HTML5]] (仕様) 以前からあるとは言えないし (非標準の機能としては
[[WA1]] 以前からあったから言えるのか?)、
[[CORS]] 対応になったのは [[HTML5]] (仕様) から独立した遥か後の話で
[[XHR]] も [[CORS]] も [[HTML5]] (仕様) ではないので、
二重に間違っている。
[19] [CITE@ja[必ず覚えておきたいHTML5の特徴と新機能/HTML5完全読本#1-1 | HTML5完全読本―実践テクニックとWebデザインの最新動向 | Web担当者Forum]] ([[鈴木 雄太(株式会社トライフォート)]] 著, [TIME[2016-02-01 23:00:19 +09:00]] 版) <http://web-tan.forum.impressrd.jp/e/2014/04/24/17355>
[FIG(quote)[
[FIGCAPTION[
[20] [CITE@ja[HTML5の新機能「Geolocation API」を使用して位置情報を取得する | web helog - HTML、CSS、JavaScriptなどWebに悩む人のネタ帳です。]]
([TIME[2016-02-01 23:10:09 +09:00]] 版)
<http://web.helog.jp/html5/geolocation/>
]FIGCAPTION]
> HTML5が公開され、いくつかの新機能が策定されましたが、中でもその有効性が期待されているのが「Geolocation API」です。
]FIG]
[21] [CITE[HTML5の特徴と代表的な機能 - Webデザインの勉強 | Webサイト制作科 1月20日開講クラス]] ([TIME[2016-02-01 19:13:56 +09:00]] 版) <http://d.hatena.ne.jp/web-0818/20150802/p1>
[22] >>21 の図によると「狭義のHTML5」、それを含む「一般的なHTML5」、
それを含む「広義のHTML5」があるらしい。どれも [[HTML5]] (仕様) とは一致していないようなので、
どこで誰が定めた「狭義」「一般的」「広義」なのか不思議だ。
「広義」にのみ含まれる「既存機能」には [[HTML5]] (仕様) より新しい [[WebGL]]
が含まれているので、どこを基点に「既存」と新規を区別しているのか不思議になる。
[FIG(quote)[
[FIGCAPTION[
[23] [CITE@ja[HTML5の概要 | WEBサイト制作に必要な知識のまとめ]]
([TIME[2016-02-01 23:24:44 +09:00]] 版)
<http://prismagics.com/2015/12/03/44/>
]FIGCAPTION]
> ブロックレベルとインラインレベルの概念がなくなり、
コンテンツモデルという概念が導入されました。
コンテンツモデルとは、
要素(タグ)を用途にあわせて分類して
> 今まで使っていた要素の使い方が変更されたり
新しい要素が追加されました。
より細かく要素が定義されるようになりました。
これを『セマンティックWeb』という言い方をします。
セマンティックWebにすることで、
見る人だけでなく、ブラウザや検索エンジンなどにページの内容を
理解させやすくすることができます。
]FIG]
[FIG(quote)[
[FIGCAPTION[
[24] [CITE@ja[HTML5 Conferenceレポート - 「HTTP/2の現状とこれから」編 - 株式会社一燈 エンジニアブログ]]
([TIME[2016-02-01 23:34:08 +09:00]] 版)
<http://blog.itto-inc.net/entry/2015/02/24/010645>
]FIGCAPTION]
> HTML5で策定されたService Worker(バックグラウンドでJavaScriptを動かせる仕組みのこと)と連携した新しいプッシュ通知に関する仕様が検討されていることを知りました。
]FIG]
[28] [CITE@ja[HTML5 の Web Audio API で音楽してみる | CYOKODOG]]
([TIME[2016-02-01 23:44:14 +09:00]] 版)
<http://www.cyokodog.net/blog/web-audio-api-music/>
[FIG(quote)[
[FIGCAPTION[
[29] [CITE@ja[''''''[''''''対応表あり'''''']''''''スマホブラウザでHTML5 Vibration APIを扱う | hi-posi Front-End blog]]
([TIME[2016-02-01 23:51:17 +09:00]] 版)
<http://hi-posi.co.jp/tech/?p=150>
]FIGCAPTION]
> HTML5のVibration APIとは
> 端末のバイブレーション機能へアクセスするためのHTML5のAPIのひとつです。
]FIG]
[FIG(quote)[
[FIGCAPTION[
[30] [CITE@en-US[Reading Files Using The HTML5 FileReader API - Treehouse Blog]]
([TIME[2016-02-01 23:52:52 +09:00]] 版)
<http://blog.teamtreehouse.com/reading-files-using-the-html5-filereader-api>
]FIGCAPTION]
> HTML5 saw the introduction of a number of new APIs that can be used to handle files in the browser. These APIs make it much easier to accomplish tasks like reading and writing files or uploading a file created using JavaScript.
> In this blog post you are going to learn how to use the FileReader API to read the contents of a file from your local hard drive.
]FIG]
[31] [CITE@ja[HTML5のBattery Status APIでユーザー追跡の可能性が指摘される | スラド IT]]
([TIME[2016-02-01 23:55:31 +09:00]] 版)
<http://it.srad.jp/story/15/08/08/2136235/>
[FIG(quote)[
[FIGCAPTION[
[32] [CITE@ja[HTML5の音声入力とGoogleの翻訳APIを試してみた | Shimabox Blog]]
([TIME[2016-02-01 23:57:35 +09:00]] 版)
<http://blog.shimabox.net/2011/05/03/html5%E3%81%AE%E9%9F%B3%E5%A3%B0%E5%85%A5%E5%8A%9B%E3%81%A8google%E3%81%AE%E7%BF%BB%E8%A8%B3api%E3%82%92%E8%A9%A6%E3%81%97%E3%81%A6%E3%81%BF%E3%81%9F/>
]FIGCAPTION]
> <input type="text" x-webkit-speech>
]FIG]
[FIG(quote)[
[FIGCAPTION[
[33] [CITE@en-US[HTML5 Fullscreen API - Hongkiat]]
([TIME[2016-01-29 08:37:46 +09:00]] 版)
<http://www.hongkiat.com/blog/html5-fullscreen-api/>
]FIGCAPTION]
> In addition to providing several new elements, HTML5 also introduced a set of new APIs including one that we are going to discuss in this post, called Fullscreen API. This API allows us to put our website or just a particular element on the webpage in fullscreen (and vice versa) using the browser’s native functionality.
]FIG]
[34] [CITE[Using the HTML5 Filesystem API: Eric Bidelman: 9781449309459: Amazon.com: Books]]
([TIME[2016-02-02 00:01:37 +09:00]] 版)
<http://www.amazon.com/Using-HTML5-Filesystem-Eric-Bidelman/dp/1449309453>
[FIG(quote)[
[FIGCAPTION[
[35] [CITE@en[HTML5 バッテリーAPI | ScrapEngineer]]
([TIME[2016-02-02 00:02:42 +09:00]] 版)
<http://scrap.php.xdomain.jp/html5_battery_api/>
]FIGCAPTION]
> HTML5では新たにバッテリーAPIが実装され、バッテリーの情報が取得出来るようになりました。
]FIG]
[FIG(quote)[
[FIGCAPTION[
[36] [CITE[HTML5 FileSystem APIを使って上書き処理をする方法]]
([TIME[2016-01-27 19:32:44 +09:00]] 版)
<https://www.eisbahn.jp/yoichiro/2015/01/html5-filesystem-api-file-overwrite.html>
]FIGCAPTION]
> HTML5 FileSystem APIを使うと、ユーザのローカルファイルシステムにファイルを書いたりすることができます。
]FIG]
[FIG(quote)[
[FIGCAPTION[
[37] [CITE@en[HTML5 getUserMedia APIでカメラが使ってみる | ScrapEngineer]]
([TIME[2016-02-02 00:03:58 +09:00]] 版)
<http://scrap.php.xdomain.jp/html5_getusermedia_api/>
]FIGCAPTION]
> HTML5のgetUserMedia APIでカメラの映像を取得する方法。
> またカメラの映像を画像化する方法も記載しました。
]FIG]
[FIG(quote)[
[FIGCAPTION[
[38] [CITE@ja[特定の要素を全画面(フルスクリーン)にするFullscreen API]]
([TIME[2015-08-31 12:28:54 +09:00]] 版)
<https://w3g.jp/blog/html5_fullscreen_api>
]FIGCAPTION]
> HTML5のFullscreen APIは、YouTubeなど動画画面の右下にある全画面表示ボタンを押すと動画部分のみが画面いっぱいに表示されるように、特定の要素を全画面(フルスクリーン)で提供できる機能です。
]FIG]
[FIG(quote)[
[FIGCAPTION[
[39] [CITE@ja[Boombox.js·HTML5のオーディオ系APIを一つに集約 MOONGIFT]]
([TIME[2016-02-02 00:06:55 +09:00]] 版)
<http://www.moongift.jp/2014/03/boombox-js-html5%E3%81%AE%E3%82%AA%E3%83%BC%E3%83%87%E3%82%A3%E3%82%AA%E7%B3%BBapi%E3%82%92%E4%B8%80%E3%81%A4%E3%81%AB%E9%9B%86%E7%B4%84/>
]FIGCAPTION]
> Boombox.jsはHTMLAudio/WebAudio/HTMLVideoの3つのAPIを透過的にサポートするライブラリです。
]FIG]
[FIG(quote)[
[FIGCAPTION[
[40] [CITE@en-US[Developing Modern Applications With HTML5: Web Components - UX+Dev UX+Dev]]
([TIME[2016-02-02 12:34:50 +09:00]] 版)
<http://uxdsummit.com/sessions/developing-modern-applications-with-html5-web-components/>
]FIGCAPTION]
> With HTML5 Web Components, you can do just that.
]FIG]
[FIG(quote)[
[FIGCAPTION[
[41] [CITE[HTML5~最新の技術とプロダクトで</br>Webサイト制作を効率化</br>セミナー開催レポート|ソフト産業プラザ イメディオ iMedio]]
([TIME[2016-02-02 12:36:03 +09:00]] 版)
<http://www.imedio.or.jp/seminar/report150312.php>
]FIGCAPTION]
> 今回のセミナーは、KDDIウェブコミュニケーションズ・エバンジェリストである阿部正幸氏が講師を務め、HTML5でも人気のCSSフレームワークやWeb Componentsなどを学ぶことをテーマとしています。
]FIG]
[42] >>41 [[HTML5]] (仕様) に「人気のCSSフレームワーク」という概念はないので、
「[[CSS]]」または「[[CSSフレームワーク]]」が [[HTML5]] (バズワード)
に含まれるのか? 「[[HTML5]]でも人気」は [[Web Components]] にも掛かっているのかどうか。
[[HTML5]] (バズワード) の構成要素色々の中で、その1つである「[[CSSフレームワーク]]」
や「[[Web Components]]」に人気があると言っているのか、あるいは
「人気のある[[CSSフレームワーク]]」や「人気のある[[Web Components]]」(?)
は [[HTML5]] (バズワード) に含まれるということなのか???
[FIG(quote)[
[FIGCAPTION[
[44] [CITE@ja[HTML5のWeb Componentsのカスタム要素を収集している・「Custom Elements」 - かちびと.net]]
([TIME[2016-02-02 12:44:39 +09:00]] 版)
<http://kachibito.net/useful-resource/custom-elements>
]FIGCAPTION]
> Custom ElementsはHTML5のWeb Componentsのカスタム要素を収集したWebサイトです。
]FIG]
[FIG(quote)[
[FIGCAPTION[
[45] [CITE@ja[HTML5でWebRTCを使ってみよう!「カメラを使ってみよう」編 | HTML5Experts.jp]]
([TIME[2016-02-02 12:45:19 +09:00]] 版)
<https://html5experts.jp/mganeko/5098/>
]FIGCAPTION]
> WebRTCとは”Web Real-Time Communication”の略で、Webブラウザ上でビデオ/オーディオの通信や、データ通信を行うための規格です。HTML5で新しく策定されたもので、複数の技術の連携で成り立っています。
]FIG]
[FIG(quote)[
[FIGCAPTION[
[46] [CITE[WebRTCコトハジメ - Qiita]]
([TIME[2016-02-02 12:47:51 +09:00]] 版)
<https://qiita.com/yusuke84/items/286f569d110daede721e>
]FIGCAPTION]
> WebRTCはHTML5(広義の意味での)と呼ばれるAPI群の一つですが、2つのAPIから構成されています。
]FIG]
[FIG(quote)[
[FIGCAPTION[
[9] [CITE@ja[XMLHttpRequest2 に関する新しいヒント - HTML5 Rocks]]
([TIME[2016-02-02 13:22:28 +09:00]] 版)
<http://www.html5rocks.com/ja/tutorials/file/xhr2/>
]FIGCAPTION]
> XMLHttpRequest は、HTML5 の世界であまり知られていない優れたオブジェクトの 1 つです。厳密に言うと、XHR2 は HTML5 ではありません。XHR2 は、ブラウザ ベンダーがコア プラットフォームに対して加えている段階的な改良の一部です。
> これらの機能により AJAX は、File System API、Web Audio API、WebGL などの最新の HTML5 API·の多くと連携して動作するようになりました。
]FIG]
[10] >>9 [[XHR]]1 は [[HTML5]] だけど [[XHR]]2 は [[HTML5]] ではないということ?
[61] [CITE[Which web browsers support the HTML5 <device> tag? - Stack Overflow]]
([TIME[2016-02-02 13:35:47 +09:00]] 版)
<http://stackoverflow.com/questions/3012002/which-web-browsers-support-the-html5-device-tag>
[62] [CITE@ja[PCに接続した周辺機器をコントロール、HTML5 Device :: dotHTML5]]
([TIME[2015-01-04 19:15:22 +09:00]] 版)
<http://dothtml5.com/archives/20100927_device.html>
[FIG(quote)[
[FIGCAPTION[
[63] [CITE@ja[HTML5 仕様 (WHATWG) に picture 要素が追加される | WWW WATCH]]
([TIME[2016-02-02 13:43:10 +09:00]] 版)
<https://hyper-text.org/archives/2014/06/picture_element_add_html5_spec.shtml>
]FIGCAPTION]
> で、今回、その辺は承知の上で、便宜上わかりやすく (だって HTML5 って書いた方がさ、わかりやすいじゃん・・・) こう書いているだけですので、その辺は悪しからず。
]FIG]
[64] >>63 「[[HTML]]」と書かれている[[仕様書]]と[[ツイート]]を[[引用]]しながら、
あえて [[HTML5]] と書き換えて紹介し、指摘されても開き直るなど、
相当[[悪意]]がありそうです。
[65] [CITE@en[HTML5 - HTML5 <picture> Element | Intel® Developer Zone]]
([TIME[2016-02-02 13:46:20 +09:00]] 版)
<https://software.intel.com/en-us/html5/hub/blogs/html5-picture-element>
[FIG(quote)[
[FIGCAPTION[
[66] [CITE@ja[mainタグの意味と使い方 | HTML | できるネット]]
([TIME[2016-02-02 13:55:19 +09:00]] 版)
<https://dekiru.net/article/12866/>
]FIGCAPTION]
> HTML5で追加された新しい要素です。
]FIG]
[67] [CITE@ja[HTML5の<main>要素は、<article>、<section>要素とどう使い分ければ... - Yahoo!知恵袋]]
([TIME[2016-02-02 13:57:49 +09:00]] 版)
<http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q11142741676>
[68] [CITE[Chrome37でHTML5のDialog要素を試してみた - Qiita]]
([TIME[2016-02-02 13:59:02 +09:00]] 版)
<https://qiita.com/nobuhito/items/f460043f2b70ca32b0d7>
[FIG(quote)[
[FIGCAPTION[
[69] [CITE@ja[jQueryとWebフォントでスマホの傾きで色の変わるアイコンを作ってみる | スターフィールド株式会社]]
([TIME[2016-02-02 18:50:59 +09:00]] 版)
<http://sterfield.co.jp/designer/jquery%E3%81%A8web%E3%83%95%E3%82%A9%E3%83%B3%E3%83%88%E3%81%A7%E3%82%B9%E3%83%9E%E3%83%9B%E3%81%AE%E5%82%BE%E3%81%8D%E3%81%A7%E8%89%B2%E3%81%AE%E5%A4%89%E3%82%8F%E3%82%8B%E3%82%A2%E3%82%A4%E3%82%B3.html>
]FIGCAPTION]
> HTML5では、デバイスの傾きや加速度といったスマホやタブレット端末独特のセンサーの情報を
> JavaScriptで読み取ることが可能です。
]FIG]
[FIG(quote)[
[FIGCAPTION[
[70] [CITE[SVGフォントを使った外字表現]]
([[藤沢 淳]] 著, [TIME[2016-02-02 18:54:30 +09:00]] 版)
<https://webcache.googleusercontent.com/search?q=cache:sRU7haK8TzYJ:www.w3.org/Style/Japan-2011/fujisawa-gaiji-SVG.pdf>
]FIGCAPTION]
> 広義のHTML5はHTML5/CSS/SVG/WOFF から構成されるOpen Web Platformを指す
]FIG]
[71] [CITE[HTML 5 @font-face Font Format Usage - WebIntel by Ironpaper]]
([TIME[2016-02-02 18:57:47 +09:00]] 版)
<http://www.ironpaper.com/webintel/articles/html-5-font-face-font-format-usage/#.VrB9X7KLTIU>
[FIG(quote)[
[FIGCAPTION[
[72] [CITE[HTML5]]
([TIME[2016-01-13 01:33:09 +09:00]] 版)
<http://www.tohoho-web.com/html5/>
]FIGCAPTION]
> 狭義の「HTML5」は HTML の第5版を意味しますが、広義の 「HTML5」 は、HTML5, CSS3, Web Storage など下記にあげる様々な技術の総称として用いられます。
> HTML
> Canvas
> CSS
> オフラインアクセス
> ローカルデータアクセス
> Cookie
> Web Storage
> Web SQLデータベース(Web SQL Database)
> Indexed Database API
> ファイル操作
> File API
> 通信の強化
> XMLHttpRequest Level 2
> The WebSocket API
> Web Messaging
> Server-Sent Events
> グラフィック・マルチメディアの強化
> SVG
> HTML Canvas 2D Context
> WebGL
> セマンティクスの強化
> RDFa
> HTML Microdata
> microformats
> Geolocation API Specification
> Selectors API
> Web Workers
> マイク・カメラ
> アドレス帳・カレンダー
> 端末の向き
> audio, video
> CSS 3D
>
]FIG]