Enviar pesquisa
Carregar
HTML5 for Beginners
•
Transferir como PPTX, PDF
•
5 gostaram
•
2,555 visualizações
Shumpei Shiraishi
Seguir
Tecnologia
Denunciar
Compartilhar
Denunciar
Compartilhar
1 de 21
Baixar agora
Recomendados
WordPress における コミュニティ翻訳の事例
WordPress における コミュニティ翻訳の事例
Naoko Takano
HTML5が最近どうなっていて何があぶなっかしいのか?
HTML5が最近どうなっていて何があぶなっかしいのか?
Masakazu Muraoka
パンダの会 Html5概説
パンダの会 Html5概説
Masakazu Muraoka
「なんとなく」の壁を越えよう! 〜自信を持ってWordPressを選択するためのヒント〜
「なんとなく」の壁を越えよう! 〜自信を持ってWordPressを選択するためのヒント〜
Naoko Takano
Htmlのコトバ
Htmlのコトバ
Masakazu Muraoka
「日本語組版処理の要件(JLREQ)」とは何か
「日本語組版処理の要件(JLREQ)」とは何か
Shinyu Murakami
Front-end package managers
Front-end package managers
Hayashi Yuichi
レスポンシブ・イメージのWordPressへの実装と4.4
レスポンシブ・イメージのWordPressへの実装と4.4
Toru Miki
Recomendados
WordPress における コミュニティ翻訳の事例
WordPress における コミュニティ翻訳の事例
Naoko Takano
HTML5が最近どうなっていて何があぶなっかしいのか?
HTML5が最近どうなっていて何があぶなっかしいのか?
Masakazu Muraoka
パンダの会 Html5概説
パンダの会 Html5概説
Masakazu Muraoka
「なんとなく」の壁を越えよう! 〜自信を持ってWordPressを選択するためのヒント〜
「なんとなく」の壁を越えよう! 〜自信を持ってWordPressを選択するためのヒント〜
Naoko Takano
Htmlのコトバ
Htmlのコトバ
Masakazu Muraoka
「日本語組版処理の要件(JLREQ)」とは何か
「日本語組版処理の要件(JLREQ)」とは何か
Shinyu Murakami
Front-end package managers
Front-end package managers
Hayashi Yuichi
レスポンシブ・イメージのWordPressへの実装と4.4
レスポンシブ・イメージのWordPressへの実装と4.4
Toru Miki
記事には書けなかったHTML5の話
記事には書けなかったHTML5の話
Shumpei Shiraishi
HTML5とWeb開発に関する最新動向
HTML5とWeb開発に関する最新動向
Shumpei Shiraishi
20100417レジュメ
20100417レジュメ
Shumpei Shiraishi
ひとめあなたに・・・
ひとめあなたに・・・
Shumpei Shiraishi
Hatakeyama
Hatakeyama
Shumpei Shiraishi
はやぶさ」からの贈り物
はやぶさ」からの贈り物
Shumpei Shiraishi
秒速一億円
秒速一億円
Shumpei Shiraishi
jQueryの先に行こう!最先端のWeb開発トレンドを学ぶ
jQueryの先に行こう!最先端のWeb開発トレンドを学ぶ
Shumpei Shiraishi
HTML5時代のフロントエンド開発入門
HTML5時代のフロントエンド開発入門
Shumpei Shiraishi
20160618_HTML5プロフェッショナル認定試験レベル1 技術解説セミナー in OSC北海道2016
20160618_HTML5プロフェッショナル認定試験レベル1 技術解説セミナー in OSC北海道2016
Takahiro Kujirai
最新Webプロトコル傾向と対策
最新Webプロトコル傾向と対策
Kensaku Komatsu
Attractive HTML5
Attractive HTML5
Sho Ito
20151114 _html5無料セミナー(OSC2015徳島)
20151114 _html5無料セミナー(OSC2015徳島)
Takahiro Kujirai
20140902 HTML5認定試験紹介資料
20140902 HTML5認定試験紹介資料
leverages_event
今からハジメるHTML5プログラミング
今からハジメるHTML5プログラミング
SwapSkills
最近のHTML5はどうなってるのか
最近のHTML5はどうなってるのか
Shumpei Shiraishi
HTML5がもたらすアプリ開発へのインパクト
HTML5がもたらすアプリ開発へのインパクト
Shumpei Shiraishi
20150613 html5プロフェッショナル認定試験 レベル1技術解説セミナー
20150613 html5プロフェッショナル認定試験 レベル1技術解説セミナー
Takahiro Kujirai
学術出版のHTML5標準化とCSS組版――Scholarly HTMLとVivliostyle
学術出版のHTML5標準化とCSS組版――Scholarly HTMLとVivliostyle
Shinyu Murakami
HTML5でゲームが作れます
HTML5でゲームが作れます
amusementcreators
Concentrated HTML5 & Attractive HTML5
Concentrated HTML5 & Attractive HTML5
Sho Ito
HTML5が創り出す新たな世界
HTML5が創り出す新たな世界
lpijapan
Mais conteúdo relacionado
Destaque
記事には書けなかったHTML5の話
記事には書けなかったHTML5の話
Shumpei Shiraishi
HTML5とWeb開発に関する最新動向
HTML5とWeb開発に関する最新動向
Shumpei Shiraishi
20100417レジュメ
20100417レジュメ
Shumpei Shiraishi
ひとめあなたに・・・
ひとめあなたに・・・
Shumpei Shiraishi
Hatakeyama
Hatakeyama
Shumpei Shiraishi
はやぶさ」からの贈り物
はやぶさ」からの贈り物
Shumpei Shiraishi
秒速一億円
秒速一億円
Shumpei Shiraishi
jQueryの先に行こう!最先端のWeb開発トレンドを学ぶ
jQueryの先に行こう!最先端のWeb開発トレンドを学ぶ
Shumpei Shiraishi
Destaque
(8)
記事には書けなかったHTML5の話
記事には書けなかったHTML5の話
HTML5とWeb開発に関する最新動向
HTML5とWeb開発に関する最新動向
20100417レジュメ
20100417レジュメ
ひとめあなたに・・・
ひとめあなたに・・・
Hatakeyama
Hatakeyama
はやぶさ」からの贈り物
はやぶさ」からの贈り物
秒速一億円
秒速一億円
jQueryの先に行こう!最先端のWeb開発トレンドを学ぶ
jQueryの先に行こう!最先端のWeb開発トレンドを学ぶ
Semelhante a HTML5 for Beginners
HTML5時代のフロントエンド開発入門
HTML5時代のフロントエンド開発入門
Shumpei Shiraishi
20160618_HTML5プロフェッショナル認定試験レベル1 技術解説セミナー in OSC北海道2016
20160618_HTML5プロフェッショナル認定試験レベル1 技術解説セミナー in OSC北海道2016
Takahiro Kujirai
最新Webプロトコル傾向と対策
最新Webプロトコル傾向と対策
Kensaku Komatsu
Attractive HTML5
Attractive HTML5
Sho Ito
20151114 _html5無料セミナー(OSC2015徳島)
20151114 _html5無料セミナー(OSC2015徳島)
Takahiro Kujirai
20140902 HTML5認定試験紹介資料
20140902 HTML5認定試験紹介資料
leverages_event
今からハジメるHTML5プログラミング
今からハジメるHTML5プログラミング
SwapSkills
最近のHTML5はどうなってるのか
最近のHTML5はどうなってるのか
Shumpei Shiraishi
HTML5がもたらすアプリ開発へのインパクト
HTML5がもたらすアプリ開発へのインパクト
Shumpei Shiraishi
20150613 html5プロフェッショナル認定試験 レベル1技術解説セミナー
20150613 html5プロフェッショナル認定試験 レベル1技術解説セミナー
Takahiro Kujirai
学術出版のHTML5標準化とCSS組版――Scholarly HTMLとVivliostyle
学術出版のHTML5標準化とCSS組版――Scholarly HTMLとVivliostyle
Shinyu Murakami
HTML5でゲームが作れます
HTML5でゲームが作れます
amusementcreators
Concentrated HTML5 & Attractive HTML5
Concentrated HTML5 & Attractive HTML5
Sho Ito
HTML5が創り出す新たな世界
HTML5が創り出す新たな世界
lpijapan
HTML5での制作、いつから始める?
HTML5での制作、いつから始める?
Fuminori Mori
第13回 CreatorsMeetup 〜HTML5時代に必要なスキルと考え方〜
第13回 CreatorsMeetup 〜HTML5時代に必要なスキルと考え方〜
Daisuke Yamazaki
3 倍早い?! MS 製開発者専用ツールによる HTML5 + JavaScript を使ったWeb 作成
3 倍早い?! MS 製開発者専用ツールによる HTML5 + JavaScript を使ったWeb 作成
Osamu Monoe
HTML5/Web標準オーバービュー
HTML5/Web標準オーバービュー
Shumpei Shiraishi
HTML5時代のネット動画技術〜良い子悪い子普通の子(増補改訂版)
HTML5時代のネット動画技術〜良い子悪い子普通の子(増補改訂版)
Teiichi Ota
第43回HTML5とか勉強会 最新webプロトコル傾向と対策
第43回HTML5とか勉強会 最新webプロトコル傾向と対策
Kensaku Komatsu
Semelhante a HTML5 for Beginners
(20)
HTML5時代のフロントエンド開発入門
HTML5時代のフロントエンド開発入門
20160618_HTML5プロフェッショナル認定試験レベル1 技術解説セミナー in OSC北海道2016
20160618_HTML5プロフェッショナル認定試験レベル1 技術解説セミナー in OSC北海道2016
最新Webプロトコル傾向と対策
最新Webプロトコル傾向と対策
Attractive HTML5
Attractive HTML5
20151114 _html5無料セミナー(OSC2015徳島)
20151114 _html5無料セミナー(OSC2015徳島)
20140902 HTML5認定試験紹介資料
20140902 HTML5認定試験紹介資料
今からハジメるHTML5プログラミング
今からハジメるHTML5プログラミング
最近のHTML5はどうなってるのか
最近のHTML5はどうなってるのか
HTML5がもたらすアプリ開発へのインパクト
HTML5がもたらすアプリ開発へのインパクト
20150613 html5プロフェッショナル認定試験 レベル1技術解説セミナー
20150613 html5プロフェッショナル認定試験 レベル1技術解説セミナー
学術出版のHTML5標準化とCSS組版――Scholarly HTMLとVivliostyle
学術出版のHTML5標準化とCSS組版――Scholarly HTMLとVivliostyle
HTML5でゲームが作れます
HTML5でゲームが作れます
Concentrated HTML5 & Attractive HTML5
Concentrated HTML5 & Attractive HTML5
HTML5が創り出す新たな世界
HTML5が創り出す新たな世界
HTML5での制作、いつから始める?
HTML5での制作、いつから始める?
第13回 CreatorsMeetup 〜HTML5時代に必要なスキルと考え方〜
第13回 CreatorsMeetup 〜HTML5時代に必要なスキルと考え方〜
3 倍早い?! MS 製開発者専用ツールによる HTML5 + JavaScript を使ったWeb 作成
3 倍早い?! MS 製開発者専用ツールによる HTML5 + JavaScript を使ったWeb 作成
HTML5/Web標準オーバービュー
HTML5/Web標準オーバービュー
HTML5時代のネット動画技術〜良い子悪い子普通の子(増補改訂版)
HTML5時代のネット動画技術〜良い子悪い子普通の子(増補改訂版)
第43回HTML5とか勉強会 最新webプロトコル傾向と対策
第43回HTML5とか勉強会 最新webプロトコル傾向と対策
Mais de Shumpei Shiraishi
俺的GEB概論(前半)
俺的GEB概論(前半)
Shumpei Shiraishi
コンセプトのつくりかた - アイデアをかたちにする技術
コンセプトのつくりかた - アイデアをかたちにする技術
Shumpei Shiraishi
TechFeedのつくりかた - Angular2/Webpack/Ionic2/Cordova実践入門
TechFeedのつくりかた - Angular2/Webpack/Ionic2/Cordova実践入門
Shumpei Shiraishi
JavaScript使いのためのTypeScript実践入門
JavaScript使いのためのTypeScript実践入門
Shumpei Shiraishi
「それでも人生にイエスと言う」を読んで
「それでも人生にイエスと言う」を読んで
Shumpei Shiraishi
「それでも人生にイエスと言う」を読んで
「それでも人生にイエスと言う」を読んで
Shumpei Shiraishi
Angular2実践入門
Angular2実践入門
Shumpei Shiraishi
WebRTCがビデオ会議市場に与えるインパクトを探る
WebRTCがビデオ会議市場に与えるインパクトを探る
Shumpei Shiraishi
変身×フランツ・カフカ
変身×フランツ・カフカ
Shumpei Shiraishi
イラスト日用服飾辞典/三面記事の歴史/健康男 を読んで
イラスト日用服飾辞典/三面記事の歴史/健康男 を読んで
Shumpei Shiraishi
「1秒でわかる!アパレル業界ハンドブック」を読んで
「1秒でわかる!アパレル業界ハンドブック」を読んで
Shumpei Shiraishi
漫☆画太郎論
漫☆画太郎論
Shumpei Shiraishi
6,000人のWeb技術者コミュニティを5年間やってみて学んだこと
6,000人のWeb技術者コミュニティを5年間やってみて学んだこと
Shumpei Shiraishi
はじめにことばありき
はじめにことばありき
Shumpei Shiraishi
この人と結婚していいの?を読んで
この人と結婚していいの?を読んで
Shumpei Shiraishi
20130921レジュメ2
20130921レジュメ2
Shumpei Shiraishi
第62回 読書するエンジニアの会(テーマ:メカ) 「Prototyping lab」
第62回 読書するエンジニアの会(テーマ:メカ) 「Prototyping lab」
Shumpei Shiraishi
第1回 (白石俊平と) カッコいいやつら
第1回 (白石俊平と) カッコいいやつら
Shumpei Shiraishi
Pokelabo android web
Pokelabo android web
Shumpei Shiraishi
白石の異常な愛情 または私は如何にして心配するのを止めてNodeを愛するようになったか
白石の異常な愛情 または私は如何にして心配するのを止めてNodeを愛するようになったか
Shumpei Shiraishi
Mais de Shumpei Shiraishi
(20)
俺的GEB概論(前半)
俺的GEB概論(前半)
コンセプトのつくりかた - アイデアをかたちにする技術
コンセプトのつくりかた - アイデアをかたちにする技術
TechFeedのつくりかた - Angular2/Webpack/Ionic2/Cordova実践入門
TechFeedのつくりかた - Angular2/Webpack/Ionic2/Cordova実践入門
JavaScript使いのためのTypeScript実践入門
JavaScript使いのためのTypeScript実践入門
「それでも人生にイエスと言う」を読んで
「それでも人生にイエスと言う」を読んで
「それでも人生にイエスと言う」を読んで
「それでも人生にイエスと言う」を読んで
Angular2実践入門
Angular2実践入門
WebRTCがビデオ会議市場に与えるインパクトを探る
WebRTCがビデオ会議市場に与えるインパクトを探る
変身×フランツ・カフカ
変身×フランツ・カフカ
イラスト日用服飾辞典/三面記事の歴史/健康男 を読んで
イラスト日用服飾辞典/三面記事の歴史/健康男 を読んで
「1秒でわかる!アパレル業界ハンドブック」を読んで
「1秒でわかる!アパレル業界ハンドブック」を読んで
漫☆画太郎論
漫☆画太郎論
6,000人のWeb技術者コミュニティを5年間やってみて学んだこと
6,000人のWeb技術者コミュニティを5年間やってみて学んだこと
はじめにことばありき
はじめにことばありき
この人と結婚していいの?を読んで
この人と結婚していいの?を読んで
20130921レジュメ2
20130921レジュメ2
第62回 読書するエンジニアの会(テーマ:メカ) 「Prototyping lab」
第62回 読書するエンジニアの会(テーマ:メカ) 「Prototyping lab」
第1回 (白石俊平と) カッコいいやつら
第1回 (白石俊平と) カッコいいやつら
Pokelabo android web
Pokelabo android web
白石の異常な愛情 または私は如何にして心配するのを止めてNodeを愛するようになったか
白石の異常な愛情 または私は如何にして心配するのを止めてNodeを愛するようになったか
HTML5 for Beginners
1.
HTML5 for beginners 2013/6/21 株式会社オープンウェブ・テクノロ ジー 代表取締役 白石俊平
2.
自己紹介 • 白石俊平と申します。 • コミュニティhtml5j.org管理人(会員数5000名超) •
HTML5とか勉強会主催(毎月一回、100名を動員) • Google API Expert (HTML5) • Microsoft Most Valuable Professional (IE9) • Twitter: @Shumpei
3.
Web技術の基礎知識
4.
HTML5という「仕様」 HTML(Hyper Text
Markup Language)の最新バー ジョン W3C(World Wide Web Consortium)で標準化作業中 仕様書はWebで公開されている
5.
Webを進化させつつ安定させる HTML Living Standard HTML5 WHATWGによる バージョン W3Cによる 安定バージョン HTML5.1 W3Cによる 次期バージョン
6.
HTML5仕様のスケジュール 2012年Q4 HTML5.0が勧告 候補に 2014年 HTML5.0勧告 2016年
HTML5.1勧告 2012年9月20日、HTML5仕様のスケジュールが発表された!
7.
「狭義」のHTML5と「広義」のHTML5
8.
Web関連技術は広く、深い。 HTML要素数:109+ JavaScript API仕様: 7o+ CSS関連仕様:
65+
9.
Web関連技術は広く、深い。 HTML要素数:109+ JavaScript API仕様: 7o+ CSS関連仕様:
65+
10.
HTML4でもできたこと • CSSによるスタイル定義・外部スタイル読み込み • JavaScriptによるプログラミング・外部JS読み込み •
テキストの修飾 – 見出し/段落/引用/強調... • リスト • インラインフレーム • プラグインの読み込み • クリッカブルマップ • 表組み • フォーム • ...
11.
HTML5でできるようになったこ と • マルチメディア • コンテンツの構造化 •
ルビふり • よりリッチなフォーム要素 • 動的なグラフィック
12.
マルチメディア <video src="..."></video> <audio src="..."></audio>
13.
コンテンツの構造化 <div class=”header”> <h1>Site Title</h1> <div
class=”site-nav”> <ul><li>Home</li><li>Profile</li><li>Settings</li></ul> </div> </div> <div class=”content”> <div class=”article”>Main Content <div class=”date”>2009/11/23に投稿</div> <div class=”address”> 連絡は<a href=”mailto:a@a.jp”>こちら</a></div> </div> </div> <div class=”footer”> <div class=”copyright”>Copyright ...</div> </div> HTML4のマークアップ例
14.
コンテンツの構造化 <header> <h1>Site Title</h1> <nav class=”site-nav”> <ul><li>Home</li><li>Profile</li><li>Settings</li></ul> </nav> </header> <div
class=”content”> <article class=”article”>Main Content <time datetime="2009/11/23">2009/11/23に投稿</time> <address class=”address”> 連絡は<a href=”mailto:a@a.jp”>こちら</a></address> </article> </div> <footer> <small class=”copyright”>Copyright ...</small> </footor> HTML5のマークアップ例
15.
ルビふり <ruby>白石<rt>しらいし</rt></ruby>
16.
よりリッチなフォーム要素 <input>要素のtype属性が大幅に拡充 tel week search time url
datetime-local email number datetime range date color month HTML5 Formsデモ
17.
動的なグラフィック • <canvas>・・・2D/3Dビットマップグラ フィック – 3Dで使用される技術は特に「WebGL」と呼ば れる •
<svg>・・・ベクターグラフィック
18.
Webcam Toy • カメラからの画像取り込み&リアルタイ ムエフェクト
19.
ChronoZoom • 全宇宙史に関する様々なリソースを参照 できるWebアプリ
20.
ROME • 3D表現を効果的に活かしたインタラク ティブ・ムービー
21.
ご清聴ありがとうございまし た。
Baixar agora