SlideShare a Scribd company logo
HTML5とは?
             ざっくり覚えておくHTML5




13年1月8日火曜日
今までのHTMLは
   文章を作成するのが目的




13年1月8日火曜日
HTML5は
   アプリケーションが加わる




13年1月8日火曜日
13年1月8日火曜日
13年1月8日火曜日
13年1月8日火曜日
今まで複雑だった処理が簡単に出来て、
             HTMLをより構造的にスッキリ書ける

13年1月8日火曜日
今まで複雑だった処理が簡単に出来て、
             HTMLをより構造的にスッキリ書ける

13年1月8日火曜日
今まで複雑だった処理が簡単に出来る


                          <img>

     • メディアファイル




13年1月8日火曜日
今まで複雑だった処理が簡単に出来る


                          <Video>

     • メディアファイル




13年1月8日火曜日
今まで複雑だった処理が簡単に出来る


                          <Audio>

     • メディアファイル




13年1月8日火曜日
今まで複雑だった処理が簡単に出来る




     • メディアファイル
     • グラフィック描画



13年1月8日火曜日
今まで複雑だった処理が簡単に出来る




     • メディアファイル
     • グラフィック描画



13年1月8日火曜日
今まで複雑だった処理が簡単に出来る




     • メディアファイル
     • グラフィック描画
     • 高機能なフォーム


13年1月8日火曜日
今まで複雑だった処理が簡単に出来て、
             HTMLをより構造的にスッキリ書ける

13年1月8日火曜日
<div id=”header”>




                           <div id=”main”>            <div id=”sid”>




                                  <div id=”fotter”>




13年1月8日火曜日
header要素
             <header>
              (header)
              <h1>ヘッダー</h1>
              <nav>
               … … …
              </nav>
             </header>
             … … …




13年1月8日火曜日
section要素
             <section>
              (section)
                <h2>見出し1</h2>
              <section>
               (section)
               <h3>見出し1.1</h3>
               … (内容) …
              </section>
              <section>
               (section)
               <h3>見出し1.2</h3>
               … (内容) …
              </section>
             </section>




13年1月8日火曜日
article要素

                <article>
             (article)
             <h3>記事1</h3><br><br>
              </article>

                <article>
             (article)
             <h3>記事2</h3><br><br>
              </article>




13年1月8日火曜日
nav要素
             <nav>
              ナビゲーション
              <ul>
               <li class="navlink"><a href="xxx1.html">サイ
             ト内リンク1</a></li>
               <li class="navlink"><a href="xxx2.html">サイ
             ト内リンク2</a></li>
               <li class="navlink"><a href="xxx3.html">サイ
             ト内リンク3</a></li>
              </ul>
             </nav>




13年1月8日火曜日
だから何やねん?




13年1月8日火曜日
SEOなどに関係してくる可能性




13年1月8日火曜日
CSS3   JavaScript



13年1月8日火曜日
すぐにいる技術なの?

  ・まだブラウザの対応も様々
  ・ユーザーにはHTML5かどうかは関係ない
  ・今のままでもHPを作るだけなら問題なし




13年1月8日火曜日
いずれはHTML5が標準となり
   できる幅が広がる・・・




13年1月8日火曜日
いずれはHTML5が標準となり
   できる幅が広がる・・・はず




13年1月8日火曜日
じゃいつやるの?




13年1月8日火曜日
今でしょ!!




13年1月8日火曜日

More Related Content

PDF
Eclipse de sol ccmc
PPTX
Con đường để trở thành 1 chuyên gia Seo
PDF
Seoについて
DOCX
PDF
From System Modeling to Automated System Testing
KEY
Webapp startup example_to_dolist
PDF
Html5でword pressテーマを作るよ!
PDF
Eclipse de sol ccmc
Con đường để trở thành 1 chuyên gia Seo
Seoについて
From System Modeling to Automated System Testing
Webapp startup example_to_dolist
Html5でword pressテーマを作るよ!

Similar to 130107html5 (20)

PDF
CSS Design and Programming
PDF
HTML5を用いたセマンティックな文書作成【TechBuzz】第8回HTML5開発技術勉強会 〜先行事例紹介/交流会〜
PDF
HTML5マークアップの心得と作法
PDF
今からハジメるHTML5マークアップ
PDF
GDG Women DevfestW
PDF
HTML初心者向け勉強会
PDF
HTML5, きちんと。
PDF
HTML仕様書を読んでみよう
KEY
HTML5での制作、いつから始める?
PPTX
Webコーディングの基本+α
PDF
PDF
Html:css
PDF
Webデザイン入門2-HTML5 フォーム,映像再生,音声再生, CSS3, レスポンシブWebデザイン-
PDF
HTML5 in Firefox4
PDF
HTML5Conference2012 LT ピンチとチャンス
PDF
「html5 boilerplate」から考える、これからのマークアップ
PDF
PDF
マルチデバイス対応のコーディング・マークアップのポイント
PDF
Web班番外編
PPTX
メディア工房サマーワークショップ「Webアプリ制作」1日目
CSS Design and Programming
HTML5を用いたセマンティックな文書作成【TechBuzz】第8回HTML5開発技術勉強会 〜先行事例紹介/交流会〜
HTML5マークアップの心得と作法
今からハジメるHTML5マークアップ
GDG Women DevfestW
HTML初心者向け勉強会
HTML5, きちんと。
HTML仕様書を読んでみよう
HTML5での制作、いつから始める?
Webコーディングの基本+α
Html:css
Webデザイン入門2-HTML5 フォーム,映像再生,音声再生, CSS3, レスポンシブWebデザイン-
HTML5 in Firefox4
HTML5Conference2012 LT ピンチとチャンス
「html5 boilerplate」から考える、これからのマークアップ
マルチデバイス対応のコーディング・マークアップのポイント
Web班番外編
メディア工房サマーワークショップ「Webアプリ制作」1日目
Ad

130107html5