タグ

html5に関するwillnetのブックマーク (46)

  • 【レポート】ビデオカメラをブラウザで使うHTML5 Device | エンタープライズ | マイコミジャーナル

    A vocabulary and associated APIs for HTML and XHTML Ajaxian - Video Conferencing with the HTML5 Device Elementにおいて、HTML5の策定とともに策定が進められているdevice要素が紹介されている。device要素が仕様として確定し、主要ブラウザがこの機能に対応した場合、専用のアプリケーションのインストールやプラグインのインストールなどをすることなく、USB接続のビデオカメラやWebカメラを経由したビデオ会議が実施できるようになる可能性がある。 策定中のdevice要素の仕様はHTML Deviceでチェックできる。device要素がどういった使われ方を想定しているかは、HTML Deviceに掲載されている次のサンプルを見るとわかりやすい。 <p>To start chattin

    willnet
    willnet 2011/04/26
    いつ実装されるの
  • HTML5をはじめる人、勉強したい人用のテンプレートファイル -Easy HTML5 Template

    HTML5 Templateのデモページ Easy HTML5 Templateの特徴 汎用性の高いシンプルなつくり HTML5の新しい要素に重点をおいて設計 HTML5対応ブラウザはもちろん、IE6, IE7, IE8も考慮 モバイルデバイスも考慮 jQuery, Google Analyticsなどよく使用されるものを配置済み [ad#ad-2] Easy HTML5 Templateの外部ファイル Easy HTML5 Templateで使用している外部ファイルです。 screen.css Reset CSSには「Eric Meyer's reset」が使用されています。 modernizr-1.6.min.js 「Modernizr」。HTML5やCSS3をサポートしているか調べ、CSSの場合はエレメントにclassを加えます。 html5.js 「html5.js」。IE9未満(

    willnet
    willnet 2011/04/09
    よさげ
  • HTML5とは何かを簡単にまとめてみた

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog はじめに こんにちは。R&D統括部 制作部 ウェブデベロップメント部に所属しております。岡部和昌(@kzms2)と申します。 最近スマートフォンやタブレット向けのページを作成する機会が増えてきました。 なので、今回はちまたで大人気のHTML5について書きます。 若干今更な内容にも思えますが、あまりHTML5になじみがない方にもわかってもらえるような内容にしています。 HTML5の基概念や思想・実際の組み方というよりも、 HTML5で組むと今までと比べて何が違うのか などについて書いていきます。 なぜこれからHTML5なのか HTML4との違いがわからない HTML5を使う利点がわからない など疑問に思っている方はぜひ見ていた

    HTML5とは何かを簡単にまとめてみた
  • フォーム関連要素(1) HTML5で既存のinputタイプに加わった6つの変更点

    HTML5はフォーム関連要素もパワーアップ! HTML5へのバージョンアップに当たり、<form>要素や<input>要素に代表される「入力フォーム」についても、非常に多くの変更が行われました。 もともとアプリケーションプラットフォームを志向していなかったこともあり、HTMLにおける入力フォームは非常に貧弱で、ユーザーにとっても使いやすいものではありませんでした。それを補うため、JavaScriptを用いてリッチな入力フォームを実現するのが一般的でしたが、JavaScriptを用いる方法には「セマンティックが不明確になる」「JavaScriptが動作しない環境では利用できない」といった弱点もありました。 そこで、HTML5ではさまざまな点から入力フォームを見直し、さまざまな機能強化が図られました。具体的には、以下のような点が挙げられます。

    フォーム関連要素(1) HTML5で既存のinputタイプに加わった6つの変更点
    willnet
    willnet 2011/02/18
    checkboxタイプのinterminateプロパティの使いどころがよくわからない/色々便利そうだけどIE対応してないと結局js使っちゃいそうだな
  • https://jp.techcrunch.com/2011/02/18/20110217game-closure-makes-it-a-breeze-to-build-multiplayer-cross-platform-games/

    https://jp.techcrunch.com/2011/02/18/20110217game-closure-makes-it-a-breeze-to-build-multiplayer-cross-platform-games/
    willnet
    willnet 2011/02/18
    jsとhtml5でゲームを作れる環境
  • Google、ChromeブラウザでのH.264サポート終了へ

    “オープンなWeb”を目指すGoogleが、Google ChromeでのHTML5のビデオコーデックH.264のサポートを終了する。 米Googleは1月11日(現地時間)、Webブラウザ「Google Chrome」でサポートするHTML5のビデオコーデックからH.264を排除すると発表した。同社が昨年5月に発表したオープンソースのビデオプラットフォームWebMの普及を促進する狙いとみられる。 H.264はMPEG-LAコンソーシアムが所有権を持つライセンス料が必要なビデオコーデックで、主要ブラウザではGoogle Chromeのほか、米MicrosoftのInternet Explorer(IE)と米AppleのSafariがサポートしている。Googleは“よりオープンなWebを目指し”H.264に対抗するオープンソースのビデオコーデックを策定するプロジェクトWebMをMozill

    Google、ChromeブラウザでのH.264サポート終了へ
  • Ruby製クレヨンでお絵描きしようよ! - hp12c

    ブログを下記に移転しました。デザイン変更により移転先では記事が一層読みやすくなっていますので、よろしければ移動をお願い致します。 Ruby製クレヨンでお絵描きしようよ! : melborne.github.com - 米国にCrayolaというクレヨンの老舗メーカーがあります*1 創業以来その色数を増やしていって 現在ではその標準カラーは133色もあるそうです さらに12以上のスペシャルセットがあって それらを合わせると色数は300を超えます ウィキペディアにCrayola社クレヨンのページがあって そこにほぼ全色のカラーコードが掲載されていることを 情報サイト*2を通して知りました List of Crayola crayon colors - Wikipedia ファンタスティック! Color Loverとしてはこれを無視できません そんなわけで.. Rubyの勉強を兼ねましてこれら

    Ruby製クレヨンでお絵描きしようよ! - hp12c
    willnet
    willnet 2011/02/09
    これhtml5なんだ。html5おもろいな
  • #247 Offline Apps Part 1 - RailsCasts

    Learn how to make a site usable offline through an HTML 5 cache manifest. This first part of the series covers rack-offline and problems you may run into.

    willnet
    willnet 2011/01/06
    HTML5のキャッシュマニフェストを使ってコンテンツをキャッシュする話/結構覚えること多そうなのでAsciicasts待ち
  • HTML 5におけるアプリケーションキャッシングのためのキャッシュマニフェスト - builder by ZDNet Japan

    キャッシュマニフェストの記述方法 キャッシュマニフェストには、ブラウザにキャッシュしておきたいリソースを記載する。キャッシュマニフェストはUTF-8形式のテキストファイルで記述し、改行文字はLFまたはCR、あるいはその両方が使用できる。また、MIMEタイプはtext/cache-manifestとして送信されなければならない。 リスト1にキャッシュマニフェストの記述例を示す。 リスト1 キャッシュマニフェストの記述例 CACHE MANIFEST # version 1.0 # キャッシュマニフェストの記述例 index.html content.html images/icon.png NETWORK: server.cgi CACHE: style/style.css manifest属性の値としてこのキャッシュマニフェストが指定されたドキュメントにアクセスした場合、index.htm

    HTML 5におけるアプリケーションキャッシングのためのキャッシュマニフェスト - builder by ZDNet Japan
    willnet
    willnet 2011/01/05
    マニフェストファイルはキャッシュだけを目的としているのかな
  • HTML5で、オフラインでも使えるiPod/iPhone超簡単アプリっぽいものを作ってみた - Publickey

    HTML5にはオフラインアプリケーション機能があり、オフラインに対応したWebサイトを作ることができます。Webブラウザでいちど表示させれば、あとはネットワークとの接続が切れてもそのままエラーを起こさずに利用し続けられるWebサイトです。 iPod TouchやiPhoneに搭載されているWebブラウザの「Safari」はHTML5のオフラインアプリケーション機能に対応しているそうなので、HTML5を使っていつでも参照できる超簡単なアプリを作れるのではないか、そう思ってお正月休みに試してみることにしました。 単に路線図を表示するだけのアプリ iPod Touchを僕は利用しているのですが、いつでも参照できる地下鉄の路線図があるといいなと思っていました。iPod TouchはWifi機能しかないため、外出中はずっとオフラインでの利用なのです。 そこで、起動すると路線図の画像を表示するだけの超

    HTML5で、オフラインでも使えるiPod/iPhone超簡単アプリっぽいものを作ってみた - Publickey
    willnet
    willnet 2011/01/05
    html5のマニフェストファイルを使ってiphoneでキャッシュする例
  • history.pushState、history.replaceState - 素人がプログラミングを勉強していたブログ

    HTML5のhistory.pushState、history.replaceStateを試した。 HTML5 pushState/replaceState demoで動かせる。 Minefieldだと完全に意図した通りに動くがWebKitだとURLまわりがうまくいかない。 メインのソースコードは下記の通り。 canvasで適当に壁紙用画像を作るデモで、画像自体をクリックして何度も作り直せるようにした。 こういう物を作るときは、前の画像に戻れるよう履歴管理をすべきだが、今まではlocation.hashを使ったり(hashchangeイベントが入るまではタイマーが必要だった)iframeを使ったハックだったり(ブラウザ間の互換性やhistory.go(-2)をきちんと動かすのが難しい)、あるいはページを遷移する(必要ない部分まで毎回読み込まれる)必要があった。 pushState/repl

    history.pushState、history.replaceState - 素人がプログラミングを勉強していたブログ
  • NEWT=HTML5+CSS3+SVG+XHR2+Web Sockets+etc...

    「プロフェッショナルとして、私たちは用語を正しく使う必要がある。だから私はHTML5を、さまざまなWebテクノロジーをひとまとめに示す用語として使うのは嫌いなのだ」とブログに書くのは、We標準の分野でよく知られるブルース・ローソン氏。 ローソン氏は、HTML5が仕様を指す言葉でとしてではなく、CSS3やSVGなどのさまざまな新しいWebテクノロジー全体を指す言葉として使われることに不満を表明し、そうした幅広い意味で使うための新しい言葉を提案指しています。 新しいバズワードが必要だ! NEWT! 彼が提案する新しい言葉。それが「NEWT」です。 So we need a buzzword, as “HTML5 and related technologies” is unwieldy (and inaccurate). I prefer “NEWT” which stands for New

    NEWT=HTML5+CSS3+SVG+XHR2+Web Sockets+etc...
    willnet
    willnet 2010/11/30
    新しいバズワードが必要なのは同意だけどNEWTはわかりづらい・・・/そもそもなんて読んだらいいの
  • 【レポート】HTML5新機能、Microdataとは | エンタープライズ | マイコミジャーナル

    Ext JS is now Sencha HTML5の策定とともに進められている機能に「Microdata」がある。2009年末ごろにHTML5体から分離し、今はHTML5関連技術として5 Microdata - HTML 5にそのドラフトが公開されている。MicrodataはHTMLコンテンツに特定のメタデータを追加するためのもの。類似の技術にはMicroformatsやRDFaなどがある。 Microdataは名前と値をひとつの組みとする。Microdataでは名前と値の組みをアイテムと読んでいる。5 Microdata - HTML 5に掲載されているサンプルによれば、次のように記述する。 <div itemscope> <p>My name is <span itemprop="name">Elizabeth</span>.</p> </div> itemscope属性でアイテム

    willnet
    willnet 2010/11/13
    これまでのMicroformatsやRDFaと比べての優位性みたいなものはあるんだろうか
  • はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知

    はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28

    はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
    willnet
    willnet 2010/10/21
    HTML5のhistory.replaceStateやhistory.pushStateは画面遷移しないでアドレスバーのURLを同一ドメインの別のURLに書き換える(location.pathname部分を)仕様があって
  • WebSocketで目指せ“リアルタイムWeb”!第1回 node.jsの衝撃とWebSocketが拓く未来 - @IT

    ご挨拶 こんにちは、ロンドンのNew Bambooという会社でWebエンジニアとして働いている@makoto_inoueです。ここのところ、PusherというWebSocketのクラウドサービスの開発に関わっています。今回から3回に渡ってWebSocketに関する短期連載を担当させていただきます。 私を含めたNew Bambooの面々(我々は自分たちのことをBambinoと呼んでいます)がWebSocketになぜ興味を持ったかということからはじまり、実際にクラウドサービスを始めるまでにいたったストーリーをお話ししたいと思います。そのストーリーを通じて、WebSocketが切り開く「リアルタイムWeb」な世界への可能性や技術的課題を皆さんと共有できればと思っています。

    WebSocketで目指せ“リアルタイムWeb”!第1回 node.jsの衝撃とWebSocketが拓く未来 - @IT
    willnet
    willnet 2010/10/06
    websocketがすごいのは分かったけどnode.jsの良さはまだよく分からない
  • https://jp.techcrunch.com/2010/09/03/20100902html5-browser-wars/

    https://jp.techcrunch.com/2010/09/03/20100902html5-browser-wars/
    willnet
    willnet 2010/09/03
    かんべんして
  • caption 要素 - テーブルデータ - HTML要素 - HTML5 タグリファレンス - HTML5.JP

    willnet
    willnet 2010/08/17
    table要素の解説用のタグ
  • hgroup 要素 - セクション - HTML要素 - HTML5 タグリファレンス - HTML5.JP

    4.4.7 hgroup 要素 カテゴリー: フロー・コンテンツ ヘッディング・コンテンツ パルパブル・コンテンツ この要素を使うことができるコンテキスト: フロー・コンテンツが期待される場所 コンテンツ・モデル: 一つ以上の h1, h2, h3, h4, h5, h6 要素 コンテンツ属性: グローバル属性 DOM インタフェース: HTMLElement を使う hgroup 要素は、セクションの見出しを表します。この要素は、小見出し、副題、キャッチフレーズなど、見出しが複数のレベルを持つとき、h1–h6 要素のセットをグループ化するために使います。 hgroup 要素の中にヘッディング・コンテンツの要素が他にあれば、それは小見出しや副題を表すことになります。 hgroup 要素のランクは、その hgroup 要素の子孫に h1–h6 要素があれば、その中で最もランクが高い h1–h

    willnet
    willnet 2010/08/17
    hgroup 要素は、セクションの見出しを表します。この要素は、小見出し、副題、キャッチフレーズなど、見出しが複数のレベルを持つとき、h1–h6 要素のセットをグループ化するために使います。
  • HTML5についてのおさらい|Web制作 W3G

    Updated 2010.07.29 / Published 2010.07.29 これからHTML5を使いはじめようという方に向けたHTML5のおさらいです。HTML5の記述方法にはじまり、導入にあたって間違いやすいところや勘違いしがちなところをまとめてあります。 hgroup, header, footer要素の説明を含めた続きもあります(続HTML5についてのおさらい)。 HTML5の記述方法 まず最初に、必ずDOCTYPE宣言を行います。HTML5には公式のDTDがないので、すごくシンプルになっています。 <!DOCTYPE html> 続いて、html要素にドキュメントの言語を宣言します。 <html lang="ja"> そして順番にhead要素ときて、文字エンコーディングの指定ですが、charset属性が新たに利用できるようになりました。 <meta charset="UTF

    HTML5についてのおさらい|Web制作 W3G
  • HTML5Rocks - A resource for open web HTML5 developers

    We want to help you build beautiful, accessible, fast, and secure websites that work cross-browser, and for all of your users. This site is our home for content to help you on that journey, written by members of the Chrome team, and external experts.

    HTML5Rocks - A resource for open web HTML5 developers
    willnet
    willnet 2010/06/28
    あとでちゃんと勉強したい