タグ

html5に関するmochyのブックマーク (28)

  • 「HTML 4.01」と「XHTML 1.0」と「HTML5」の違いまとめ フラップイズム

    ※2014年2月26日に更新しました。要素及び属性をなるべく新しい仕様書に準拠、その他頂いたコメントへの対応を行いました。 ※2014年3月3日更新しました。タグと要素の違いについて追記。文内でタグと要素の記述が間違っていた部分を修正。「要素が要素をまたがってはいけない」というのはどの形式でも同じなので、記述を削除。 どうも、くーへいです。 今日はある方からリクエストされた記事を書こうかと思います。 皆さんは、コーディングをするときに「HTML 4.01」、「XHTML 1.0」、「HTML5」のどれを使っていますか? 実際には案件ごとに使い分けているかもしれませんね。 この投稿では、それぞれの違いについて、考えていきたいと思います。 ※要素とタグを混同する方も多いですが、要素とタグでは意味が全く異なります。 例えば、「<html>・・・</html>」は要素ですが、「<html>」や「

    「HTML 4.01」と「XHTML 1.0」と「HTML5」の違いまとめ フラップイズム
    mochy
    mochy 2014/02/21
  • 「スーパーマリオブラザーズ」をHTML5で完全に再現したサイト「Full Screen Mario」 | 気になる、記になる…

    「スーパーマリオブラザーズ」をHTML5で完全に再現したサイト「Full Screen Mario」 2013 10/16 TNWによると、ファミコンで人気の「スーパーマリオブラザーズ」をHTML5で完全に再現したサイト「Full Screen Mario」が公開されたそうです。 著作権的に問題ありですが、実際にキーボード操作でプレイする事が可能で、”1−1”だけかと思いきや”8-4”までの全ての面がプレイ可能となっています。 また、マップジェネレーターも用意されており、自分でマップを作る事も可能で、操作面ではBダッシュはShiftキーを押しながら動かすと可能で、ジャンプは十字キーの上かスペースキーとなっています。 ・Full Screen Mario 【追記】 Google Chromeのみのサポートとなるようです。

    「スーパーマリオブラザーズ」をHTML5で完全に再現したサイト「Full Screen Mario」 | 気になる、記になる…
  • TechCrunch | Startup and Technology News

    When Alex Ewing was a kid growing up in Purcell, Oklahoma, he knew how close he was to home based on which billboards he could see out the car window.…

    TechCrunch | Startup and Technology News
  • HTML5開発者必見、最速のJavaScriptライブラリはどれだ!? パフォーマンスの徹底検証 | ICS MEDIA

    HTML5で2次元のインタラクティブコンテンツを制作するには、さまざまなJavaScriptライブラリがあります。どれを選択するべきか迷いどころではないでしょうか? そこで今回はHTML5の各種JavaScriptライブラリについて、パフォーマンスを比較検証してみました。 今回検証したフレームワーク メジャーなJavaScirptライブラリとして次の5種類でテストしました。バージョンは2013年4月10日現在の最新版を使っています。詳しい検証方法は記事の後半にまとめています。 CreateJS (EaselJS 0.6.0) Arctic.js (v0.1.11) enchant.js (v0.6.3-48) Pixi.js (v1.0.0) Processing.js (v1.4.1) 各種JavaScirptライブラリのベンチマーク結果 ※グラフの数値が高いほどパフォーマンスが高いこと

    HTML5開発者必見、最速のJavaScriptライブラリはどれだ!? パフォーマンスの徹底検証 | ICS MEDIA
  • Developers.IO

    【8/1リモート】 クラスメソッドのフリーランスエンジニア会社説明会〜AWSインフラ/Webアプリ 案件特集 〜開催します

    Developers.IO
  • 【HTML5 フォーム】formタグのinput要素に新たに追加された13のtype属性をまとめました! | HTML5でサイトをつくろう

    HTML5 フォーム】formタグのinput要素に新たに追加された13のtype属性をまとめました! ウェブ・ページのフォームではテキスト入力フィールドやチェックボックスなどのユーザーインターフェースを使用しますが、HTML5ではユーザーインターフェースがさらに追加されたことで注目されています。 特にinput要素ではさまざまなtype属性が追加されました。今回は新たに追加されたtype属性をソースをみながら表示を確認していきたいと思います。 HTML5でinput要素に追加されたtype属性 下記に各属性ごとの特徴をピックアップし、現状で対応しているブラウザの画面キャプチャを掲載しました。だだし、現状(※2011年9月)の対応状況になります。 search 『type=”search”』の主な特徴 1行テキストの入力フィールドで表示され検索向けであることを表します。 input要素の

    【HTML5 フォーム】formタグのinput要素に新たに追加された13のtype属性をまとめました! | HTML5でサイトをつくろう
  • ふつうのユーザが知らないHTML5コーディングツール10選 - YAMAGUCHI::weblog

    はじめに こんにちは、Python界の情弱です。今日はChrome+HTML5 Conferenceのお手伝いに来てます。いままで全く触れてこなかった世界ですが、結構HTML5はXMLのようにセマンティクスに重点を置いてるんですね。CSS3も動的なエフェクトを簡単にかけられるようになってるし、とてもいいですね。 さて、YouTube Live Streamのお手伝いしながらRSS見てたら、ちょうど今日のテーマに沿ったエントリがdiggで紹介されてたので、翻訳しました。 10 Excellent HTML5 coding Tools Many Users Don’t Know About 10 Excellent HTML5 coding Tools Many Users Don’t Know About (オリジナル) HTML5はウェブサイトの作成方法を根から変えることになるでしょう。

    ふつうのユーザが知らないHTML5コーディングツール10選 - YAMAGUCHI::weblog
    mochy
    mochy 2011/08/21
  • 今、知っておきたいJavaScript

    Webブラウザとテキストエディタさえあれば、プログラミングして実行できるシンプルで手軽な言語――。それがJavaScriptが初めて登場してからしばらくの間、多くの人が抱いた印象でした。しかし、Ajaxの登場に伴う第2のブーム以降、ハードルが高くなったように感じられます。 その大きな理由の一つが、DOM(Document Object Model)に基づくJavaScriptプログラミングでしょう。DOMは、HTMLやXMLを構成する各要素に対して、プログラムからアクセスして内部の情報を取得・変更したり、機能を利用したりするためのAPI(Application Programming Interface)です。DOMを使うことによって、WebページをリロードせずにWebページを部分的に書き換えたり、HTMLドキュメントの構造を動的に変えたりといったことが可能になります。 DOMは便利な仕組

    今、知っておきたいJavaScript
  • HTML5のcanvasタグで描くグラフ描画ライブラリ「AwesomeChartJS」:phpspot開発日誌

    AwesomeChartJS HTML5のcanvasタグで描くグラフ描画ライブラリ「AwesomeChartJS」 データは配列で定義してdrawするだけです。描画コードは次のように美しい。 var mychart = new AwesomeChart('canvas1'); mychart.title = "Product Sales - 2010"; mychart.data = [1532, 3251, 3460, 1180, 6543]; mychart.labels = ["Desktops", "Laptops", "Netbooks", "Tablets", "Smartphones"]; mychart.draw(); IEではフォールバックされていないため動作しませんがiPhoneなどのcanvasタグ対応ブラウザをターゲットとするなら便利に使えそう 関連エントリ Ja

    mochy
    mochy 2011/02/04
  • Chrome、HTML5、Android、クラウドの最前線が見えた―Google Developer Day 2010 Tokyo開催 | gihyo.jp

    ChromeHTML5、Android、クラウドの最前線が見えた―Google Developer Day 2010 Tokyo開催 2010年9月28日、東京国際フォーラム(東京、有楽町)にて、東京で4回目となる「Google Developer Day 2010 Tokyo」が開催された。 今回で4回目となる東京開催 Google Developer Day(GDD)は、Googleが主催する世界各地で開催される開発者のためのカンファレンス。Google技術だけではなく、Web/インターネットに関連する標準的な技術、新しいトレンドについて包括的に取り上げている。 満席となった基調講演 オープニング基調講演に登場したのはGoogle当協会初センターエンジニアリングディレクター Joseph Ternasky氏。Joseph氏は、今回のGDD基調講演について ChromeHTML

    Chrome、HTML5、Android、クラウドの最前線が見えた―Google Developer Day 2010 Tokyo開催 | gihyo.jp
  • ニコニコ動画、HTML5に対応へ 9月末予定

    ニワンゴは、「ニコニコ動画」で9月末からHTML5による動画再生に対応させる予定だ。Flashが表示できないiPad用Safariでも動画の再生とコメント入力が可能になる。 8月26日開いた「ニコニコ大会議 2010 夏」で明らかにした。HTML5対応のほか、「ニコニコ生放送」のリニューアルも発表。トップページに、ニコ動アカウントなしでも生放送を視聴できるプレイヤーを設置するほか、番組へのタグ付けに対応し、タグによる番組検索が可能になる。また、ユーザーが動画を宣伝できる「ニコニ広告」がニコ生にも対応。ニコニコポイントを使い、放送中の生放送番組を宣伝できる。 ニコ動は10月28日にバージョンアップする予定。次期バージョンの名称や内容は、同日開く「ニコニコ大会議 2010 秋」で披露する。 関連記事 H.264のライセンス料、無料ネット動画は恒久的に不要に YouTube動画のような「エンドユ

    ニコニコ動画、HTML5に対応へ 9月末予定
  • 今更聞けないcanvasの基礎の基礎 - KAYAC engineers' blog

    はじめまして。新入りのnagataです。 入社式で自転車乗ってた野郎です。 先輩方から「ブログ、書いてね!」とのお達しがあったので、 日報で書いたらウケがよさげだったcanvasのことについて書いてみようと思います。 ※各種サンプルはMac上のSafari4.05、Firefox3.6.3、Chrome5.0で動作を確認しています。 canvasってなんぞ? 図を書き込めるhtml要素です。 OpenGLやDirectXのような面倒な設定を書くことなく、 手軽にグラフィック描画が行えます。 ブラウザだけでローカルアプリケーションのような グラフィカル(かつ動的な)表現が行えるわけです。 とりあえずつかってみる 早速何か描いてみましょう。 こういうことは実践あるのみです。 処理にはJavascriptを使います。 canvasに描画を行うときは、canvas要素からcontextを取得して、

    今更聞けないcanvasの基礎の基礎 - KAYAC engineers' blog
  • dfltweb1.onamae.com – このドメインはお名前.comで取得されています。

    このドメインは お名前.com から取得されました。 お名前.com は GMOインターネットグループ(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日のドメイン登録業者(レジストラ)(「ICANNがレジストラとして認定した企業」一覧(InterNIC提供)内に「Japan」の記載があるもの)を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2023年5月時点の調査。

  • HTML5に関わらないと日本企業は世界から遅れる (1/2) - @IT

    HTML5が拓く新しいWeb(5. W3C編) HTML5に関わらないと 日企業は世界から遅れる 新野淳一 Publickey 2010/4/6 HTML5について日語で議論する「HTML5 JAIG」メンバーに、そもそもHTML5の仕様はどのように決められているのかを聞いた 日語でHTML5についての議論を行うW3Cのグループ HTML5の仕様は現在、W3C(World Wide Web Consortium)のHTML Working Group(以下、HTML WG)を中心に策定が進められています。HTML WGのHTML5に関する議論は、メーリングリストに入ることで誰でも参加可能ですが、英語でのコミュニケーションであり、また仕様策定に関する内容が中心であることなどから、日人で参加している人はそれほど多くありません。 そこで、日語でHTML5についての議論を行うことを目的に

  • Microdata support for Rich Snippets

    accessibility 10 advanced 195 AMP 13 Android 2 API 7 apps 7 autocomplete 2 beginner 173 CAPTCHA 1 Chrome 2 cms 1 crawling and indexing 158 encryption 3 events 51 feedback and communication 83 forums 5 general tips 90 geotargeting 1 Google Assistant 3 Google I/O 3 Google Images 3 Google News 2 hacked sites 12 hangout 2 hreflang 3 https 5 images 12 intermediate 205 interstitials 1 javascript 8 job s

    Microdata support for Rich Snippets
  • HTML5対Flash、HTML5の圧勝とは限らない? | ライフハッカー・ジャパン

    ビデオ再生の能率は、ハードウェアアクセラレーション能力の高さが、総合的なCPUロードにおいて、最も重要な要素といえます。FlashがハードウェアアクセラレーションにアクセスするWindowsでは、CPU稼働率はわずかなレベルまで落ちました。もしFlashプレイヤーが除去されず、GPUベースのハードウェア・アクセラレーションを持つMac(もしくはiPod/iPhone/iPad)にアクセスできた場合、HTML5とFlashのCPU稼働率の差は、かなり縮まったと思います。 さらにわかったのは、全てのHTML5ブライザ/H.264デコーダーが、等しく作られているわけではないということです。興味深いことに、全ての結果の中で最もCPU稼働率が高かったのは、Flash10.1を稼働させて、GoogleHTML5を実行した場合でした(あくまでもWindowsの話ですが)。Macでは、FirefoxとS

    HTML5対Flash、HTML5の圧勝とは限らない? | ライフハッカー・ジャパン
  • Firefox と HTML5 について発表してきました | Mozilla Japan ブログ

    先週末に開催された OSC 2010 Tokyo/Spring に参加し、Web の標準技術やブラウザがどのように変化してきているのか、「Firefox & HTML5 - Web プラットフォームの今 -」というタイトルでお話しさせていただきました。 当日は他にも多くの講演や展示のある中、100名を越える方に聞いていただき、ありがとうございました。 講演ではまず、HTML5 などの標準技術とブラウザが次世代プラットフォームとして注目されるようになるまでの経緯をお話ししました。そして、ブラウザに最近導入された技術について、次期 Firefox に向けて実装中のものを含めて 10 点ピックアップし、デモやコードを交えて紹介しました。ブラウザによって率先してサポートする技術に違いはあるものの、標準技術を共にサポートすることで Web を新しいプラットフォームとして育てていく今を楽しんでいただけ

    Firefox と HTML5 について発表してきました | Mozilla Japan ブログ
    mochy
    mochy 2010/03/08
  • ニコニコ動画をHTML5で見るbookmarklet - saiten@blog

    性懲りも無くニコニコネタです。 iPadでも結局Flashが搭載されなかったこともあって、最近Flashの代替手段としてHTML5がやけに押されているので、ものは試しでニコニコ動画のFlashプレイヤーをHTML5で構成したプレイヤーに置き換えるbookmarkletを作ってみました。iPhone/iPadのvideoタグの動作がマシになってれば、iPhone/iPad上でも動くかもってな期待込みで。 使い方は、下記のbookmarkletをニコニコ動画の再生ページ(http;//www.nicovideo.jp/watch/*)上で実行するだけです。実行すると標準のFlash製プレイヤーを、HTML5+javascriptで構成したプレイヤーに置き換えます。 javascript:(function(){var e=document.createElement("script");e.s

    ニコニコ動画をHTML5で見るbookmarklet - saiten@blog
    mochy
    mochy 2010/02/26
    これはすごいなー
  • HTML5 & The Web Platform

    実務でよく使うhtml,css,jsの小技をつらつらと紹介します。 ※2/11のスクーの授業中で使った資料です。 https://schoo.jp/class/1776 【オシャレCSS編】 1. transformを使って要素を変形させるワザ 2. transitionを使い、CSSだけで簡単なアニメーションを行うワザ 3. keyframesを使ってCSSだけで複雑なアニメーションを行うワザ 4. 矢印アイコンをcssだけで表現するワザ 5. アイコンをアニメーションさせるワザ 6. CSSプロパティ”filter”で画像を加工するワザ 【地味だけど使えるワザ編】 7. 今どきの、要素を上下中央寄せにするワザ 8.「flexbox」で要素を自由自在に整列させるワザ 9. Windowsでwebfontをちょっとマシに見せるワザ 10. ア

    HTML5 & The Web Platform
  • Google「Gears」終了を公式に説明 - HTML5への移行を推進 | エンタープライズ | マイコミジャーナル

    Googleが「Gears」を終了させる計画を、Gears APIの公式ブログで説明した。 Gearsは、Webアプリケーションをオフラインでも利用可能にするWebブラウザの拡張機能だ。2007年5月に発表され、2008年3月にはモバイル版も登場した。オフライン機能はインターネットへの接続と切断を繰り返すモバイルデバイスで、Googleのサービスの使い勝手を向上させるために欠かせない技術である。だが昨年12月に、GoogleがGearsプロジェクトHTML5へとシフトさせるとLA Timesが報じ、その頃からGearsのアップデートが停滞した状態が続いている。 「Hello HTML5」と題されたGears APIブログへの書き込みで、GearsチームのIan Fette氏は「われわれはGearsのすべての機能を、HTML5のようなWeb標準に移行する作業にシフトしている」と、Gear