HTML5/CSS3のニュースやTIPSなどのまとめ (2012年6月6日)

ニュース

Xbox 360版Internet Explorerブラウザ発表、KinectやSmartGlass操作に対応 (engadget)

http://japanese.engadget.com/2012/06/04/xbox-360-internet-explorer-kinect-smartglass/

！！！「特徴はWindows 8とおなじIE10ベースでHTML5やインタラクティブコンテンツに対応すること、コントローラに加えてKinectのジェスチャや音声コマンド、Xbox SmartGlassで携帯電話やタブレットからも操作できること」

ハードの枠を取り払ったMicrosoftの新Xbox戦略 (後藤弘茂のWeekly海外ニュース)

http://pc.watch.impress.co.jp/docs/column/kaigai/20120605_537785.html

！！！「HTML5とスクリプトベースのプログラミングスタイルを、Windows 8だけでなく、Xbox 360にも持ち込み、他のプラットフォームとの連携を取ろうとしていると推測」

もうフラッシュはいらない？急増するHTML5採用サイト (PC Online)

http://pc.nikkeibp.co.jp/article/trend/20120514/1049324/

Windows用に最適化された「Firefox」ベースのWebブラウザー「Pale Moon」 (窓の杜)

http://www.forest.impress.co.jp/docs/review/20120604_537635.html

インターネットでものづくりするときに役立つサイトまとめ (KAYAC DESIGNER'S BLOG)

http://design.kayac.com/topics/2012/06/make-internet.php

イベント・セミナー

「Flashユーザーが取り組むHTML5」アンケート結果 (SlideShare)

http://www.slideshare.net/448jp/flashhtml5

5/19に行われた「Flashユーザーが取り組むHTML5」のアンケート結果。

書籍

すべての人に知っておいてほしいスタイルシートデザインの基本原則 - CSS3といった最新の情報・実装方法まで

http://www.amazon.co.jp/dp/4844362674?tag=dothtml5-22

2,625円、出版社：エムディエヌコーポレーション、著：秋葉秀樹／安住光／坂本亮介／千貫りこ／鍋坂理恵／林豊／比留間和也

サイト・アプリ

MoonWarriors - Cocos2d-html5 Show Case

http://www.cocos2d-x.org/MoonWarriors/index.html

http://www.cocos2d-x.org/news/58

https://github.com/ShengxiangChen/MoonWarriors

http://dothtml5.com/archives/20120530_clips.html#pickup4

先日公開されたモバイルHTML5ゲーム向けのJSライブラリ「Cocos2d-html5」のデモゲーム。縦スクロールのシューティングゲーム (英語)

「Blockly」ブロックを組み合わせてプログラミングできるGoogleの新プロジェクト (TechWave)

http://techwave.jp/archives/51748213.html

http://blockly-demo.appspot.com/blockly/demos/maze/index.html

サイレンで指定時刻をお知らせするブラウザ内で起動するタイマー「Timer Tab」 (Html5 Collect)

http://jp.html5collect.net/%E3%82%B5%E3%82%A4%E3%83%AC%E3%83%B3%E3%81%A7%E6%8C%87%E5%AE%9A%E6%99%82%E5%88%BB%E3%82%92%E3%81%8A%E7%9F%A5%E3%82%89%E3%81%9B%E3%81%99%E3%82%8B%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E5%86%85%E3%81%A7/

http://www.timer-tab.com/

ツール

Response JS - mobile-first progressive enhancement in HTML5.

http://responsejs.com/

https://github.com/ryanve/response.js

http://javascript.webcreativepark.net/library/responsejs

http://www.moongift.jp/2012/11/20121104/

レスポンシブなサイト構築に便利なjQueryプラグイン。ライセンスはMIT (英語)

Google Swiffyドキュメント日本語訳 (case:MobileDesign!)

http://case-mobile-design.com/swiffy/document/

http://www.google.com/doubleclick/studio/swiffy/

実行のタイミング (開始時間・回数・リピートなど) を簡単に設定できるスクリプト「timing」 (コリス)

http://coliss.com/articles/build-websites/operation/javascript/jquery-plugin-timing.html

http://creativecouple.github.com/jquery-timing/

http://phpspot.org/blog/archives/2012/06/jsjquerytiming.html

Dreamweaverのコードヒントをカスタマイズしてみる (バシャログ)

http://c-brains.jp/blog/wsg/12/06/04-120556.php

TIPS

Web MIDI APIのドラフトが公開されました (Eiji Kitamura)

https://plus.google.com/107085977904914121234/posts/iW7dppxFMzb

https://dvcs.w3.org/hg/audio/raw-file/tip/midi/specification.html

JavaScripterから見たJSX (nmi.jp)

http://nmi.jp/archives/396

さくらVPSでJSXが動くまで (スマホxHTML5 Web＆ハイブリッドアプリ開発者ブログ)

http://html5dev.jp/?p=238

Canvasを使って3Dグラフィックスを作成する方法 (Internet Explorerデベロッパーセンター)

http://msdn.microsoft.com/ja-jp/library/ie/hh535759.aspx

Bible Karaoke

http://j.hn/lab/html5karaoke/

http://johndyer.name/html5-audio-karoke-a-javascript-audio-text-aligner/

音声を解析してHTMLの該当部分をハイライトするデモ？ (英語)

[HTML5] ApplicationCache めも (l4l)

http://kozy.heteml.jp/l4l/2011/08/html5-applicationcache.html

古記事。

CSS3

LESSで3倍ラクするスマートフォンコーディング第1回 LESSのメリットと導入方法 (技術評論社)

http://gihyo.jp/design/serial/01/less/0001

ゼロから始めるレスポンシブWebデザイン入門第1回レスポンシブWebデザインとは (ASCII)

http://ascii.jp/elem/000/000/697/697463/

CSS3で雑誌風の２段組レイアウト＋１文字目を大きくしてみる (Love&pointcard)

http://pointcard.me/css3-magazine/

CSS3 Stacks with pseudo-elements

http://inspectelement.com/demos/css3/stacks/

http://inspectelement.com/tutorials/create-the-illusion-of-stacked-elements-with-css3-pseudo-elements/

http://coliss.com/articles/build-websites/operation/css/css-tutorial-stacked-elements-by-inspectelement.html

JavaScriptナシのCSS3だけで作る、写真が何枚かズレて重なっていてマウスを載せると整理されるようなデモ (英語)

（＊価格は掲載時のものです。購入時にご確認ください。）