Windowsストアアプリ開発のすみっこ

MCSD(マイクロソフト認定ソリューション デベロッパー) のWindows Store Apps 取得をがんばるブログ。Windows女子部中心に活動中。

【070-480】試験対策その2-1  HTML5 のセマンティック構造 | P1

MVA JavaScript × CSS3 × HTML5 開発ジャンプ スタート
  (01) HTML5 のセマンティック構造 | P1  

 

Microsoft テクニカル エバンジェリストの Jeremy Foster と Michael Palermo が、優しくHTML5で取り入れられたタグについて説明してくれます。

 

資格取得のための集中コースで、通常5日間で学習するコースを1日に凝縮、2日間にわたりお届けします。

だそうです。

 

英語だけど大丈夫、ちゃんと日本語字幕が選べます。

※でもNexus7のChromeで見ると、字幕が選べないみたい。

 

最初のテーマはHTML5のセマンティック構造

セマンティック要素を理解する

id属性、class属性はお馴染み

<div id="header">

<div id="nav">

<div class="article">

<div class="section">

<div id="sidebar">

<div id="footer">

 

ヘッダも本文もナビゲーションも文字列が複雑

複雑だった構造がシンプルになった

 

<header>

<nav>

<article>

<section>

<aside>

<footer>

 

 フォームに関する機能

自動的にテキスト型が設定される

プレイスホルダーが簡単にセットできる

 

 

VS2012 とデモ

VS2012ではWindows8アプリでJavaScriptが選べる

HTML、CSSJavaScriptを使って作ることができる

 

簡単な文字表示のデモ。

プレイスホルダ付の入力エリアも簡単。

実行すると、アプリができる。Webではなく、アプリで実行される。

 

 

アプリを書くときもWebサイトと全く同じ方法でできてしまう凄さが、体感できちゃいます。