Next Mobile WebApplicationこのスライドは 2013-11-30 に開催された HTML5 Conference 2013 で 地下鉄・サクサク・これからのWebゲームアプリが備えるべき8つの機能 としてお話したものです
wri.peで学ぶ、イマドキのWebアプリの作りかた（前編）
エキスパートが手がけたプロダクトを題材に技術的な解説を行っていくシリーズ連載、今回は wri.peです。 難しい機能の実装や、先進的なAPIの利用を通じて、執筆者が得たノウハウを余すところなく紹介していきます。 HTML5を活用したメモ帳アプリ [wri.pe] 最近、仕事で作っているミイルが忙しかったり、趣味で作っているMobiRubyがなかなか進まなかったりして、個人でWebサービス的なモノを作っていない事が自分としてちょっと気になっていました。 そこで息抜きとして、ゴールデンウイークに集中してWebサービスを一つ作ろう！と思い立ち、wri.peというWebサービスの開発に着手しました。 wri.peは自分が使いたいと思えるメモ帳を作ったので、下記の様な特徴を持っています。 Markdownフォーマットをサポート Gmailの様なアーカイブ機能 全文検索 カレンダーへのマッピング iP
意外と要注意 HTML5データ属性とjQuery Data APIの関係まとめ | ゆっくりと…
前の記事「HTML5でモダンブラウザのCSS3バグを回避するためのハック方法」に関連して、jQuery で HTML5 データ属性にユーザーエジェント文字列を格納する方法を調べていました。その結果、ちょっと整理をしておいた方が良いかなと思う点を共有したいと思います。 ご存知の方も多いと思いますが、jQuery には .data() や jQuery.data() という、DOM 要素に データ を紐付けて記憶しておく仕組みが元々ありました。jQuery 1.4.3 からは、 API レベルでの 親和性 が考慮された形で HTML5 data-* 属性を取り込む仕様が導入されました。 HTML5 時代では、クライアント・サイドで実行されるコード量も増え、データ属性を扱う機会もちょくちょく出てくるのではないでしょうか。そこで今回は、 HTML5 data-* 属性のおさらい jQuery Da
HTML5に本腰を入れ始めた任天堂―GDCで見えてきたゲームビジネスのゆくえ
HTML5向けのゲームエンジンとして国内で知名度を上げて来たenchant.jsのブース出展としては今回が2回目。 残念ながらセッションを取材する時間は取れなかったが、その分、ブースに集まって来たさまざまな情報から、次世代ゲームのあるべき具体像が明確化してきた。 1. かつて億単位のライセンス料が必要だったハイエンドゲームエンジンが原則無料で使用可能に 今回、PS4の発表に合わせてUnreal Engine 4（以下、UE4）やCryengineなどハイエンドゲーム向けのゲームエンジンのバージョンアップが多数発表された。 UE4はPS3、Xbox360世代でデファクトスタンダードの地位を確立したUnreal Engine3の正統的なバージョンアップで、新世代のハードウェアに対応した機能が多数搭載された。 CryengineはCrytechのゲームエンジンで、こちらもハイエンドゲーム向けだが
Facebookアプリを、HTML5でどうしてサクサクにできたのか。Sencha Touch開発チームが用いた3つのテクニック
Sencha Touchの開発チームがHTML5で高速に動作するFacebookアプリを開発したことを紹介した1つ前の記事 「Facebookのモバイルアプリが失敗した理由はHTML5のせいじゃない。HTML5でサクサク動くFacebookアプリを作って見せたSencha Touch開発チーム」は、非常に多くの読者に注目されました。 この記事で紹介したSencha Touch開発チームのブログ「The Making of Fastbook: An HTML5 Love Story」の後半では、どのようなテクニックを用いて高速なHTML5アプリケーションを実現したのかも紹介されています。 この記事では、その3つのテクニックについてポイントを紹介したいと思います。タイムラインやニュースフィードのようなユーザーインターフェイスを備えたモバイルアプリケーションは、これから広く開発されていくことにな
ウェブブラウザの時代は終わるのか 〜スマホアプリとHTML5の未来〜
Developers Summit 2013【15-B-6】開発者の "資産形成" につながる Action とは?インフラジスティックス・ジャパン株式会社
IE10で動くHTML5アプリ実装例 「Indexed Database APIを使用したフィード取得アプリ」
はじめに Internet Explorer 10（以下、IE10）ではIndexed Database API（以下、IndexedDB）が初めて実装されました。IndexedDBは現在W3CのWorking Draft（英語）として公開されています。 IndexedDBとはブラウザ内で動作するNoSQLデータベースで、JavaScriptのオブジェクトをそのまま保存、または読みだすことができます。IndexedDBの最大の特徴は、保存されたJavaScriptのプロパティ値に対するインデックスを持つことができ、オブジェクトの高速な検索が可能となっています。また、オフラインの状態でもデータの読み書きを行うことができ、ブラウザを終了してもデータは消去されないことから、デスクトップアプリと比べても遜色が無いようなオフラインWebアプリケーションを作成することも可能です。 今回の記事では、RS
ネットワーク図を美麗にビジュアル化できるJSライブラリ「sigma.js」:phpspot開発日誌
sigma.js | a lightweight JavaScript graph drawing library ネットワーク図を美麗にビジュアル化できるJSライブラリ「sigma.js」。 HTML5 canvasベースのスタンドアロンライブラリだそうです。マウスでドラッグしたりマウス位置に応じてインタラクティブに変化させることができます。 次のようにグラフィックが美麗であるので、個人的にはグラフィック作成用途に使っちゃってもいい気がしました。 関連エントリ 複数要素の関連をビジュアライズできるライブラリ「arbor.js」 HTML5のキャンバスと連動させて音声をビジュアライズしたデモ 組織図っぽい図を簡単に作れるjQueryプラグイン「jQuery Org Chart」
WebKit2 と愉快な仲間たち - steps to phantasien
ある ニュース記事を同僚に教わった。 この記事によるとタッチデバイスの会社は WebKit2 に対応しているのに検索の会社は旧バージョンにとどまっており、HTML5 に課題は多いのだそうな。 そりゃ課題は常に山積みだよね…と思っていたら記事は誤解だと別の同僚が説明を書いている。 リンク先の記事はさておき、世間の関心をいまいち集められていない気がする WebKit2 についてざっと説明をしてみたいとおもう。 この記事を読み終われば WebKit2 と Chromium WebKit, Webkit1 の違いを知ったかぶれるようになる予定。 WebKit2 は 2010 年の 4 月にアナウンスされた WebKit の新しい API レイヤで、Mac 版 Safari などが使っている。 大きな特徴はレンダリングエンジンを別プロセスで動かせること。 Chromium でやっているのと同じような
HTML5入門－form新要素 range－｜mayy
HTML5ではformに新機能がたくさん追加されています。 今日はその中からマウスで可変可能なバーを表示する、rangeを試してみます。 range対応ブラウザ いつものサイトで確認します。 FindMeByIP|HTML5 & CSS3 Support “HTML5 Forms Inputs”という箇所を確認してみます。 対応されているブラウザは、Chrome、Opera、Safariです。 今回もChromeで確認していきます。 バーを表示してみる まず表示させてみましょう。 inputのtypeをrangeとします。 これだけでも表示はされますが、バーの最小値と最大値も追加しておきます。 最小値はmin、最大値はmaxです。 <form> <input type="range" min="0" max="100"> </form> サンプルを見る 表示されましたか？
Ring
Ringとは、リクルートグループ会社従業員を対象にした新規事業提案制度です。 『ゼクシィ』『R25』『スタディサプリ』など数多くの事業を生み出してきた新規事業制度は、 1982年に「RING」としてスタートし、1990年「New RING」と改定、そして2018年「Ring」にリニューアルしました。 リクルートグループの従業員は誰でも自由に参加することができ、 テーマはリクルートの既存領域に限らず、ありとあらゆる領域が対象です。 リクルートにとって、Ringとは「新しい価値の創造」というグループ経営理念を体現する場であり、 従業員が自分の意思で新規事業を提案・実現できる機会です。 Ringフロー その後の事業開発手法 Ringを通過した案件は、事業化を検討する権利を得て、事業開発を行います。 さまざまな事業開発の手法がありますが、例えば既存領域での事業開発の場合は、 担当事業会社内で予算や
CSS 3のセレクタ解説：:root、:not、:empty、:target - builder by ZDNet Japan
:rootはルート要素にスタイルシートを適用するためのセレクタだ。ルート要素とは最上位階層に位置する要素のことで、HTML文書では全体をマークアップしているがルート要素となる。 テキスト 本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。本文です。 ※ と に注目 これに対して、:rootで次のようにスタイルシートを指定すると、コンテンツ全体が黄色い罫線で囲んで表示される。さらにここでは、でマークアップしたbody要素を黄緑色の罫線で囲むように指定しており、body要素はルート要素の内側に表示されることがわかる。
JavaScript最新動向 〜WebSocket編〜
Dev fest 2020 taiwan how to debug microservices on kubernetes as a pros (ht...
第19回HTML5とか勉強会発表資料 (Kanasansoft Web Lab.)
5つのツールを紹介し、weinreを一押ししていますが、他のツールが劣っていると言っているのではないのでお間違えなく...。 (口頭では説明したのですが、スライドには書いていないので念のため...。) リモートデバッグの前準備を理解してしまえば、使い方はFirebugやブラウザの開発ツールとほぼ一緒なので、是非試してみてください。 Operaのリモートデバッグ環境のDragonflyもありますし、Webkitでもリモートデバッグができるようになるらしいですが、ブラウザ側がXMLHttpRequestに対応していれば、同じ環境で作業ができるのがweinreの利点ではないでしょうか。 (ブラウザのネイティブなリモートデバッグが、共通のAPIを持つのが理想かもしれませんね。)
HTML5+CSS3 入門
Webを記述する言語の標準の現状 昨年度であれば、HTMLを記述する授業では自信をもって以下の基準を推薦していました。 HTML (文書の構造を記述する言語) – XHTML 1.0 もしくは XHTML 1.1 CSS (文書の体裁・デザインを指定する言語) – CSS 2 しかしながら、ここ数年で、とくに去年あたりから状況は大きく変動しつつあります。現状の変化を理解するには、ここに至るまでの歴史的な経緯について簡単に理解する必要があります。ここまでの経緯を整理した上で、将来の展望を探りたいと思います。その上で、この授業ではどのような基準にのっとって「正しい」ということを定義するのか決めていきたいと考えます。 HTML (Webサイトの記述言語) の標準化巡る闘争の歴史 AppleInsider: なぜ Apple は HTML 5 に賭けているのか： ウェブの歴史 [Page 2] よ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
いまさら聞けないCSSレイアウト入門
Mercury Editor: The Rails HTML5 WYSIWYG Editor
HTML5 VideoタグとFLVの埋め込み覚書 | tuglog!
東京のWeb制作会社 株式会社クーシー
html5j.org