ちょっと今回はまめ知識的な内容です。 最近、「iPhoneでWebアプリを作成」といった記事をよく見かけます。 (jQuery Mobileなどを利用した開発方法は置いといて) HTML5+CSS3+JavaScriptで一から作成する方法について、意外と肝心な注意点が抜けてるように思います。 とくに、よくmetaタグを使った「Webアプリモード(フルスクリーンモード)」にする方法が書かれていたりします。 <meta name="apple-mobile-web-app-capable" content="yes" /> これをやると、URLバーとかが無くなって、サイトがネイティブアプリっぽくなってかっこいいんですよね。 これで、サイトをアプリっぽく見せられる!ってちょっと興奮しちゃいますよね。 ただ、これって意外な落とし穴があるんです( ̄▽ ̄;) 今回は、僕が知ってる大きな2つの注意点を
jPlayerはvideoタグ/Flash双方に対応したWebベースの音楽/動画プレーヤ。 jPlayerはJavaScript/jQuery製のオープンソース・ソフトウェア。HTML5はことPCにおいては普及までに数年を要するだろう。なぜかと言えばHTML5に対応しないレガシーなブラウザが圧倒的なシェアだからだ。最新技術をふんだんに使いたい開発者にとっては問題だ。 動画プレーヤ HTML5で使える技術の一つで知られているのがvideo/audioタグだ。標準フォーマットについてはまだ確定していないものの、Flashに頼らないモバイル(特にiOS)でも使えるのが魅力だ。既存技術との兼ね合いも考えて使いたいのがjPlayerだ。 jPlayerはJavaScript製のWebベースの動画、音楽プレーヤだ。HTML5に対応したブラウザであればvideo/audioタグを使い、対応していなければ
はじめに タイガーマスクが貢いでくれるのを待っている皆さんこんばんは。 前振り考えるのが面倒なので結論から書くと、今日はWebSocketについて扱おうと思います。iPhoneを使って↓こんなサンプルを作ってみました。 Safari上のJavaScriptと、WebSocketをWebサービスとして提供しているPusherを利用して、サーバサイドの言語を使わずに実装しています。 WebSocketってなぁに? httpおさらい Webの通信に使われる皆さんお馴染みのhttpは、クライアント(ブラウザとかね)とサーバが常に「問い合わせ(リクエスト)と返答(レスポンス)」のペアでやりとりをおこないます。 クライアント(FirefoxやChromeなど): 「情報ください」 サーバ(Apacheやnginxなど): 「はい、どうぞ」 このシンプルな仕組みがhttpの強みであり、URLと共にここま
はじめに はじめまして。株式会社ピクセルグリッドの外村です。今回この連載では、マークアップエンジニアやデザイナを対象に、『jsdo.it -Share JavaScript,HTML5 and CSS-』(以下、jsdo.it)というサイトを使ってユーザ参加型のJavaScriptやCSS3の学習コンテンツを提供していきます。今回は初回ですので、jsdo.itというサイトの概要や連載に向けての事前準備を解説します。 jsdo.itとは jsdo.itというのは2010年に株式会社カヤックがリリースしたWebサービスで、Web上でHTML5、CSS、JavaScriptを書いてその場で実行することができます。書いたコードは誰でも見ることができ、トップページに並んでいる人気のコードを見るだけでも楽しむことができます。 また、単にコードを書いたり人が書いたコードを見たりするだけでなく、他にも
[読了時間:1分] 先日、リリース間近とお伝えしたHTML5ゲームエンジン「IMPACT」が12月21日未明、正式に公開となった。同エンジンで開発されたゲームは、iOS上では60フレーム/秒を実現するとされており、HTML5対応のウェブブラウザであればプラグインなどをインストールする必要なく実行できるという特徴を持つ。サイトには、効率の良い開発スタイルを説明するビデオやサンプルソースコードなどが公開されている。ライセンスは価格は99ドル。 エンジンを開発した独Dominic Szablewski氏は、HTML5に対応したモダンブラウザ上で高速に動作するゲーム「Biolab Disaster」を公開、その開発のために使用したエンジンを一般に提供すると告知していた。今回の正式リリースで、このゲームもアップグレード。公言通り、iOS上でも快適に動作するようになっている。 lMPACTは、HTML
Safari Web Content Guide for iPhoneを読み解きながら、iPhone/iPod touch上のWebブラウザのSafariで動くWebアプリを作成し、UIを最適化するコツを紹介します。 (編集部) Safari Web Content Guide for iPhoneを読み解く ネイティブアプリケーション開発を可能にするSDKが公開され、一層注目を集めている米アップルのiPhone(Applle Developer)。3Gへの対応がうわさされ、日本市場向けの発表も待たれますが、読者の中には、早速iPhone向けのアプリケーション開発にチャレンジしている人もいるでしょう。 しかし、ネイティブアプリケーションを作るにはそれなりにプログラミングスキルが必要ですし、完成したアプリケーションは米アップルが用意する「App Store」経由でしか配布できないといった制約
iPhone/iPad用OSの新バージョン「iOS 4.2.1」が11月22日にリリースされました。すでにインストールした方も多いでしょう。目玉はiPadのマルチタスク対応などの新機能ですが、今回のバージョンアップはiPhone/iPad向けのWebアプリケーション開発者にもうれしい新機能が追加されています。ブラウザー周りで追加または強化された機能を以下にリストアップします。 加速度センサー/傾きセンサーのサポート Web Sockets (ソケット通信)のサポート HTML5 Formsのサポート XMLHttp Request Levle 2 (一部) のサポート 印刷のサポート Int32やFloat32Arrayなどの配列のサポート イベントの追加 Canvas/SVGの機能追加 その他 新機能に関するリファレンスは米アップルのサイトに用意されています(11/15日付の情報)。 今
ご挨拶 こんにちは、ロンドンのNew Bambooという会社でWebエンジニアとして働いている@makoto_inoueです。ここのところ、PusherというWebSocketのクラウドサービスの開発に関わっています。今回から3回に渡ってWebSocketに関する短期連載を担当させていただきます。 私を含めたNew Bambooの面々(我々は自分たちのことをBambinoと呼んでいます)がWebSocketになぜ興味を持ったかということからはじまり、実際にクラウドサービスを始めるまでにいたったストーリーをお話ししたいと思います。そのストーリーを通じて、WebSocketが切り開く「リアルタイムWeb」な世界への可能性や技術的課題を皆さんと共有できればと思っています。
HTML5とともにW3Cで標準化が進められているDOM APIの1つに「Web Storage」があります。Web StorageはCookieと同様にローカルディスク上にデータを保存する機能で、Cookieに比べて「有効期限がない」「データサイズの制限がない」といった特徴があります。ローカル上に永続的にデータを保存できるので、フォームの入力内容の保存やゲームのプレイ履歴の記録、各種サービスの状態保存など、などさまざまな用途に利用できます。 Web Storageにはローカルストレージとセッションストレージがあり、永続的にデータを保存する場合はローカルストレージを、ブラウザーを開いている間の一時的な保存であればセッションストレージを使います。ローカルストレージ、セッションストレージとも同じメソッドを持ち、記述方法に違いはありません。 今回のJavaScriptラボは、HTMLフォームに入力
Nicholas C. Zakas is a web software engineer who specializes in user interface design and implementation for web applications using JavaScript, Dynamic HTML, CSS, XML, and XSLT. Nicholas C. Zakas氏がNCZOnlineのLearning from XAuth: Cross-domain localStorageの記事で、XAuthで採用されている機能を紹介している。XAuthは複数のドメイン間でデータを共有するための機能を提供してくれる。氏はXAuthで採用された方法は複数の違うドメインの間で永続的にデータを共有するテクニックとして素晴らしい方法だとしており、簡単なサンプルコードも含めて説明している
Opera Developer CommunityにてCristian-Ionut Colceriu氏がBuilding a custom HTML5 video player with CSS3 and jQueryというタイトルでCSS3/jQueryでオリジナルのHTML5 videoプレーヤを作成する方法を紹介している。 <video>要素はすでに多くのモダンなWebブラウザがサポート済み。まだプレビュー版ではあるが、Internet Explorerでもバージョン9にてサポートされている。動画をネイティブに埋め込むことでさまざまなメリットが生じることもあり、多くのデベロッパができるだけ早くこれらの機能を試用したいと考えている。 しかしながら試用するにあたり、いくつかの障壁もある。Building a custom HTML5 video player with CSS3 and
Come creare il miglior gioco da casinò Quando si progetta un gioco da casinò, la prima cosa che devi considerare è che tipo di gioco sarà. Ci sono molti diversi tipi di giochi da casinò, dalle slot e video poker ai giochi da tavolo e giochi di carte. Dovrai decidere quale tipo di gioco si adatta meglio alle tue esigenze. Ogni tipo di gioco ha il proprio set di regole e regolamenti, quindi dovrai a
iPhone特有の操作としては、指で左右に弾くことで次のページ・前のページを表示できる操作があります。 前回のJavaScriptによるイベント取得と、jQueryおよび、Spry framework for Ajaxを組み合わせるとWebアプリでもこの操作が可能です。方法を紹介しましょう。 デモプログラムはこちらから まずは、iPhone用のページテンプレートを作ります。iPhone site extensionを使うと便利です(笑 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>iPhoneでスライドを作るサンプル</title> <meta name="viewport" content="width=device-widt
moobileはHTML/JavaScript製のフリーウェア(ソースコードは公開されている)。iPhone/Androidを中心とするスマートフォンのシェア拡大は留まることを知らない。モバイルネットワークが発展している限り、この流れは止まることはないだろう。Webサイトを提供する上でもスマートフォンは欠かせない存在になる。 ボタンバー ネイティブアプリを提供する手もあるが、もっと容易なのが最適化されたWebサイトを提供することだ。そもそもネイティブアプリを提供するほどのニーズがないサービスもあるはずだ。そこで使えるのがmoobileになる。 moobileはiPhoneやAndroidといったWebKitベースに対応したWebサイトフレームワークだ。HTML5で作成されているのが特徴だ。フォームやボタン、ボタンバーなどのUIをテンプレート化している。これを使えば最適化されたWebサイトが
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く