1. ホーム >
  2. 書籍 >
  3. 10日でおぼえるHTML5入門教室

10日でおぼえるHTML5入門教室


形式:
書籍
発売日:
ISBN:
9784798124186
価格:
本体2,800円+税
仕様:
B5変・360ページ
分類:
Web制作

本書籍の他の形式を確認する

  • このエントリーをはてなブックマークに追加

つくりながら楽しく学ぶ次世代Web標準規格「HTML5」

次世代Web標準規格として注目を集めているHTML5。主要ブラウザでの実装も進み、いち早くマスターしておきたいと考える開発者やデザイナーが増えています。本書はそんな人に向けたHTML5入門書です。Audio&Videoを使った「オーディオブック再生」、File APIを使った「ファイルビューア」、Canvasを使った「お絵かきアプリ」、タッチセンサーを使った「スマートフォン向けミニゲーム」など、HTML5の魅力を理解できるサンプルをつくりながら学習します。40レッスンを通して手を動かしながら楽しく最新技術をマスターできます。JavaScriptとHTML5を熟知した著者が丁寧に解説していますので、難しいプログラミングは苦手という方でも安心です。表紙に「著者そっくり人形」を配した新「10日シリーズ」をぜひお求めください。


CHAPTER 01 HTML・CSS・JavaScriptの役割

LESSON 01 HTML5の基礎知識
LESSON 02 テキストのマークアップ
LESSON 03 スクリプトの追加
LESSON 04 スクリプトのデバッグ

CHAPTER 02 入力フォームの機能を覚えよう/Form

LESSON 05 HTML5の入力フォームを使ってみよう(1)
LESSON 06 HTML5の入力フォームを使ってみよう(2)
LESSON 07 HTML5の入力フォームを使ってみよう(3)

CHAPTER 03 オーディオとビデオを視聴できるサイトを作ろう/Audio&Video

LESSON 08 オーディオを演奏する準備/音を鳴らしてみよう
LESSON 09 ネット上にあるオーディオデータを読み込もう
LESSON 10 オーディオブックを作ろう
LESSON 11 ビデオを再生してみよう
LESSON 12 サムネールがクリックされたら再生する

CHAPTER 04 メモ帳&日記帳を作ろう/Web Storage

LESSON 13 ローカル環境にデータを保存する
LESSON 14 複数のデータを保存/読み出そう
LESSON 15 ローカル環境にあるキーとデータを読み出そう

CHAPTER 05 お店マップを作ろう/Geolocation API

LESSON 16 現在の位置を取得しよう
LESSON 17 Googleマップ上に現在地を表示してみよう
LESSON 18 現在位置を登録しよう
LESSON 19 お店情報を保存しよう

CHAPTER 06 ファイルビューアを作ろう/File API

LESSON 20 選択されたファイルの情報を表示しよう
LESSON 21 テキストファイルの内容を読み取ろう
LESSON 22 バイナリファイルの内容を読み取ろう
LESSON 23 画像ファイルを読み込み表示しよう

CHAPTER 07 漢字の練習をしよう(小学生向けの漢字練習)/Canvas

LESSON 24 Canvasに図形を描画しよう(四角形の描画)
LESSON 25 Canvasに図形を描画しよう(画像の描画)
LESSON 26 Canvasに図形を描画しよう(グラデーションや移動や変形)
LESSON 27 マウスドラッグで描こう
LESSON 28 保存・取り消し機能を付けよう

CHAPTER 08 簡単な画像カタログを作ろう/Drag&Drop

LESSON 29 ドラッグ&ドロップ処理を組み込もう
LESSON 30 ドロップされたファイルの情報を表示しよう
LESSON 31 ドロップされた画像ファイルを表示しよう
LESSON 32 ドロップされた各種ファイルを表示しよう

CHAPTER 09 画像のフィルタリング処理/Web Workers

LESSON 33 ワーカーを作成してみよう
LESSON 34 ワーカーに画像データを渡そう
LESSON 35 ワーカーでエフェクト処理を行おう
LESSON 36 複数のワーカーで分散処理をしよう

CHAPTER 10 スマートフォン向けミニゲーム/TouchEvent、加速度センサー

LESSON 37 タッチ情報を読み取ろう/タッチした画像を指の動きに合わせて動かそう
LESSON 38 ジェスチャー情報を読み取ろう/ジェスチャーに合わせて画像を拡大縮小させよう
LESSON 39 タッチセンサーを使ってゲームを作ろう
LESSON 40 加速度センサーを使ってゲームを作ろう

INDEX

付属データはこちら

書籍への問い合わせ

正誤表、追加情報をご確認の上、こちらよりお問い合わせください

書影の利用許諾について

本書籍に関する利用許諾申請はこちらになります

追加情報はありません。

本書に誤りまたは不十分な記述がありました。下記のとおり訂正し、お詫び申し上げます。

書籍・SEshop限定PDF:ご購入刷数  電子書籍 最終更新日:2014年09月05日
発生刷 ページ数 書籍改訂刷 電子書籍訂正 内容 登録日
1刷 008
サンプルファイルのダウンロードサイトURL
http:///www.shoeisha.co.jp/book/10days
http://www.shoeisha.co.jp/book/10days
2014.09.05
1刷 294
リスト5 24行目
2刷
以下のコードに差し替えます。
for(var p=0, pixels=[ ]; p<image.data.length; p++){ pixels[p] = image.data[p]; }
2012.03.29
1刷 295
リスト5 44行目
2刷
以下のコードに差し替えます。
for(var p=0, pixels=[ ]; p<image.data.length; p++){ pixels[p] = image.data[p]; }
2012.03.29
1刷 298
本文4行目(コードの4行下)
3刷
変数pixlesに入れます*。
配列変数pixelsにコピーします*。
2012.05.14
1刷 298
側注
3刷
第1刷…<側注はありません> 第2刷…*配列変数pixelsにコピーします。
*Google Chrome 15以降、Safari 5.1以降では以下のように直接Canvas内のピクセルデータをワーカーに渡すとエラーになります。 var pixels = image.data; サンプルのように一度配列にピクセルデータをコピーした後、ワーカーに渡す必要があります。
2012.05.14
1刷 298
コードの10行目
2刷
var pixels = image.data;
for(var p=0, pixels=[ ]; p<image.data.length; p++){ pixels[p] = image.data[p]; }
2012.03.29
1刷 305
リスト4 202行目
2刷
以下のコードに差し替えます。
for(var p=0, pixels=[ ]; p<image.data.length; p++){ pixels[p] = image.data[p]; }
2012.03.29
1刷 314
リスト4 41行目
2刷
以下のコードに差し替えます。
for(var p=0, pixels=[ ]; p<image.data.length; p++){ pixels[p] = image.data[p]; }
2012.03.29
1刷 318
「エフェクトを分散処理する」コード11行目
2刷
var pixels = image.data;
for(var p=0, pixels=[ ]; p<image.data.length; p++){ pixels[p] = image.data[p]; }
2012.03.29
1刷 346
実習①
3刷
Android端末では加速度センサーの値を取得できないので、このサンプルはiPhone 4以降のみで動作します*。
このサンプルはiPhone 4以降およびAndroid 4以降で動作します。なお、以後の説明ではiPhone 4をベースにして解説を行っています。

p.347 右上の側注(ピンクの吹き出し)を削除します。
2012.05.14