Engadget | Technology News & ReviewsHands-on with the new iPad Pro M4: Absurdly thin and light, but the screen steals the show
注目！Flash CS風のUIでHTML5のタイムラインアニメーション作成·Radi MOONGIFT
RadiはHTML5対応のタイムラインベースのアニメーション作成ソフトウェア。 RadiはMac OSX用のフリーウェア（β版中につき無料）。Webブラウザ上でインタラクティブでタイムラインベースのアニメーションを作ろうと思ったらFlashを使うのが一般的だ。しかしそれはHTML4までだ。HTML5になればCanvasタグを駆使することでアニメーションさえ自在に作れる。 メイン画面 とは言えそれはあくまでも「駆使」すればの話でしかない。やはりツールがなければ容易に作れるものではないし、容易でなければ普及しないだろう。そこで注目されるのがRadi、HTML5対応のアニメーション作成ソフトウェアだ。 RadiはFlashのようにレイヤーを重ねてタイムラインベースのアニメーションを作成する。作成したコンテンツはvideoタグ、canvasタグで出力することができる。フレーム間の動きは自動で補完で
[CSS]今、そして近い将来に使用するであろうスタイルシートのテクニック集
CSS3のテクニックはさまざまなものがありますが、その中からまさに今、そして次のプロジェクトに使用したくなるテクニックを紹介します。 The Bright (Near) Future of CSS [ad#ad-2] 下記は各ポイントをピックアップして意訳したものです。 はじめに Styling HTML5 Classing like HTML5 Media Queries Styling Occasional Children Styling Occasional Columns RGB Alpha Color HSL and HSL Alpha Color Shadowy Styles Multiple Backgrounds 2D Transforms はじめに ここでフォーカスするのは、今、そして近い将来に使用するであろうスタイリングのテクニックです。HTML5の要素のスタイリング
HTML5で進化したフォーム機能 ここが違う！サンプルで見るHTML5（5）
はじめに この連載では、今日のウェブ業界の流行語となっている「HTML5」をとりあげ、全6回に分けて、これまでの技術とどのような違いがあるのか、具体的にサンプルのコードを示しながら解説していきます。 過去の連載も読む 第1回：HTML5が注目を浴びる理由とは？ 第2回：HTML4から変化したHTML5のマークアップ 第3回：HTML5で再定義された要素と属性 第4回：HTML5で実現できるマルチメディア系機能 新たに導入されたフォームコントロール これまでウェブにおける入力フォームコントロールは、非常に限られたものしかありませんでした。皆さんがよくご存じのテキスト（パスワード）入力フィールド、ラジオボタン、チェックボックス、セレクトメニュー、テキストエリア、ファイル選択です。お問い合わせフォームであれば、ほとんどのシーンで十分といえるでしょうが、ウェブアプリケーションにおいては、不足してい
HTML5 で書道が楽しめる The Shodo の完成度がすごい - てっく煮ブログ
ちまたでは HTML5 が話題ですね。「HTML5 ではこんなこともできます」といった紹介はいろんなところでみかけますが、「じゃあ、ぶっちゃけ、どんなサイトが作れるのよ」がいまいち見えてない人も多いのではないでしょうか。そんな中、HTML5 の機能を活用した完成度の高いサイトが登場していました。その名も The Shodo。 The Shodo (http://www.theshodo.com/)ブラウザ上で書道体験The Shodo ではこんな感じにブラウザ上で書道を楽しむことができます。書くときにカーソルの位置に手が大きめに表示されるのが本当に書道している気分にさせてくれます。硯をクリックして色の濃さを選んだり、筆をクリックして筆の太さを選んだりもできます。ちょっとした動画や BGM が雰囲気を盛り立てるトップページで [Write] を選ぶと書き始められるのですが、最初に動画で墨を擦
WebKit HTML5 Search Inputs | CSS-Tricks
One of the new types of inputs in HTML5 is search. <input type=search name=s> It does absolutely nothing in most browsers. It just behaves like a text input. This isn’t a problem. The spec doesn’t require it to do anything special. WebKit browsers do treat it a bit differently though, primarily with styling. A search input in WebKit by default has an inset border, rounded corners, and strict typog
jQueryとCSS3、HTML5でここまで出来るホバーインタフェース:phpspot開発日誌
WanderWall ? A jQuery, CSS3 & HTML5 Hover-Based Interface | AddyOsmani.com | Where User Interface Ideas Grows jQueryとCSS3、HTML5でここまで出来るホバーインタフェース。 jQueryで様々なことが出来るようになっているのはご存知だと思うのですが、更にCSS3とHTML5も組み合わせるともっとすごいよ、という１つのデモです。 まだまだインタフェースは進化するのだな、という可能性を感じるものになっているので一回見ておいたらよいかも。 WanderWallのデモ とにかく実際にHTML5対応のブラウザで見てみもらうのが一番分かりやすいです 上のメニューにカーソルを合わせると画面がアニメーションしながらクールに切り替わります。 HTML5ブラウザがデフォルトになり、こうした技
HTML5+CSS3用のブラウザのスタイルをリセットするテンプレートファイル -HTML5 Reset
HTML5+CSS3の環境で汎用的に利用できるHTML・スタイルシート・スクリプトなどのファイルを一式にまとめたテンプレートを紹介します。 ファイル構成：コメント無し版 各ファイルの説明 index.html HTML5の要素を配置した汎用的に利用できるHTMLファイル。各スタイルシートファイルも埋め込まれています。 css/main.css @import用のスタイルシートです。 css/reset.css Eric Meyerの「Reset CSS」です。 css/core.css ベースとなるスタイルが定義されています。 css/_patches 各ブラウザ用のスタイルシートです。 css/_print プリント用のスタイルシートです。 js Modernizrがセットされています。
HTML5ってすごいわ！ この8bitアニメーションを見てちょうだい！（動画あり）
HTML5ってすごいわ！ この8bitアニメーションを見てちょうだい！（動画あり）2010.08.03 15:00 どん！ どん！ どどどん！ HTML5って本当に魔法のようなのですね。この下のアニメーション動画は、HTML5を使って作られているのです。水の反射なんて、そりゃもうキレイなもんですよ。動画にあるのは1部だけですが、ネタ元で全シリーズ36シーン公開しています。ネタ元必見です！ 大きい画で見ると8bitらしさがよくわかります。 こちらの作品はMark Ferrariさんがイラストを、Joseph Huckabyさんがコーディングを担当。コーディングは8bitカラーシンクをHTML5で使ったそうです。 すごいなぁ、HTML5。この夏のキーワードは5だな！ [Effectgames] Jesus Diaz（原文／そうこ）
HTML5のポテンシャルを感じられる４８のサンプルサイト:phpspot開発日誌
HTML5 Showcase: 48 Potential Flash-Killing Demos | Design HTML5のポテンシャルを感じられる４８のサンプルサイト。 元エントリでは Flash Killing などという少々ショッキングなタイトルで表されていますが、まさに文字通りの凄いサンプルが多く紹介されています。 HTML5対応ブラウザでどうぞ 現在では、iPhoneやiPadでは既にHTML5は普通に動くので、HTML5はもう次世代というわけではなく、１つのスマートフォン向けのリッチなインターネットコンテンツ実装用の要素として覚えておくべき位置づけになっていますね。 関連エントリ 見ておくべきHTML5サイト集 HTML5のCanvasで動く超クールなデモページ HTML5なページでもIEで印刷した時に崩れないようにする「IE Print Protector」 CSS3とH
これがHTML5の実力！ フル3Dゲーム｢Quake｣をブラウザ上でプレイしてみた（動画）
これがHTML5の実力！ フル3Dゲーム｢Quake｣をブラウザ上でプレイしてみた（動画）2010.04.02 17:00 プラグインも、Flashも使ってません！ Google Web Toolkit Blogからの動画です。ご覧のとおり、フル3Dゲーム｢Quake｣がブラウザ上でスムーズに動いちゃってます。以下Google Web Toolkit Blogからの引用です。 我々はJake2と呼ばれるQuake2ゲームエンジンの純粋なJavaのポートを、Google Web Toolkit （WebGL、WebSocketsなど）を使って、Javascriptに埋め込みました。この動画がそれです。驚いたことに1秒間に30フレームがノートPCで再生できたんです！ いやいや、HTML5超やばいって！ [Google Web Toolkit Blog via TechCrunch] （遠藤充）
Flashは死にません！アドビとグーグルが協力
アドビとグーグルが、｢深い関係｣になったそうです。 Chromeブラウザに、Flashがビルトインされるようになります。つまりChromeでは、Flashはプラグイン扱いせず、別々にアップデートする必要がなくなります。まるでそう、HTML5の理想を実現したかのような状態になるんです。 Chromeブラウザ開発チャネルではこの件がすでに動いていて、つまり近々、Chromeブラウザ、Cherome OSそれぞれにおいて実現されそうです。グーグルはこれについて次のように述べています。 ユーザーがChromeをダウンロードすると、最新のAdobe Flash Playerも付いてきます。Flash Playerを別でインストールする必要はありません。 ユーザーはChromeの自動アップデート機能を通じて、自動的にFlash Playerのアップデートも受けることができます。つまり、手動で別々にダウ
html5 ざっくりメモ
html5 関係無いのも有るかもですが、個人的にhtml5の要点をまとめたメモ。 ほんとにざっくり書いているので、何か期待しても何も出ません＞＜ 日本語が含まれる場合、title要素は charset の後（次）。 address要素は連絡先情報に使う。 例えば企業サイトの各支店の住所一覧とかに使うのはNG。ブログとかで、上手い店とかの住所にaddressを使うのもNG。 あくまでも、そのサイトの管理者への連絡先。なので、copyrightに使うのもNG。 copyrightはsmall要素が妥当。 なので、p small copyright って感じになる。 nav要素はあくまでも主要なナビゲーションに使う。 主要なってのは具体的にはグローバルナビゲーションやローカルナビゲーション。 なので、関連リンク一覧とか、ページ内にあるちょっとしたリンクに使うのはNG。 hgroup要素は、見出し
HTML5対Flash、HTML5の圧勝とは限らない？ | ライフハッカー・ジャパン
ビデオ再生の能率は、ハードウェアアクセラレーション能力の高さが、総合的なCPUロードにおいて、最も重要な要素といえます。FlashがハードウェアアクセラレーションにアクセスするWindowsでは、CPU稼働率はわずかなレベルまで落ちました。もしFlashプレイヤーが除去されず、GPUベースのハードウェア・アクセラレーションを持つMac（もしくはiPod/iPhone/iPad）にアクセスできた場合、HTML5とFlashのCPU稼働率の差は、かなり縮まったと思います。 さらにわかったのは、全てのHTML5ブライザ/H.264デコーダーが、等しく作られているわけではないということです。興味深いことに、全ての結果の中で最もCPU稼働率が高かったのは、Flash10.1を稼働させて、GoogleのHTML5を実行した場合でした（あくまでもWindowsの話ですが）。Macでは、FirefoxとS
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
HTML5では何ができるのか、各ブラウザの対応はどうなっているのか、が一目でわかる -What is HTML5?
HTML5の要素を元素表風にまとめたチートシートがかっこいい
HTML 5ベースの手軽なイメージエディター「CloudCanvas」 | ライフハッカー・ジャパン
CSS3とHTML5の主要ブラウザの対応状況一覧
Flashもどんなプラグインも使わない、HTML5でサクサク動くペイントアプリ「Sketchpad」 | ライフハッカー・ジャパン