XHTML1.0とHTML5の違いをスタバのページで紹介 (1/6)
「HTML5タグの誤用で恥をかいた」「分厚い仕様書は読み切れない」コーダー＆デザイナーのためのコーディングガイド。最終草案に対応したほか、商用サイトを意識したコーディング例を新たに書き下ろし。HTML5マークアップへ移行するために必要な知識を効率よく学べる1冊です。ネットで話題の「HTML5カルタ」付き! HTML5マークアップ 現場で使える最短攻略ガイド 定価：2,808円 （本体2,600円）／形態：B5変 (240ページ) ISBN：978-4-04-866070-9 HTML5と従来のHTML4.01やXHTML1.0との違いは、既存のサイトをHTML5化してみると理解しやすいでしょう。今回は、実在するWebサイトをHTML5に（勝手に）リニューアルしながら、HTML 4.01やXHTML 1.0との違いを解説します。ソースコードだけをリニューアルすることは実務ではあまりないと思い
Firefoxでソフトシンセも作れるAudio Data APIの使い方 (1/5)
HTML5ではメディア要素としてAudioが定義され、プラグインを使わずに音声を扱えます。HTML5 Audioについては本連載でも何度か取り上げてきました。 ・第35回「HTML5 Audioで作るiTunes風音楽プレイヤー」 http://ascii.jp/elem/000/000/525/525808/ ・第36回「JSONで管理するHTML5音楽プレイヤーを作ってみた」 http://ascii.jp/elem/000/000/531/531370/ ・第37回「iPad対応！HTML5 Audioで作るブラウザーピアノ」 http://ascii.jp/elem/000/000/533/533100/ これまでに作成したHTML5 Audioのサンプルは、事前に用意したオーディオファイルを再生しており、プログラムで音を生成しているわけではありませんでした。一方、Firefox
JavaScriptで並列処理ができる「Web Workers」 (1/5)
HTML 4時代のJavaScriptは主にWebページの装飾に使われていたので、マシンやブラウザーへの負担はそれほど高くなく、JavaScriptの処理にユーザーが待たされることはほとんどありませんでした。ところが「Webアプリケーションのプラットフォーム」と位置付けられるHTML5時代になると、JavaScriptのプログラムは巨大で複雑になります。そのため、各ブラウザーベンダーはJavaScriptエンジンを高速化し、複雑で時間のかかる処理を素早くこなせるように努力してきました。 しかし、いくら高速化しても回避できないこともあります。従来のJavaScriptはJavaのようなスレッド処理ができないので、時間のかかる処理を実行するとブラウザーが停止状態になってしまい、その間、ユーザーはUI操作がまったくできなくなる問題がありました。 そこで、ブラウザーで複数の処理を並行して実行させる
実例でわかる！スマートフォンサイトの画面設計 (1/3)
スマートフォンサイト設計の基礎知識に続いて、今回からは実際のスマートフォンサイト制作のプロジェクトの流れに沿って、具体的なサイト設計と制作方法を解説します。ぜひ一緒に手を動かしながらスマートフォンサイトの制作の流れを学んでいきましょう。 実在するサイトが課題です！ 題材にさせていただくのは、東京都江東区で幼児向けのプリスクール（就園準備スクール）を運営する「プレイグループ木場校」さんのWebサイトです。 プレイグループ木場校のWebサイトでは、入学を検討している保護者やすでに通学中の生徒の保護者へ向けて、さまざまな情報を提供しています。カリキュラムや先生の紹介といったスクール案内に加えて、コラムなどのコンテンツも充実しており、情報量はかなり多い方だと言えます。 今回はこのWebサイトのスマートフォン対応の企画、設計について考えてみましょう。 ゴールの設定とコンテンツの選定 スマートフォンの
Webアプリをインストール!?Chrome Web Storeって何？
Google I/O 2010で発表されたグーグルの新しい動きの中で、謎に包まれているのが「Chrome Web Store」だ。「Webアプリケーションのマーケットプレイス」「App StoreのWebアプリ版」という説明は分かるようでよく分からない。Chrome Web Storeとは一体何なのか？ 5月25日に都内で開かれた報道関係者向けのGoogle I/O報告会から、Chrome Web Storeの姿を探る。 Webアプリ移行の障害を取り除く グーグルはWebアプリケーションの普及にとにかく熱心だ。HTML5（＋JavaScript）への取り組みは有名だが、それだけではない。「Native Client」と呼ばれる技術で、C/ C++で書かれたプログラムもブラウザー上で実行できる環境を用意し、あらゆるアプリケーションのWeb化を推し進めようとしている。 グーグルの及川卓也シニア
HTML5とjQueryでブラウザーがペイントツールに！ (1/3)
HTML5 Canvasで作った「シンプルペイント」。色とサイズが選べ、保存もできる。画像クリックでサンプルページを表示します（Firefox 3／Opera 10／Safari 4で表示可能） HTML5 CanvasとJavaScriptを使って、Webブラウザー上で動くお絵かきツール「シンプルペイント」を制作する企画。前回の記事では、コアとなる描画機能を作成し、PNGファイルへ保存する方法を解説しました。今回は、このシンプルペイントをベースに、ブラシの色やサイズ（太さ）を変更できるように拡張しましょう。 ブラシの色選択機能を付けるには 前回作成したシンプルペイントは単色（赤色）の描画しかできませんでした。このままだとお絵かきツールとしては不十分なので、ブラシの描画色を選択できるようにしましょう。今回は8色（黒、青、赤、紫、緑、水色、黄、白）のカラーパレットを用意し、マウスで選択した色
HTML5本の著者が講師！Web制作者の勉強会開催
HTML5とJavaScriptを使ったWebアプリの開発に欠かせない「DOM（Document Object Model）」の基礎を学ぶ勉強会「SwapSkills 2010 vol.7『HTML5に備えよう：DOMの超基本』」が、東京・蒲田の大田区産業プラザ PIOで9月12日に開催される。主催はallWebクリエイター塾。 講師は、今年2月に「HTML5マークアップガイドブック 」を上梓した羽田野 太巳氏と、オペラ ソフトウェアのエバンジェリストとして活躍するダニエル・デイビス氏。羽田野氏は「DOMの超基本」としてDOMやイベントの概念などの基礎知識を、デイビス氏はJavaScriptのコーディングフローやデバッグ方法などの実務的な知識を解説する予定だ。 羽田野氏、デイビス氏ともに、今年4～5月に開催されたSwapSkillsのHTML5勉強会（関連記事）でも講師を務めている。前回の
ASCII.jp：HTML5はFlashの脅威か？エバンジェリストに聞いた
かつてFlashの専売特許だったRIA（リッチ・インターネット・アプリケーション）の世界が激変している。JavaScriptの高速化が進み、jQueryやYUI（Yahoo! User Interface Library）、Ext JSなどのフレームワークを使ったAjaxアプリケーションは珍しくなくなった。2012年にW3C（World Wide Web Consortium ）が勧告を目指している「HTML5」をめぐる動きも、ここのところ活発化している。 こうしたライバルたちの動きを、アドビ システムズはどう見ているのか？ 2010年に発売する新しいデザインツール「Flash Catalyst」のPRのため来日した、米アドビ システムズのシニア プラットフォーム エバンジェリストであるエンリケ・デュボス氏に話を聞いた。 HTML5の完成には10年かかる ――ここ数年でRIAの環境が大きく
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ASCII.jp：Web制作の現場で使えるjQuery UIデザイン入門