ふろしき.js

Web + Mobile + UX + Performance Tech

NTTからピクシブ株式会社に転職しました - 大企業からベンチャーへ移ったエンジニアの話

ピクシブ株式会社に入社しました!…といっても、入社したのは2015年8月1日と約1年前です。「転職エントリーは、転職した直後に書くよりも1年後の方がいいのでは?転職の興奮が覚め、会社のこともある程度わかってから書いたほうが、身になる話ができるんじゃ…

負け組なモバイルWebは、これから本当に復活するのか?Googleが考える次のアーキテクチャ

Google I/O 2015でのセッション「The Next Generation Mobile Web(次世代のモバイルWeb)」がそこそこに激アツな気がしたのですが、予想に反し、あまり注目を集めていません。わかります。大衆向けなメディアだと、AndroidやVR/AR、Google Photosのようなわか…

あなたは今も犯している!?モバイルUXの7つの失敗

ここ最近、モバイルWebコミュニティにて、Apptimize社のトップであるLynn Wang氏がポストした「7 Mobile UX Mistakes You’re Probably Making Right Now」が話題になっています。7 Mobile UX Mistakes You're Probably Making Right Nowwww.sitepoint.comそ…

Webのパフォーマンスモデル「RAIL」とは何か?

ここ数年のうちに、人々が利用するメインコンピューターは、デスクトップからモバイルへと移りました。少ないハードウェアリソース、不安定なネットワーク、逼迫するバッテリー消費、シンプルなユーザインタフェース、開発者はこうした制約の中で、Webサイト…

Webページ遷移時間のパフォーマンス「First Paint」を計測する方法

Webサイトのユーザ体験を向上させる上で、Webページの遷移(ナビゲーション)のパフォーマンスを向上させることは重要です。しかし、ナビゲーションを速くなんて言われても、具体的にどこからどこまでが速ければ良いのかと、悩んだことはないでしょうか。ユー…

誰がデブサミに行くべきか?中の人が2年目を終えて

突然「デブサミのステアリングコミッティにならないか?」なんて言われ、2013年の年末、私は四谷三丁目へと向かいました。つい最近のことみたいに思えます。ステアリングコミッティとは何か?一言で言うなら、翔泳社主催のカンファレンス「Developers Summit…

これからのWebパフォーマンス改善の考え方

Webの技術は、様々な用途で使われるようになり、ユースケースの多様化が進んでいます。それに追従する形で、技術サイドでも進化することが求められているのですが、残念なことに、インフラ側は入れ替えが急には進まないという問題を抱えています。せっかくの…

布団バサミは世界を変えるのか?WebRTCを使って安価なVR装置を作ったという話

マイクロソフトのHoloLensなんかをみていると、これからはやはりVRとかARみたいな技術がどんどん社会を良く変えていくのだろうと、ワクワクさせられますよね。…とはいえ、こういった技術はネイティブが主流という感じがします。リアルタイム性の高さ、ハード…

さらばPointer Events!まだまだ落ち着かない、入力デバイスのWeb標準事情

人々にとってのコンピュータとはデスクトップのみを指す言葉ではなくなり、モバイルやペンといった様々なデバイスが人々の暮らしに関わるようになりました。こうした事情を鑑みて、Microsoftは「Pointer Events」というWeb標準の策定に力を入れていました。…

ただのエンジニアがメディアや技術雑誌に寄稿するようになって思ったこと - 2014年振り返り

2014年は、雑誌が6件にオンラインメディアが20件以上、セミナーや勉強会、カンファレンスでの登壇が30件弱と、思いのほか多くの機会に恵まれました。また、2件ほどのコミュニティの設立に協力したり、少しばかり大きめのイベントも5件ほど企画と運営に関わっ…

モビリティは今、どのように進化しているのか?

デスクトップPCだけじゃなく、モバイルやタブレット、ウェアラブルデバイスの特徴を活かして、仕事を良くしよう。それが「モビリティ」という考え方です。ただ、実際の所はデスクトップとモバイルを隔てる壁が大きかったりします。シンプルにいえば、モバイ…

モビリティとは何か?企業にモバイルが求められる理由

「企業向けのシステムって、これからはモバイルファーストになるんですよね?」「モバイルファースト?うーん、いや、少し違いますね。『モビリティ』の方を、私としては薦めたいのですけどね。うちは、体験を売りたいんですよ。」「モビリティ!?」そう答…

「2014年4月」はIEの歴史を動かした。そこから何が読み取れるのか?

マイクロソフトが提供しているブラウザ「Internet Explorer」の脆弱性問題がTVで大きく取り上げられ、Webの利用者へ混乱をもたらした事件から、約3ヶ月が経過しました。また、IEの重要な機能追加の発表があったマイクロソフト主催カンファレンス「Build 2014…

Google Chromeの開発者が語るこれからのWebに必要なこと、ちょっとした懸念点とか

ーーーー HTML5はネタが出尽くした。あとは、IE8やAndroid2.X標準ブラウザのような、レガシーブラウザがいなくなればいいだけではないか?私は最近、そんな言葉を耳にすることがあるのです。しかし、ブラウザ開発者たちは未だに、そんなことを微塵も感じさせない…

HTML5ハイブリッドアプリ開発を支えるOSS「Cordova」はどのように課題を克服し、進化するのか?

本記事は「HTML5ハイブリッドアプリ開発を支えるOSS『Cordova』シリーズ」の続編です。前回に引き続き、2014年6月10日に開催された「第1回Apache Cordovaスーパー勉強会」にて、アシアル株式会社の田中正裕氏が行なった講演のダイジェストをお届けします。 …

HTML5ハイブリッドアプリ開発を支えるOSS「Cordova」のこれまでの進化、そして課題とは?

本記事は「HTML5ハイブリッドアプリ開発を支えるOSS『Cordova』シリーズ」の2本目です。前回に引き続き、2014年6月10日に開催された「第1回Apache Cordovaスーパー勉強会」にて、アシアル株式会社の田中正裕氏が行なった講演のダイジェストをお届けします。 …

HTML5ハイブリッドアプリ開発を支えるOSS「Cordova」はなぜアツいのか?PhoneGapとの違いは何か?

ハイブリッドアプリとは何か?なぜ今、Cordovaがアツいのか? iPhoneにAndroid、WindowsPhoneと、モバイルデバイスは混沌としており、「ネイティブアプリ」の開発には高いコストが必要とされます。一方で、ブラウザを活用した「Webアプリ」は、パフォーマン…

企業にモバイルを適用する方法「MEAP」の全貌を掴む(4) - IBM Worklight編

企業にモバイルを適用するにはどうすればよいのか?そのための答えの一つに、MEAPが力を持ち始めています。もちろん、MEAPが解決方法の全てというわけではありません。MEAPはベンダ色が強く出るため、毛嫌いする人も少なくないようです。マイクロソフトやア…

企業にモバイルを適用する方法「MEAP」の全貌を掴む(3) - SAP Mobile Platform編

企業にモバイルを導入するにはどうすればよいか?・・・その答えとして、2012年ごろから注目を集めているのが、「MEAP(Mobile Enterprise Application Platform)」と呼ばれるモバイルファーストな製品群です。本連載は、IBMやSAP、Senchaなど、複数の企業が…

企業にモバイルを適用する方法「MEAP」の全貌を掴む(2) - Sencha Space編

Senchaはこれまで、SPA(Single-page Application : 単一ページアプリケーション)を実装するためのフレームワークやツールを提供し、プラグインに頼らないリッチアプリケーションの開発手段を提供してきました。モバイル向けには「Touch」、ノンプログラマー…

企業にモバイルを適用する方法「MEAP」の全貌を掴む(1) - そもそもMEAPとは?

企業でのモバイル活用は関心の高いテーマです。昨年は、BYODという言葉が持て囃され、こちらもそれなりには関心が持たれました。しかし、実態を見てみるとどうでしょう。InformationWeekが1月17日に公開した「5 Big Business Intelligence Trends For 2014」…

日本のシステムの泥臭さにどこまで付き合ってくれるのか?グレープシティのWijmoを3分で把握する

日本のシステムは、ガラパゴスと言って過言ではないほど強い癖を持っているのは、もはや暗黙知というレベルでしょう。この他国を寄せ付けない固有の文化は、日本のSIがコストメリットの大きい国外のパッケージベンダから身を守れた理由とも言われています。…

HTML5は脱バズワードできるのか?エンタープライズ特化のHTML5カンファレンスを開催する

2013年、HTML5というキーワードは大声で散々語られ、メディア側もそれを極力注目されるように報道してきました。そのことが、多くのエンジニアへありがちなバズワードという認識を刷り込み、不安な印象を植えつけたことも少なく無かったようです。ただこれは…

元W3Cの中の人と、エンタープライズのビジネスチャンスについて語った話

変化を好まないSIですが、HTML5が開発方法に変化することを求めている。昨年、私はメディアやカンファレンスなど様々な場所で、その意義について発信してきましたが、「HTML5を使えば"今まで以上"のことができるのだろう」「それなら、あまり関係ない話なの…

日本人が開発したJavaScriptライブラリ、エンジニア別国内利用率ランキング

「エンジニアはGitHubにソースコードを上げると、転職で有利になる!」なんて言われている時代ですが、本当にそうなのでしょうか?多大な時間を割いて、ソースコードを管理し、マニュアルを作り、特設ページを作り、公開することに意味はあるのでしょうか?

Chrome for Business - 企業向けブラウザとしてのChromeの機能、まとめ

Google Chromeは、どちらかと言えばコンシューマー向けブラウザという印象が強いでしょう。実際にそれを裏付けるデータがあります。「StatCounter GlobalStats」の世界ブラウザシェアの内容を結果を確認すると、以下の結果が得られます。 ※ 青がInternet Exp…

Compat Inspector - ソースコードからIE独自機能を機械的に検出しWeb標準へ置き換えさせる方法

古いWebコンテンツではIE独自の機能を利用しないことには、リッチな機能を盛り込むことが実質的に不可能という状況でした。しかし、IE9以上からはWeb標準への準拠が高く、Microsoft側でも、IE独自機能に依存しないWeb標準へ準拠したコンテンツ作りを推奨して…

ブログでメシが食えるか? ふろしき.jsの2013年

「ブログでメシが食えるか?」なんてタイトルにしていますが、これは同じWeb技術情報を扱う個人ブログ「publickey」さんへのリスペクトです。ブログを始めて約半年、本格的に書き始めて3ヶ月、アクセス数は現在10万PV/月程度です。3ヶ月前の段階では完全に趣…

Windows XPアップグレード時のレガシーWebシステム維持方法まとめ

12年強もの長い期間に渡り利用されたWindows XPも、2014年4月9日をもって延長サポートを終了しEOLです。しかし世間では依然として、騒ぎが落ち着かないようですね。アップグレード問題は、本ブログでもかなり取り扱ってきたネタですが、もう十分に情報が揃っ…

Webアプリのパフォーマンス改善をWeb標準で行う方法、まとめ

「HTML5 Advent Calendar 2013」の24日目の記事です。Webアプリのパフォーマンス改善と言えば、JavaScriptやDOMアクセスなど、既存の技術ベースな改善手法を想像する方も多いでしょう。最近では、こうした改善のあり方を、別の視点からもう少し広げようとい…

無料でIEのマルチバージョンテスト「Modern.IE」開発での利用時の注意点

Microsoftは、6以降の全てのIEの動作をテストできる手段として、「Modern.IE」というサービスを提供しています。タイトルでは無料と言っていますが、実際には一部のサービスのみが無料となっています。本来なら有償のサービスを売り込みたいところなのでしょ…

Firefox向けWebシステム開発でできること・できないこと

Windows 7時代のWebシステム開発は混沌としています。IE8を標準ブラウザとしてサポートしてしまったユーザ企業は、IEがシステムのライフサイクルをカバーできるだけのサポート期間を確保できなくなるため、+αの対策無くして開発を行うことができません。 (※…

Windows 7世代からWebシステム開発指針を変えなくてはいけない理由

Windows 7時代のWebシステム開発は、IEの大幅な設計指針の変更に伴い、開発指針を従来の「バージョン依存型」から「機能/動作検出型」へ変更する必要が生じています。本記事では、その必要性について、IEの過去の歴史やロードマップ、また従来の開発方式を維…

IEのバージョンごとの機能の違い、選定の目安

私はIEの中の人ではないので、IE開発者がどういう考えを持っているかはわかりません。しかし、断言して言えることがあります。最近のIEは各バージョンで明らかに意図したテーマを持ち、リリースされています。各バージョンのテーマを、運用するシステムの目…

HTML5世代のJavaScriptからマウスイベントの扱い方、Pointer Events

この記事は古くなっています。こちらを参照して下さい。これまでマウスイベントの扱いは、以下のような記述方法でした。 var elem = document.getElementById("hoge"); if ( elem.addEventListener ) { // IE9以上/Firefox/Chrome elem.addEventListener("mo…

【企業システムの2020年問題】IE8以下向けのWebシステムのEOLは、2020年より後になってはいけない

バージョン8までのIEは、Microsoftが暗に独自性が高いことを認めているブラウザです。同じHTML/CSS/JSであっても、バージョンごとに異なる仕様として動作することがあります。このため、上位のバージョンのIEで動作させるには「ドキュメントモード」いう機能…

Windows XPのアップグレード時に、IE5向けWebシステムが無いことを前提に移行してはいけない

IEのドキュメントモード機能が存在しなかったIE5〜7で、どのバージョンでも同じ仕様を持つプラットフォームを得るには、IE5の動作を再現させる「Quirksモード」を有効にするしか手段がありませんでした。当時のIEは相互運用性が低く、バージョンごとの動作が…

XHTML1.0の場合、IE6からIE8〜10への移行時に表示が乱れることがある

XHTML1.0のDOCTYPE宣言にはいくつか種類があり、IE7以上では常に最新のレンダリングエンジンである「標準モード」として動作します。しかし、IE6は一部の宣言方法で一番古いレンダリングエンジンである「Quirksモード」として動作してしまいます。 (※参考 : …

IE11リリースによる本当の危機、その後のSIのやるべきこと

私が以前執筆した記事「意外と知られていない、IE11リリースによる本当の危機」がかなり好評でしたので、執筆者としてもう少しだけ言葉を残してみようと思います。 なぜQuirks?と考えたことはあるだろうか Webシステムでは、わざとQuirksを使うというバッド…

IE11を裏ワザ的なやり方でDOCTYPEスイッチを有効化する方法

IE11はDOCTYPEスイッチが機能しません。これは恐らく、ドキュメントモードが非推奨へ変わったからでしょう。 (※参考 : ドキュメント モードの非推奨 - Microsoft )しかしIEはまだ、Quirksモードを内部的に残しています。今までとは異なる手段にはなりますが…

意外と知られていない、IE11リリースによる本当の危機

Internet Explorerはエンタープライズでの利用が想定されるため、Microsoft製品で広く適用されているサポート ライフサイクル ポリシーを確認すると、最低でも10年のサポートが受けられると考えている人も多いでしょう。IE8も9も10も、みんなそうなると信じ…

IEの持つ互換性機能の全て - DOCTYPEスイッチ/X-UA-Compatible/互換表示

IEはかつて、独自の機能実装により安定かつ高度な機能を持ったプラットフォームを実現しました。特に、IE6のポテンシャルの高さは、Web技術発展へ大きく貢献しています。しかし同時に、他のブラウザとは異なる独立した挙動をしたり、バージョンごとに機能面…

イントラネット内で互換表示を有効にする方法(IE8/IE9/IE10/IE11)

IEの8〜11では、イントラネットゾーンで互換表示(IE7との互換動作)を有効にする機能を持ちます。イントラネットとは、企業システムをWebベース(Internet Explorerの利用)で構築した場合に、企業内と企業外のネットワークで別のポリシーを適用するために作ら…

互換表示機能をWindowsレジストリを利用して無効化する方法(IE8/IE9/IE10/IE11)

IEには「互換表示ボタン」や「互換表示一覧(リスト)」を通じて、サイトのドメインごとに互換表示機能の有効/無効を切り替える機能を持っています。企業システムでの用途の場合、この機能をIEの利用者側で制御して欲しくないという要望もあるでしょう。この場…

IE11のX-UA-Compatibleの使い方/動作仕様

IE11では、X-UA-Compatibleという制御パラメータを利用し、過去のWebブラウザの機能をエミュレートさせることができます。本記事では、X-UA-Compatibleの利用方法について解説します。 動作の仕様 設定方法 HTMLドキュメント内にX-UA-Compatibleを追加する A…

IE10のX-UA-Compatibleの使い方/動作仕様

IE10では、X-UA-Compatibleという制御パラメータを利用し、過去のWebブラウザの機能をエミュレートさせることができます。本記事では、X-UA-Compatibleの利用方法について解説します。 動作の仕様 設定方法 HTMLドキュメント内にX-UA-Compatibleを追加する A…

IE9のX-UA-Compatibleの使い方/動作仕様

IE9では、X-UA-Compatibleという制御パラメータを利用し、過去のWebブラウザの機能をエミュレートさせることができます。本記事では、X-UA-Compatibleの利用方法について解説します。 動作の仕様 設定方法 HTMLドキュメント内にX-UA-Compatibleを追加する Ap…

IE8のX-UA-Compatibleの使い方/動作仕様

IE8では、X-UA-Compatibleという制御パラメータを利用し、過去のWebブラウザの機能をエミュレートさせることができます。本記事では、X-UA-Compatibleの利用方法について解説します。 動作の仕様 設定方法 HTMLドキュメント内にX-UA-Compatibleを追加する Ap…

IE11のEmulateIE10(X-UA-Compatible)でDOCTYPEスイッチに不具合がある(→仕様でした)

(※ 本ドキュメントは古い情報です。正確な仕様は、こちらを参照して下さい。)IE10までは、「X-UA-Compatible」に対して、「IE=EmulateIE」で指定された対象バージョンのドキュメントモードでは、DOCTYPEスイッチの条件に従いQuirksモードへの切り替えを行っ…

IE11の互換表示リスト(互換表示一覧)の使い方/動作仕様

IE11には、正常な動作が行えない古いWebコンテンツを利用できるようにするために、「互換表示リスト(互換表示一覧)」という機能が提供されています。本記事では、「互換表示リスト(互換表示一覧)」の動作仕様について説明します。 互換表示設定から追加 リス…