タグ

HTML5に関するAkinekoのブックマーク (275)

  • HTML5で作られたドローツール「deviantART Muro」が高機能で使える*二十歳街道まっしぐら(FC2ブログ時代)

    「deviantART Muro」はHTML5で作られたドローツールです。 かなり色んな描き方が可能で、フィルタやレイヤーも備わっています。 ブラシ機能はアカウント取得後、購入が可能です。 動作もスムーズでかなり使えるんじゃないでしょうか。 以下に使ってみた様子を載せておきます。 まず「deviantART Muro」にアクセスしましょう。 アクセスすると、真っ白なキャンバスがありますので、自由にお絵かきできます。 線の種類は最下部のメニューより選べます。 最上部には、フィルターがあったり。 PROモードにすると、右側にレイヤーが表示されます。 ブラシ機能は購入して利用できるようですね。 描いた絵は画像として保存することができます。 deviantARTこんなの作ってたんですねー。 FlashじゃなくHTML5で作られた画像ツールはいろんなところで登場していますね。 (記事で紹介したサイ

  • HTML5 Canvasのブラウザによって異なる微妙な振る舞いについてまとめてみた。 - 風と宇宙とプログラム

    はじめに CanvasはHTML5とは切り離された独立した仕様(HTML Canvas 2D Context)になっているようですが、現状のブラウザ上でのCanvasのについて、普段はあまり気にしない微妙な振る舞いについて調べた結果をまとめてみました。 調べたブラウザの各バージョンは以下の通りです。 Firefox Chrome Safari Opera 3.6.8 6.0.490.1 dev 5.0.1 10.61 線を描く (lineTo) ただの直線を描くだけのlineToですが、その単純なものにも、恐らく、多くの人が普段は気にしないような問題があります。それは座標値とアンチエリアスです。詳しく見る前に、実際の結果を示しましょう。下記のイメージ中に描かれている線は、いずれも線幅(lineWidth)が1の線です。 (左から、Firefox, Chrome, Safari, Opera

    HTML5 Canvasのブラウザによって異なる微妙な振る舞いについてまとめてみた。 - 風と宇宙とプログラム
  • 踊るHTML5、あるいはセカイ系化する世界 - アンカテ

    私が、Web+DB PRESS誌で連載している「圏外からのWeb未来観測」の第二回が、gihyo.jpで公開されました。 第二回のゲストは、「Webを支える技術」の著者である、山陽平さんです。 圏外からのWeb未来観測:第2回 REST侍は国益に殉ずる覚悟を持っていた|gihyo.jp … 技術評論社 今回も面白い話をたくさん聞くことができたんですが、特に重要だと思うのが次の所です。 山:特に今は,標準の決定プロセスがオープンになっています。昔は大企業の代表のような限られた人しか参加できない委員会で標準化が行われていましたが,現在は誰でも標準化に参加できて,当に実力のある人が意見を言ってそのとおりになるっていう世界になっていると思います。W3Cもあまり機能しなくなってきているし。そのへんはこの10年でかなり変わったところだと思います。 オープンなところで標準が決まっていく流れだと,普

    踊るHTML5、あるいはセカイ系化する世界 - アンカテ
  • プロフェッショナル用のHTML5+CSS3+jQueryのテンプレート -HTML5 Boilerplate

    プロフェッショナル向きに開発された、HTML5+CSS3+jQueryなど直接実装に関わるファイルから、robots.txt, .htaccessなどサーバー関連のファイルも一式にまとまったテンプレートを紹介します。 HTML5 Boilerplate 昨日、当サイトで紹介した「HTML5 Reset」もHTML5+CSS3をベースに開発されたテンプレートセットですが、こちらはよりプロフェッショナル向けに開発されたものとなっています。 下記にその特徴を。 HTML5 Boilerplateの主な特長 クロスブラウザ対応(IE6も) HTML5対応 キャッシュの最適化と圧縮でGrade-Aのパフォーマンス モバイルブラウザへの最適化 クロスブラウザ対応のためにIEでは特定のclassを用意 プリント用のスタイルシート、パフォーマンスの最適化 HTML5でより早いページロードにする「.htac

  • HTML5で動作するノベルゲームのエンジンを作ってみた - 平凡なエンジニアの独り言 はてなブログ出張所

    ゲームを作成して共有するサイト - RmakeのゲームエンジンはFlashで作られているのですが、将来的なことを考えてHTML5 + JavaScriptで動作するエンジンを作ってみることにしました。スマートフォンやスレートPC(タブレット)などで動作することを踏まえて、まずはパフォーマンスをそれほど要求しないノベルゲームを移植してみました。 現在は一つしかありませんが、HTML5で動作するテストゲームは以下に配置してあります。 RmakeのHTML5テストサイト サンプルゲームは以下です。 ゲーム「Rmake基スクリプト講座(1)」 - HTML5 テスト - Rmake 現在の状況 一部の機能しか実装していない WindowsChrome/Safari/Firefoxで動作確認済み*1 十分にチューニングしていないので動作が重い iPadでの動作状況 動作はするが、とにかく重い マ

    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なの?

    HTML5にはCanvasタグやVideo/Audioタグ、ドラッグ&ドロップ、Microdata、Web Workersなどさまざまな機能があると説明されますが、実際にはこれらは「HTML5とその関連仕様」を含んでいます。 仕様書に従った厳密な「HTML5」とは、どこまでの範囲を指すのでしょうか? モジラジャパンの浅井智也氏が「Keypoints HTML5」という資料を公開して分かりやすく紹介してくれています。 仕様書に沿った「HTML5」の範囲とは HTML5は、W3CとWHATWGが共同で仕様策定をしていますが、両者の仕様書に書かれている範囲は異なっています(非常に細かい部分では一部の仕様に違いもあります)。Keyoints HTML5から、その両方の仕様でHTML5の範囲を示した図を紹介します。 図の右側のW3C仕様ではCanvas、Microdata、Web Messaging

    どこまでがHTML5なの?
  • http://jp.droidget.com/mobile-5/html5

  • インターン講義5日目「ユーザインターフェース,HTML5」 - Hatena Developer Blog

    インターン生は、連日の講義と課題で大変そうですが、今日も講義が続きます。 日は、id:nanto_viによる「ユーザインターフェース,HTML5」です。仕様書を隅々まで読んだ講師によるディープな講義内容となっています。今日も2時間の長丁場ですが、頑張って着いていきましょう! ユーザーインターフェース、HTML5 ユーザーインターフェースで大切なこと、HTML5 及び関連 API で何ができるか 自己紹介 nanto_vi (外山真, TOYAMA Nao) ブックマークチーム アプリケーションエンジニア はてなブックマーク Firefox 拡張 はてなツールバー for Firefox はてなブックマーク Twitter 投稿機能 はてなサマーインターン 2008 なんとなく Emacs 富山県南砺市とはあまり関係なし 概略 UI の評価・設計・実装の概略 HTML についての概略、HT

    インターン講義5日目「ユーザインターフェース,HTML5」 - Hatena Developer Blog
  • ブラウザで見たままテキスト編集ができる組み込み型HTML5エディタ「AlohaEditor」 【@maskin】 | TechWave(テックウェーブ)

    [購読時間:5分] from metamix.com ウェブコンテンツの編集といえば、HTMLによる記述が基。それしかなかった時代は「ウェブコンテンツ作り」には敷居が高い印象があった。しかし、2000年代後半に普及したブログの記事編集ツールのように、ウェブの画面で編集加工を行えるサービスの普及で、誰でもテキストコンテンツの作成が可能になったのは周知の事実。 今回紹介する「Aloha Editor」は、ウェブ上のテキストをワープロソフトのように見たまま文字装飾などをほどこすことができるHTML5ベースの技術で動作するソフトウェア。JavaScriptのファイル群で構成されており、無償でダウンロードが可能。自分のウェブサイトなどに組み込むことで、快適にテキスト編集ができるようになる。 最大の特徴は、冒頭の画面のように、見ているページのコンテンツをそのまま編集することができるところ。文字を太く

    ブラウザで見たままテキスト編集ができる組み込み型HTML5エディタ「AlohaEditor」 【@maskin】 | TechWave(テックウェーブ)
  • 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ってすごいわ! この8bitアニメーションを見てちょうだい!(動画あり)
  • Beautiful Collection Of HTML5 Websites

    Beautiful Collection Of HTML5 Websites by Vikas on August 3rd, 2010     4 Comments » Share Html 5 is the new technology and web standard in web design. HTML 5 has tons of new features, elements and techniques which will be helpful for designers to create new design in short line code. Coding in HTML 5 is very easy compared to other programming language options available for designers. You can als

  • Shibuya.js beyond HTML5 の発表資料 (Kanasansoft Web Lab.)

    Shibuya.js beyond HTML5 で飛び入りで話してきた。以前にLTをやった関係で、スピーカー募集の通知があり、開催日前後が忙しくなりそうだったこと等々、諸事情により参加できない可能性があったため、発表はほとんど諦めていた。ところが、飛び入り発表もOKとの事だったので、当日はできるだけ早く会場入りし、2時間で資料を作って発表してきた。諸事情により一部のスライドを削除している。

  • HTML5を今すぐ使うためのコツや情報をまとめてみました - EC studio デザインブログ

    この数カ月でHTML5のサイトが国内にも増えてきました。先日10周年を迎えた EC studio のサイトもHTML5で制作しています。マークアップの面でのHTML5の導入となりましたが、難しいと思う以上に勉強になることが多くありました。(今も改善を続けています。) http://www.ecstudio.jp/ 個人サイト以外でHTML5を導入するのをためらっている人が多いと思うので、今からでも使っていくためのコツやノウハウをまとめてみました。 新要素をJavaScriptで生成する HTML5の新要素はIEでは未知の要素です。そのため記述していてもDOMツリーが構成されなかったり、CSSが適用されないという問題が生じます。 そこでdocument.createElement(要素名);により、ブラウザ(ユーザーエージェント)にとって未知な存在の要素を生成し、認識させることができます。

  • 【HTML5】新規でサイトを作るのに使えそうなの一式。Ver 1

    HTML5版の新規でサイトを作るのに使えそうな一式です。 今までの新規で使えそうな一式のVer3からも有る程度流用はしていますが、結構いじってます。 今までみたいに、社内のマークアップエンジニアとかそういう人がもう居ない環境なので、何処かで使われていた訳ではありませんが、まー最初の準備って地味に面倒なのでちゃちゃっと始めるには良いんじゃないでしょうか。 【HTML5】新規でサイトを作るのに使えそうな一式。Ver 1をDL(zip:12kb) HTML5版のVer 1を見る 社内のマークアップエンジニアとかって書いたら、これどうなのよ?とか話してた頃がちょっと懐かしくなった。 コーダー飲みとか、CSS Niteなんかで、マークアップエンジニアやコーダーさんと会う機会は結構有るのに、そういう具体的な?話まではしないからなぁ・・・ それはさておき、中身のご説明などを続きにて。 中身のご説明 zi

    【HTML5】新規でサイトを作るのに使えそうなの一式。Ver 1
    Akineko
    Akineko 2010/06/11