最新技術を学べるHTML5 Conference 2012の発表資料WebGL and Three.js / HTML5時代のWebデザイン / HTML Web Platform他...全10件
HTML5カンファレンス2012の資料まとめ
HTML5カンファレンス2012の講演資料のまとめです。 HTML5カンファレンスは非常に有意義なものでした。講演頂いた方、スタッフの皆様ありがとうございます。 HTMLとかCSSとかAPIとか -2012秋編-（矢倉眞隆さん） HTML5 や CSS3 の新しいタグやプロパティについての解説。 でもその前に、W3C と WHATWG についての話。 一部のメディアで、W3C と WHATWG が決裂したかのような報道がされたが、実際は問題ないとのこと。 W3C と WHATWG の Editor を務めていた Ian Hickson氏は WHATWG の HTML に集中し、バグ修正が加速しそうです。 セッションでは紹介されていませんでしたが、こちらの記事に Ian Hickson氏からのメールの邦訳など載っています。 HTML5仕様をめぐるW3CとWHATWGについて、Ian Hick
iOS でサポートされた viewport 以外の meta タグ
前回の記事のついでに viewport 以外の iOS でサポートされているメタタグについて整理してみましょう。 Supported Meta Tags <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="format-detection" content="telephone=no"> apple-mobile-web-app-capable content が yes にセットされているならば、ウェブアプリケーションはフルスクリーンモードで実行されます。デフォルトのふるまいは、ウェブコンテンツを表示するために Safari を使用することです。JavaScript
Happy Elements Labs: websocket + HTML5(canvas)でのゲーム開発(ボンバーマン風)
はじめに エンジニアの@ryooo321です。 よろしくお願いします。 Happy Elements株式会社では勉強会が活発に行われており、 その中の1つに「1.5時間で○○を作る」エンジニア向けワークショップがあります。(毎週開催@京都) ※ ○○は毎週かわり、設計/実装方法などは自由です。 今回はワークショップ2回(計3時間)で作成したボンバーマン風ゲームの紹介を通して、 他人とリアルタイムで遊べるゲームの可能性を感じていただければと思います。 ※ 技術的にはwebsocket、canvasを利用 ※ ライブラリ/ツールとしてNode.js、CreateJS、socket.io、coffeescriptを利用 ※ 急いで作ったのでほとんどリファクタリングされていませんmm また、おまけとして サーバーサイドでのcanvas描画とwebsocketでのバイナリメッセージについて 試してみ
そろそろ実践投入もありうる？Audio Sprite - komagataのブログ
ご存知の通りスマホのHTML5 Auidoは現状酷い状態です。 全プラットフォーム共通で再生できるフォーマットが無かったり、iPhoneは独自仕様で自動再生はできず、ユーザー操作由来のアクションからしか再生できなかったり、複数音が再生できなかったり、Androidは2.2までは全然動かなかったり。 対応策として知られているのがCSS SpriteならぬAudio Sprite。複数の音楽ファイルをつなげて一つのファイルにし、シーク位置を制御することで好きな音を鳴らしたりループしたりする姑息なテクです。 そんな面倒なことやってられるかと思ってたんですが、そろそろAudio Sprite用のツールも揃って来ました。 jukebox zynga/jukebox ひとつはAudio Sprite用の再生ライブラリjukebox。Zyngaが作ってるのでちょっとマジっぽいです。 var settin
html5でアプリの壁を超える方法
制限 同時に再生できる音源は1ファイルのみ 再生できるタイミングはユーザイベントのハンドラ内だけ プリロード不可 OS自体のサイレントモードと連動せず BGMを流すだけならこんな方法も $('<div>BGMを再生しますか？</div>').appendTo('body').click(function () { $(this).remove(); (new Audio('bgm.mp3')).play(); }); $('body').on('click', 'a', function (e) { e.preventDefault(); $.get($(this).attr('href')).success(function (html) { $('body').html(''); $('body').append($(html).find('body')); }) });
暑さでやる気がでないWebデザイナーにおくるHTML5表現まとめ
仲夏。HTMLファイ部の本多です。 jsdo.itにて、コーディングコンテスト「Web Creator's Contest Q」を開催しています。 QはWebクリエイターのためのコンテスト、HTML5、JavaScript、CSSを駆使して挑戦しましょう！ 募集中のテーマはズバリ、 ＼ 夏を涼しくする表現 ／ 暑い夏をひんやり涼しくしてくれる作品をお待ちしています！ 本記事では、続々と集まっている投稿作品の一部をご紹介します。 夏の暑さでやる気のでない方、涼しくてアツいHTML5作品をご堪能あれ！ ※ Chrome、Safari など、最新のモダンブラウザでご覧ください。 夏を涼しくするコードまとめ！ ripple sound 音と波紋を合わせた表現が爽やかで良いですね...！ A～Zのキーを押すと自分で波紋を出せます。
HTML5導入前に覚えておきたいこと｜Webクリエイターネット
Category HTML iPhone・iPad・Androidといったモバイル端末では、HTML5は普通に使われていますが、PCサイトでもInternet Explorer9の登場で無視できない存在になってきました。 今回はPCサイトにおけるHTML5の導入に関して少し書こうと思います。 Keyword：HTML5,DOCTYPE,IE対応,html5.js,IE9.js SafariやFirefoxといったモダンブラウザは以前からHTML5の新要素に対応していましたが、Internet Explorerが対応していなかったため、以前と同じようにXHTMLでサイト制作をすることが多かったのですが、バージョン9の登場でHTML5でサイト制作をするのも珍しくなくなってきました。 ですが、Internet Explorerは一番使用率の高いブラウザですので、前バージョンの7や8等も無視できま
リッチスニペットにも使われる構造化データの状態をGoogleウェブマスターツールで確認可能に
[対象: 上級] サイトに実装している構造化データをGoogleがどのように認識しているかの状態をGoogleウェブマスターツールで確認できるようになりました。 ウェブマスターツールの [最適化] メニューのなかに [構造化データ] というダッシュボード（レポート）ができています。 レポートには以下の3種類があります。 サイト レベル アイテム レベル ページ レベル 1. サイト レベル サイトレベルのレポートは、どんなタイプの構造化データをGoogleが認識しているかを表示します。 Googleがサポートする構造化データは、schema.orgやmicroformats、RDFaなどいくつかありますが、どの仕様のどの型をGoogleが得検出しているかを知ることができます。 2. アイテム レベル アイテムレベルのレポートは、その構造化データがどのページで検出されたかを表示します。 最終
HTML5 for IA
3. セマンティックWebとは セマンティック・ウェブ（Wikipediaより） セマンティック・ウェブ(Semantic Web)はW3Cのティム・バーナーズ＝リーによって提唱された、 ウェブページの意味を扱うことを可能とする標準やツール群の開発によってWorld Wide Webの利利便便 性を向上させるプロジェクト。セマンティック・ウェブの⽬目的はウェブページの閲覧という⾏行行為に、 データの交換の側⾯面に加えて意味の疎通を付け加えることにある。 現在のWorld Wide Web上のコンテンツは主にHTMLで記述されている。HTMLでは⽂文書構造を伝え ることは可能だが、個々の単語の意味をはじめとする詳細な意味を伝えることはできない。これに対 し、セマンティック・ウェブはXMLによって記述した⽂文書にRDFやOWLを⽤用いてタグを付け加え る。この、データの意味を記述した
Modern Syntax
あと番組中では取り上げなかったんですけど、昨日Netflixで「死霊のはらわた ライジング」というのを観たのですが、これがなかなかよいスプラッターホラーでした。血がドバドバ出るのは苦手、という人にはまったくお勧めしませんが、最近のホラー映画はいまいちと思っている人は是非観てみてください（ちなみに私はホラー映画ファンです）。 さて、モダシンラジオのデータをホスティングしてもらっているSpotify for Podcasters(旧Anchor）の私のページはこちらです。 https://podcasters.spotify.com/pod/show/kazuyoshi-nagasawa このSpotify for PodcastersページのRSSは以下になります。こちらのRSSではenclosureタグなどでlength値などがしっかり入っているのでこれを購読しておくとよいかと思います。
HTML5仕様をめぐるW3CとWHATWGについて、Ian Hickson氏がメーリングリストに書いたこと
HTML5の仕様策定が、今後W3CとWHATWGに分裂するのではないか、といった言説が流れています。発端となったのは、W3CのWHATWGグループにIan Hickson氏が投稿したメールです。 [whatwg] Administrivia: Update on the relationship between the WHATWG HTML living standard and the W3C HTML5 specification from Ian Hickson on 2012-07-19 ([email protected] from July 2012) [whatwg] Administrivia: Update on the relationship between the WHATWG HTML living standard and the W3C HTML5 spec
これからHTML5を書く人のためのセキュリティ - HTML5など勉強会
2. 目次 • 自己紹介 • これから書き始める人の悩み • ついついやってしまうセキュリティホール • HTML5まわりで起こるセキュリティ対策 • まとめ • 参考文献 HTML5など勉強会 #05 2012/07/21 @ym405nm http://ym405nm.info 3. 自己紹介 • 名前：松本 悦宜(よしのり) • Twitter : @ym405nm • 会社：神戸デジタル・ラボ • 業務：Webプログラマー、セキュリティエンジニ ア、セキュリティコンサルタント セキュリティ JavaScript HTML5 Android Web 神戸ITフェスティバル 讃岐うどん 小ネタ HTML5など勉強会 #05 2012/07/21 @ym405nm http://ym405nm.info 4. 自己紹介 • セキュリティ診断 事例 : ECサイト 管理者アカウントがのっと
ol要素のstart属性を使わずにCSSで番号を途中から振る方法
ol要素のstart属性を使わずに、CSSで番号を途中から振る方法を紹介します。 番号付きリストで「第10位以降のランキング」など、途中から番号を振るケースは少なくないと思いますので、ご活用頂ければ幸いです。 １．基本 ol要素を使えば番号付きリストを作成できます。 HTML <ol> <li>あああ</li> <li>いいい</li> <li>ううう</li> </ol> 実行結果 あああ いいい ううう ol要素にstart属性を使えば、番号を途中から割り振ることもできます。 例えば、次のようにstart属性に「5」を設定すれば、番号付きリストを「5」から開始することができます。 HTML <ol start="5"> <li>あああ</li> <li>いいい</li> <li>ううう</li> </ol> 実行結果 あああ いいい ううう ただし、このstart属性はHTMLあるいは
Another HTML-lint 5がツッコミどころ満載な件について - 血統の森+はてな
さて、keio.ac.jpのサービスが停止したのはid:momdo:20120711:p1で書いたとおりですが、石野氏のサイトにも正式告知が来てました。 Ringのサービスは停止しています。ゲートウェイサービスは、株式会社ジゾン様のサイトを利用してください。 ソースは以下からダウンロードしてください。 この内容からだと、意図的に止めてるのか、事故で止まってるのかさっぱりわかりませんね…。 ところで、いつの間にか株式会社ジゾンのサービス（http://www.htmllint.net）がアクセス可能になったようです。 Another HTML-lint 5無償でご利用できるHTMLの構文チェックツールです。 元々1997年度に石野恵一郎氏によってPerl5で作成されました。 Another HTML-lint 5は株式会社ジゾンがAnother HTML-lint をベースにHTML5に対応
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
パララックスでレスポンシブでJ query mobileなサイトのつくりかた
Learn Forms | web.dev
pdf.js：PDF を HTML5 と JavaScript で表示する
http://blog.e-riverstyle.com/2012/07/html5table.html
Web Design and Development Tutorials - Design Articles - SEO Tips