Enviar pesquisa
Carregar
HTML5クイズ!
•
4 gostaram
•
4,458 visualizações
yoshikawa_t
Seguir
デブサミ2012のhtml5j.orgブースで実施された「HTML5クイズ!」の解説です。
Leia menos
Leia mais
Tecnologia
Denunciar
Compartilhar
Denunciar
Compartilhar
1 de 38
Baixar agora
Baixar para ler offline
Recomendados
そしてjsの基礎へ戻る#4
そしてjsの基礎へ戻る#4
Shingo Inoue
kagami_comput2015_4
kagami_comput2015_4
swkagami
JavaScript 基礎文法のまとめ
JavaScript 基礎文法のまとめ
Yossy Taka
GPUが100倍速いという神話をぶち殺せたらいいな ver.2013
GPUが100倍速いという神話をぶち殺せたらいいな ver.2013
Ryo Sakamoto
kagami_comput2016_12
kagami_comput2016_12
swkagami
kagami_comput2016_13
kagami_comput2016_13
swkagami
kagami_comput2015_12
kagami_comput2015_12
swkagami
kagami_comput2016_03
kagami_comput2016_03
swkagami
Mais conteúdo relacionado
Destaque
kagami_comput2016_04
kagami_comput2016_04
swkagami
kagami_comput2015_14
kagami_comput2015_14
swkagami
kagami_comput2015_13
kagami_comput2015_13
swkagami
kagami_comput2015_10
kagami_comput2015_10
swkagami
kagami_comput2015_11
kagami_comput2015_11
swkagami
kagami_comput2016_01
kagami_comput2016_01
swkagami
kagami_comput2015_9
kagami_comput2015_9
swkagami
kagami_comput2016_02
kagami_comput2016_02
swkagami
kagami_comput2016_14
kagami_comput2016_14
swkagami
JavaScriptことはじめ
JavaScriptことはじめ
Yuki Ishikawa
Webの仕組みとプログラミング言語
Webの仕組みとプログラミング言語
Yossy Taka
プログラムを高速化する話
プログラムを高速化する話
京大 マイコンクラブ
明日使えないすごいビット演算
明日使えないすごいビット演算
京大 マイコンクラブ
Destaque
(13)
kagami_comput2016_04
kagami_comput2016_04
kagami_comput2015_14
kagami_comput2015_14
kagami_comput2015_13
kagami_comput2015_13
kagami_comput2015_10
kagami_comput2015_10
kagami_comput2015_11
kagami_comput2015_11
kagami_comput2016_01
kagami_comput2016_01
kagami_comput2015_9
kagami_comput2015_9
kagami_comput2016_02
kagami_comput2016_02
kagami_comput2016_14
kagami_comput2016_14
JavaScriptことはじめ
JavaScriptことはじめ
Webの仕組みとプログラミング言語
Webの仕組みとプログラミング言語
プログラムを高速化する話
プログラムを高速化する話
明日使えないすごいビット演算
明日使えないすごいビット演算
Semelhante a HTML5クイズ!
2014年メディア工房勉強会 第1章「Webの仕組みとHTML5」
2014年メディア工房勉強会 第1章「Webの仕組みとHTML5」
Takashi Endo
HTML5でできるカメラアプリを実際に体験しよう
HTML5でできるカメラアプリを実際に体験しよう
Hideki Akiba
Mvc conf session_5_isami
Mvc conf session_5_isami
Hiroshi Okunushi
インタラクティブコンテンツにおけるHTML5とFlash
インタラクティブコンテンツにおけるHTML5とFlash
Yasunobu Ikeda
Application Architecture for Enterprise Win Store Apps with DDD Pattern
Application Architecture for Enterprise Win Store Apps with DDD Pattern
Atsushi Kambara
企業システムで使えるマイクロサービスの特長と実践 (Oracle Cloudウェビナーシリーズ: 2021年4月15日)
企業システムで使えるマイクロサービスの特長と実践 (Oracle Cloudウェビナーシリーズ: 2021年4月15日)
オラクルエンジニア通信
PHP Now and Then 2012 at PHP Conference 2012, Tokyo Japan (in japanese)
PHP Now and Then 2012 at PHP Conference 2012, Tokyo Japan (in japanese)
Rui Hirokawa
Phone gap+javascriptスマホアプリ開発(入門編)
Phone gap+javascriptスマホアプリ開発(入門編)
Monaca
コンテナ&サーバーレス:トレンドの考察と少し先の未来の展望
コンテナ&サーバーレス:トレンドの考察と少し先の未来の展望
Yoichi Kawasaki
[JavaOne Tokyo 2012] JavaFX and Web Integration
[JavaOne Tokyo 2012] JavaFX and Web Integration
Kazuchika Sekiya
Concentrated HTML5 & Attractive HTML5
Concentrated HTML5 & Attractive HTML5
Sho Ito
Html5 seminar 1_pac
Html5 seminar 1_pac
1PAC. INC.
ABC2012Spring 20120324
ABC2012Spring 20120324
Tak Inamori
テストしなイカ? Seleniumで自動ブラウザテスト
テストしなイカ? Seleniumで自動ブラウザテスト
Ohishi Mikage
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発
Daizen Ikehara
CDI2.0アップデート&クックブック #JavaDayTokyo #jdt2016_4c
CDI2.0アップデート&クックブック #JavaDayTokyo #jdt2016_4c
Norito Agetsuma
HTML5の前のJavaScript入門
HTML5の前のJavaScript入門
Hiroki Toyokawa
第3回企業Webシステム開発セミナー「業務システムにHTML5を上手に取り入れるためには?」
第3回企業Webシステム開発セミナー「業務システムにHTML5を上手に取り入れるためには?」
Osamu Shimoda
Ignite UI 2012 最新情報 jQuery Mobile 編
Ignite UI 2012 最新情報 jQuery Mobile 編
インフラジスティックス・ジャパン株式会社
Html5勉強会 20120423
Html5勉強会 20120423
Nobuhiro Sue
Semelhante a HTML5クイズ!
(20)
2014年メディア工房勉強会 第1章「Webの仕組みとHTML5」
2014年メディア工房勉強会 第1章「Webの仕組みとHTML5」
HTML5でできるカメラアプリを実際に体験しよう
HTML5でできるカメラアプリを実際に体験しよう
Mvc conf session_5_isami
Mvc conf session_5_isami
インタラクティブコンテンツにおけるHTML5とFlash
インタラクティブコンテンツにおけるHTML5とFlash
Application Architecture for Enterprise Win Store Apps with DDD Pattern
Application Architecture for Enterprise Win Store Apps with DDD Pattern
企業システムで使えるマイクロサービスの特長と実践 (Oracle Cloudウェビナーシリーズ: 2021年4月15日)
企業システムで使えるマイクロサービスの特長と実践 (Oracle Cloudウェビナーシリーズ: 2021年4月15日)
PHP Now and Then 2012 at PHP Conference 2012, Tokyo Japan (in japanese)
PHP Now and Then 2012 at PHP Conference 2012, Tokyo Japan (in japanese)
Phone gap+javascriptスマホアプリ開発(入門編)
Phone gap+javascriptスマホアプリ開発(入門編)
コンテナ&サーバーレス:トレンドの考察と少し先の未来の展望
コンテナ&サーバーレス:トレンドの考察と少し先の未来の展望
[JavaOne Tokyo 2012] JavaFX and Web Integration
[JavaOne Tokyo 2012] JavaFX and Web Integration
Concentrated HTML5 & Attractive HTML5
Concentrated HTML5 & Attractive HTML5
Html5 seminar 1_pac
Html5 seminar 1_pac
ABC2012Spring 20120324
ABC2012Spring 20120324
テストしなイカ? Seleniumで自動ブラウザテスト
テストしなイカ? Seleniumで自動ブラウザテスト
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発
CDI2.0アップデート&クックブック #JavaDayTokyo #jdt2016_4c
CDI2.0アップデート&クックブック #JavaDayTokyo #jdt2016_4c
HTML5の前のJavaScript入門
HTML5の前のJavaScript入門
第3回企業Webシステム開発セミナー「業務システムにHTML5を上手に取り入れるためには?」
第3回企業Webシステム開発セミナー「業務システムにHTML5を上手に取り入れるためには?」
Ignite UI 2012 最新情報 jQuery Mobile 編
Ignite UI 2012 最新情報 jQuery Mobile 編
Html5勉強会 20120423
Html5勉強会 20120423
Mais de yoshikawa_t
Ionicで作るTechfeed
Ionicで作るTechfeed
yoshikawa_t
困った時のDev toolsの使い方(初心者向け)
困った時のDev toolsの使い方(初心者向け)
yoshikawa_t
TechFeedというテクノロジーキュレーションサービスを作った話
TechFeedというテクノロジーキュレーションサービスを作った話
yoshikawa_t
Chrome DevTools Awesome 10 Features +1
Chrome DevTools Awesome 10 Features +1
yoshikawa_t
これからのモバイルWebと最新動向
これからのモバイルWebと最新動向
yoshikawa_t
いまさら聞けないHTML5概要
いまさら聞けないHTML5概要
yoshikawa_t
オフラインWebアプリの再到来で今、再び注目されるAPIの本命 ーJavaScript SQL-like database
オフラインWebアプリの再到来で今、再び注目されるAPIの本命 ーJavaScript SQL-like database
yoshikawa_t
jQuery Mobile is not dead!
jQuery Mobile is not dead!
yoshikawa_t
HTML5開発最前線
HTML5開発最前線
yoshikawa_t
Chrome Apps のデバイスAPI
Chrome Apps のデバイスAPI
yoshikawa_t
Chrome Apps & Chromeウェブストア概要
Chrome Apps & Chromeウェブストア概要
yoshikawa_t
Chrome DevTools for beginners v1.2
Chrome DevTools for beginners v1.2
yoshikawa_t
モバイル時代のWebパフォーマンス
モバイル時代のWebパフォーマンス
yoshikawa_t
モバイル時代のWebパフォーマンスTips
モバイル時代のWebパフォーマンスTips
yoshikawa_t
Chrome apps for mobile 概要
Chrome apps for mobile 概要
yoshikawa_t
Chrome Apps 概要
Chrome Apps 概要
yoshikawa_t
Chrome Devtools for beginners (v1.1)
Chrome Devtools for beginners (v1.1)
yoshikawa_t
Html5概要 & デモ
Html5概要 & デモ
yoshikawa_t
いまさら聞けないCSSレイアウト入門
いまさら聞けないCSSレイアウト入門
yoshikawa_t
Sencha touch vs j query mobile
Sencha touch vs j query mobile
yoshikawa_t
Mais de yoshikawa_t
(20)
Ionicで作るTechfeed
Ionicで作るTechfeed
困った時のDev toolsの使い方(初心者向け)
困った時のDev toolsの使い方(初心者向け)
TechFeedというテクノロジーキュレーションサービスを作った話
TechFeedというテクノロジーキュレーションサービスを作った話
Chrome DevTools Awesome 10 Features +1
Chrome DevTools Awesome 10 Features +1
これからのモバイルWebと最新動向
これからのモバイルWebと最新動向
いまさら聞けないHTML5概要
いまさら聞けないHTML5概要
オフラインWebアプリの再到来で今、再び注目されるAPIの本命 ーJavaScript SQL-like database
オフラインWebアプリの再到来で今、再び注目されるAPIの本命 ーJavaScript SQL-like database
jQuery Mobile is not dead!
jQuery Mobile is not dead!
HTML5開発最前線
HTML5開発最前線
Chrome Apps のデバイスAPI
Chrome Apps のデバイスAPI
Chrome Apps & Chromeウェブストア概要
Chrome Apps & Chromeウェブストア概要
Chrome DevTools for beginners v1.2
Chrome DevTools for beginners v1.2
モバイル時代のWebパフォーマンス
モバイル時代のWebパフォーマンス
モバイル時代のWebパフォーマンスTips
モバイル時代のWebパフォーマンスTips
Chrome apps for mobile 概要
Chrome apps for mobile 概要
Chrome Apps 概要
Chrome Apps 概要
Chrome Devtools for beginners (v1.1)
Chrome Devtools for beginners (v1.1)
Html5概要 & デモ
Html5概要 & デモ
いまさら聞けないCSSレイアウト入門
いまさら聞けないCSSレイアウト入門
Sencha touch vs j query mobile
Sencha touch vs j query mobile
Último
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
Shumpei Kishi
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
arts yokohama
What is the world where you can make your own semiconductors?
What is the world where you can make your own semiconductors?
Industrial Technology Research Institute (ITRI)(工業技術研究院, 工研院)
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
Matsushita Laboratory
2024 03 CTEA
2024 03 CTEA
arts yokohama
2024 01 Virtual_Counselor
2024 01 Virtual_Counselor
arts yokohama
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
ssuser539845
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
Tetsuya Nihonmatsu
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
ssuser370dd7
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
Sadao Tokuyama
20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdf
Ayachika Kitazaki
2024 04 minnanoito
2024 04 minnanoito
arts yokohama
Último
(12)
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
What is the world where you can make your own semiconductors?
What is the world where you can make your own semiconductors?
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
2024 03 CTEA
2024 03 CTEA
2024 01 Virtual_Counselor
2024 01 Virtual_Counselor
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdf
2024 04 minnanoito
2024 04 minnanoito
HTML5クイズ!
1.
HTML5クイズ!
2012/3/13(火) nifty 第27回HTML5とか勉強会 Toru Yoshikawa ( @yoshikawa_t )
2.
@デブサミ2012 HTML5クイズ!やりました
3.
豪華景品! 総参加者
207名 !
4.
Summary 2日間での総参加者207名 うち初級コース123名、上級コース84名 Google、Microsoft、Mozilla、Opera、W3C、Yahoo!に協力頂き、景品 としてノベルティを提供して頂きました。感謝! クイズの得点によって貰える景品が変わり、ランキングの表示も 100点は、上級コースは1名、初級コース4名という難度の高いクイズ に… 開発は3日ぐらい?、問題作成はほとんど前日に、当日に問題アレン ジ…
5.
アンケート項目 HTML5について、どんな要 素やAPIがあるのか概要を
47.82% 知っている。 HTML5について、実際に調 べたり、記述したことがあ 66.18% る。 概要は知らないが、調べたり記述したりしたことがあるひと (49.07%)
6.
HTML5クイズ!にチャレンジ
7.
Rule 最初の2問のアンケートで両方とも「はい」を答えると上級コー ス、それ以外は初級コース 各コース5問、同点は回答スピードが早いほうが上位になる 上級コース上位2名、初級コース2名に景品プレゼント! 初級コース、上級コースいずれでも、両方でも参加可能(上級 コースは得点数、初級は回答スピードが肝?) デブサミ2012にて既にクイズをやったことのある人は景品のほ うは辞退して頂けると助かります(参加はOK!) 未参加者の方へのネタバレは注意!
8.
クイズ中…
9.
HTML5クイズ!一般公開アドレス http://bit.ly/html5quiz
10.
解説
11.
初級コース
12.
初級コース 第1問
[SEMANTICS] HTML5では、<font>要素が廃止された。 正しい 間違い
13.
初級コース 第1問
[SEMANTICS] 正答率64.23% 間違い HTML5では、見た目にしか影響し ない要素は廃止された(見た目は 35.77% 正しい CSSで定義する) 64.23% 他にもbig、center、uなどの要素 が廃止されている samllは、注釈や細めを表す意味に 変更された
14.
初級コース 第2問
[OFFLINE & STORAGE] Local Storageに保存されたデータでもブ ラウザを再起動すると消える。 正しい 間違い
15.
初級コース 第2問
[OFFLINE & STORAGE] 正しい 正答率84.55% 15.45% Session StorageとLocal Storageの 違いを問う問題。 Local Storage は、ブラウザを再起動しても保存 間違い される。消えてしまうのはSession Storage 84.55% その他の注意点として、Session Storageは、複数ウィンドウ間で 共有できない
16.
初級コース 第3問
[MULTIMEDIA] ウェブページに埋めこまれているビデオ をプラグインなしで見るにはHTML5が必 要になる。 正しい 間違い
17.
初級コース 第3問
[MULTIMEDIA] 正答率67.48% 間違い video要素を利用するとプラグイン 32.52% なしでビデオを再生できる(再生 正しい できるコーデックは限られる) 67.48% ただし、現状では動画再生アプリ が立ち上がるデバイスもある 最初は、「iPhone・iPadでビデオ を見るには∼」だったが、Quick
18.
初級コース 第4問 [GRAPHICS
& EFFECTS] Canvasには、アニメーション用の機能が ある。 正しい 間違い
19.
初級コース 第4問
[GRAPHICS & EFFECTS] 正答率17.07% 間違い 正確には、Canvas 2D Context。 17.07% 2Dグラフィックスのための仕様 で、アニメーションについては規 正しい 定されていない 82.93% Canvasでアニメーションを表現す るためには、紙芝居のようにする svgには、anime要素などがある
20.
初級コース 第5問
[CSS3] CSS Animationsでアニメーションを定義 するブロックは@keyframesと呼ばれる 正しい 間違い
21.
初級コース 第5問
[CSS3] 正答率45.56% 初級コースにはやや難しいと思わ 正しい れる知識問題 間違い 45.56% @keyframesでアニメーションを定 54.44% 義する。from、to、xx%で記述 要素に適用するには、animation- nameでアニメーション名、 animation-durationで時間を指定す る
22.
上級コース
23.
上級コース 第1問
[SPECIFICATION] HTML5仕様の現在の状態は? 最終草案(Last Call Working Draft) 勧告候補(Candidate Recommendation) 勧告案(Proposed Recommendation) 勧告(Recommendation)
24.
上級コース 第1問
[SPECIFICATION] 勧告 正答率36.90% 7.14% 勧告案 最終草案 HTML5は、2011年5月25日にLast 20.24% 36.90% Callが宣言された 勧告候補 ここでいうHTML5は、Markupや Microdata、Canvasなど 35.71% 勧告は、2014年を予定しているが 果たして…
25.
上級コース 第2問
[DEVICE ACCESS] Geolocation API Level2で加わった主な変更として最も 適切なのは何か? 住所の情報を取得できるようになった GPSや基地局情報など、位置情報の取得元を選択できるようになっ た 現在地から目的地までのルート情報を取得できるようになった 大きな変更は特にない
26.
上級コース 第2問
[DEVICE ACCESS] 変更なし 住所取得 正答率19.05% 8.33% ルート取得 19.05% Geolocation API Level2では、 17.86% Addressインターフェースが追加さ れ住所が取得できるようになった 取得元の選択 位置情報の取得元については抽象 54.76% 化されている ルート取得に関する規定はなし
27.
上級コース 第3問
[OFFLINE & STORAGE] Indexed Database APIについて正しいものはどれ か? データベースの操作はSQLで行う オブジェクト・ストアには、JavaScriptのオブジェクトを保 存できる オブジェクト・ストアの作成や変更は、いつでも可能である
28.
上級コース 第3問
[OFFLINE & STORAGE] 正答率65.48% SQL操作 いつでも定義変更可 11.90% Indexed Databaseは、KVS型の 22.62% データベース。SQL操作は、Web SQL Databaseで可能。 JSオブジェクト保存可 JavaScriptオブジェクトの保存が 可能(structured clone) 65.48% IndexedDBでは、スキーマの変更 はVERSION_CHANGEトランザク ションで行う(DBのopen時)
29.
上級コース 第4問
[CONNECTIVITY] セキュアなWebSocketであるwssスキームが デフォルトで使用するポート番号はどれか? 80 81 443 815
30.
上級コース 第4問
[CONNECTIVITY] 正答率53.57% 「80」 「815」 20.24% 14.29% WebSocketが利用するポートの問 「81」 題。HTTP/HTTPSと同じポートを 11.90% 利用するため、ルータやFWを越 えることができる特徴を持つ 「443」 あとは、HTTPS(SSL)のポート番号 53.57% を知っているかどうか もちろん他のポートを利用可能
31.
上級コース 第5問
[MULTIMEDIA] Web Audio APIの仕様として定められている機 能で間違っているものはどれか 複数のスピーカーを使って3D音場を再現できる デバイスのマイクから入力した音をルーティングするこ とができる ブラウザが基本的なエフェクト機能を実装している
32.
上級コース 第5問
[MULTIMEDIA] 正答率35.71% 3D音場 20.24% Web Audio APIは、音声の再生、生 基本エフェクト用意 成を可能とする仕様 44.05% 音声の出力方向を調整するAudio マイク入力をルーティング Node(Panner)などでマルチチャネル 対応 35.71% マイク入力を取得する機能はない 基本的なエフェクトが用意されてい いる
33.
おまけ
34.
おまけ問題
[WebGL] WebGLの仕様はOpenGL ES 2.0ベースだが、 異なる部分も存在する。以下の定数の内、 WebGLでしか定義されていないものはどれか UNPACK_FLIP_Y_WEBGL UNPACK_ALIGNMENT PACK_ALIGNMENT
35.
ランキング発表 http://bit.ly/html5quiz2
36.
HTML5は最新情報を キャッチアップするのが大変ですね
37.
今すぐhtml5j.orgに参加!
38.
Thank you!!
Baixar agora