社内HTML5勉強会を行いました

先日、社内でHTML5勉強会を行いました。
今回は「基礎編~HTML5の基礎とiPhone最適化~」と題して、HTML5でiPhone最適化を行う際の基礎知識とHTML5利用の目的共有を行いました。そこで、今回の勉強会の資料を一部公開します!

HTML5といっても、新しく追加されたタグやAPI,CSS3など範囲が広く、その上主要ブラウザでも実装状況が違ったり、仕様の廃止があったりするのが現状です。しかし、スマートフォン(今回はiPhoneのみ)に限定してしまえば、ブラウザを限定することがほぼ可能なので、HTML5の機能を生かした最適化を行うことができます。
機能面、操作性ではネイティブアプリに劣りますが、Webアプリであればデバイスに依存することなく開発でき、安価で導入しやすいという利点があります。

 
【資料の内容】
●開発環境の整備
●HTML5の基本セット
●iPhone向けWebアプリケーションの開発
-Viewport
-付加機能
●HTML5で追加されたタグ
-audio
-video
-canvas
-form属性
●API
-クライアントサイドのストレージ
-geolovcation
-オフラインアプリケーションキャッシュ
●アニメーション

 
【資料はコチラ】

[file]/2010/12/HTML5_iPhone.pdf[/file]

Related Post

iOS8とiOS7にプッシュ通知を送るiOS8とiOS7にプッシュ通知を送る

iOS8では、プッシュ通知から直接返信するなどのアクションが出来るようになりましたが、それに伴って通知の仕様も大きく変更されました。 この記事では基本的な手順とパラメータの変更点について簡単にまとめています。 プッシュ通知の登録手順の変更 上で述べた通知の機能拡張に伴い、アクションのない(=iOS7以前と同様の)プッシュ通知を行う場合でも実装方法が変わりました。具体的には、これまでプッシュ通知の登録時に使用していたregisterForRemoteNotificationTypes:メソッドが非推奨になり、registerUserNotificationSettings:メソッドとregisterForRemoteNotificationsメソッドを使う形になりました。 メソッド名だけ並べても分かりにくいので実際のコードで示すと iOS7以前ではこうだったのが… [application registerForRemoteNotificationTypes:UIRemoteNotificationTypeBadge

Parse.comを使ったiOSデバイスへのプッシュ通知[ターゲッティング編]Parse.comを使ったiOSデバイスへのプッシュ通知[ターゲッティング編]

前回、Parseを使ったiOSデバイス向けのプッシュ通知を行う方法をご紹介しました。今回はプッシュ通知先の絞り込みについて、無料版でも利用可能なChannelというパラメータを使用した方法をご紹介します。 大まかには、以下のような流れで行います。 デバイスにChannelの情報をひもづける Channelを指定してプッシュ通知を送る デバイスにChannelの情報をひもづける 次のメソッドを使って、デバイス側からParse(サーバ)側にChannel情報を登録できます。 NSString *channelName = @"hogehoge";   //登録するChannel名[PFPush

iPhoneでHTML5のaudio要素を使うときに気をつけたいことiPhoneでHTML5のaudio要素を使うときに気をつけたいこと

HTML5ではaudio要素が追加され、外部プラグインを使わずブラウザで音を扱えるようになりました。そこで、デモを作ろうとしたのですが、ハマったポイントがいくつかあったので紹介します。検証環境はPC:Safari5.0.5(WIN)、iPhone:iOS4.3.2のMobile Safariです。 loop属性が効かない audio要素ではloop属性を付けることで、繰り返し再生が可能です。PCでは動作しますが、iPhoneではこれがうまく動作せず、1回再生されて停止してしまいました。onendedを使い、最後まで再生したらもう一度再生させれば対処できます。 <audio src=”audio.mp3″ preload=”auto” onended=”this.play()”