HTML5を用いたサイト開発が、どんどん現実的になっています。マイクロソフトからはIE9が日本でもリリースされ、全ブラウザでHTML5 readyの時代がついにやってきました。 また、5月25日（UTC⁠）⁠、ついにHTML5がLast Call（最終草案）を迎えました。今回のLast Callは、HTML5 仕様、すなわち主にマークアップ部分のところを指しており、他の関連仕様（WebStorageやWebSocketなど）は含まれていませんが、大きな一歩であることは間違いありません。 HTML5を用いたサイト開発手法についても、同様のことが言えます。最近では、HTML5対応のオーサリングツールが各社よりリリースされています。これまでは、主にコアな開発者がテキストエディタを用い、開発を行ってきました。しかし、そのままでは裾野は拡がりません。UI開発を支援し、コーディングヒントなどを示してく

UNIXの基本的なコマンドの1つであるdiff。 これに実装されているアルゴリズムは実に興味深い世界が広がっています。 本稿では、筆者が開発した独自ライブラリ「dtl」をもとに「diffのしくみ」を解説します。 はじめに diffは2つのファイルやディレクトリの差分を取るのに使用するプログラムです。 ソフトウェア開発を行っている方であれば、SubversionやGitなどのバージョン管理システムを通して利用していることが多いかと思います。本稿ではそのdiffの動作原理について解説します。 差分の計算の際に重要な3つの要素 差分を計算するというのは次の3つを計算することに帰結します。 編集距離 2つの要素列の違いを数値化したもの LCS（Longest Common Subsequence） 2つの要素列の最長共通部分列 SES（Shortest Edit Script） ある要素列を別の要

2010年11月2日、ヤフー株式会社・株式会社技術評論社主催によるイベント「ブラウザカンファレンス2010」が開催された。本イベントは、来たるべくHTML5時代に向けて、主要ブラウザべんだ4社と主催のYahoo! JAPAN、そして、Web開発者というそれぞれの立場の人間が一堂に会し、現状の考察とこれからのアプローチについて熱く語るというもの。 会場には200目い近くの参加者、そしてUstream.tv経由でたくさんの視聴者を集め、非常にホットな時間となった。 インターネットの可能性を信じて、みんなとコミュニケーションを図っていきたい――Yahoo!JAPANの取り組み オープニングキーノートとして、主催社でもあるYahoo! JAPANより、R&D統括本部制作本部制作部長 是井真氏が登場した。 「HTML5時代におけるYahoo! JAPANの考え方」と題して、オープニングキーノートを務

Jason Zimdars氏による記事の翻訳です。Jason氏は37signalsにてデザイナを務めており、この元記事は37signalsの公式ブログ「Signal vs. Noise」にて投稿されたものです。 WebのデザインやWebアプリの開発を始めるには何を学ぶべきかについて、質問する人やそれらに関する書籍を挙げる人はたくさんいますが、Jason氏曰く始めるのに何かを学ぶ必要はなく、ただ「始めること」が最も重要であるとのことです。Webデザインを始めるのに必ずしもHTMLやCSSを学ぶ必要はなく、PowerPointなどを使ってモックアップを作ることができますし、パソコンの操作に詳しくなくても紙と鉛筆を使ってアイデアを描くことができます。作り上げるのに何のスキルが必要かを知らないのは当然のことなので、心配せずにすでに知っていることを使って始め、行けるところまで行けばよい、と述べていま

江島健太郎氏によるブログ記事です。昨今におけるNoSQLの人気急上昇ぶりと、対するRDBMSの評価が下がっていることについて冷静に考察しています。 OracleやMySQLなどRDBMSはすでに成熟した段階にある一方、柔軟性やスケール性において弱点を抱えています。その点、NoSQLはRDBMSが抱えている問題を解消しているだけでなく永続性もある程度サポートしていることから持てはやされ、「⁠SQLデータベースは死んだ」という極論まで出るようになってしまいました。そしてMongoDBのように「書き込み時にはディスクに同期しない」という、永続性においてはある意味致命的な問題をトレードオフとして認識せず、ただ賞賛する界隈に対して、皮肉の意味を込めた動画やサービスが作られ話題となりました。 江島氏は「NoSQLはSQLを極めてこそ真価を発揮する」と主張しています。そして原点に立ちかえり、そもそもWe

10月13日、第11回となる「HTML5とか勉強会」を、Opera Softwareのオフィスをお借りして開催しました。Opera Softwareのオフィスはフランクでフレンドリーなため、毎回アットホームな雰囲気の中、勉強会を進行することができます。そんな雰囲気の中、今回も内容の濃いさまざまな講演をいただきました。その模様をUstreamでのアーカイブ含め報告します。 今回は、前回に引き続きスマートフォンにフォーカスをあてました。前回はSench TouchやjQTouchなどのスマートフォンでの開発プラットフォームを特集しましたが、今回はAndroid2.x対応デバイスが各キャリアからリリースされることも相まってさらに盛り上がりを見せているスマートフォンブラウザについてOpera SoftwareとMozilla Japanに講演していただきました。さらに、スマートフォン関連で3本のL

Zed 氏はRails向けWebサーバ「mongrel」を開発したり、「⁠Rails Is A Ghetto」というRailsやRubyコミュニティを批判した記事を書いたことで有名です。 この記事では、Zed氏の考えるプログラミング言語の入門向けテキストはどうあるべきかについて語っています。事ことの発端はフリーで公開しているPythonのチュートリアル『Dive Into Python』をZed氏が「何年も更新されていない」「⁠例題がひどい」など痛烈に批判したことからです。『⁠Dive Into Python』の著者であるMarkPilgrim氏とコメントを交わしたりしたあと、入門者にとって最適な教材の要素として以下を挙げています。 演習が豊富にあること 1～2ページごとに演習があること 無駄な文章が少ないこと 演習を解いてどんどん進められること これらの要素は、ギターをプレイするZed氏

8月17日、HTML5開発者コミュニティhtml5-developers-jp主催の「第9回　HTML5とか勉強会」が開催されました。本稿では、本勉強会の録画とともにレポートします。 今回は普段とは趣向を変え、前半には本勉強会スタッフが開発したHTML5によるデモアプリの紹介を、後半はLT大会ということで5名のスピーカーの方々にお話いただきました。 なお、本勉強会では初の、8月初旬に移転したばかりのGoogleの東京オフィス（六本木ヒルズ）をお借りさせていただきました[1]⁠。 1週間日めくりお絵かき日記 最初に、スタッフの一條さんより、canvas API, localStorage, CSS3を活用した絵日記デモが紹介されました。 デモでは、canvasを用いフリーハンドで描いた絵日記をlocalStorageに保存し、日めくりで確認できることが示されました。canvasの装飾をCSS

はじめに 初めまして。NTTアドバンステクノロジの金城と申します。幸運にも記事を執筆させていただけることになりました。WebSocketという新しいウェブの規格についての連載を、全4回の予定でお届けします。 用語統一について WebSocketは「WebSocket」「⁠WebSockets⁠」⁠、単語を切り離した「Web Socket」等、表記に揺れがあります。2009年12月22日のワーキングドラフトのタイトルは「The Web Sockets API」となっていますが、2010年4月26日のエディターズドラフトでは「The WebSocket API」となっています。この連載では、最新の仕様書に則り、用語を「WebSocket」で統一します。 HTML5とWebSocketの関係 WebSocketは、もともとHTML5の一機能として仕様の策定が進められていました。しかし、Web S

2010年5月19、20日の2日間、2008年から「Google I/O」と呼ばれるようになり恒例行事となりつつあるGoogle主催の技術カンファレンスが、今年もサンフランシスコのモスコーンセンターで行われた。Google I/Oは、当初はWeb技術にフォーカスしたカンファレンスだったが、今ではWeb技術だけでなく、Android、Google Chrome、Google API、GWT、App Engineなど、Googleのさまざまなテクノロジーをカバーするカンファレンスに成長した。 会場となったモスコーンセンターウェストの入り口には巨大なGoogleマップのピンオブジェクトが登場。 今回縁あって（twitterで依頼されて⁠）⁠、このカンファレンスの様子を初日、2日目の基調講演を中心にお伝えすることとなった。いくつかの個別レポートという形で、一エンジニアから見たGoogle I/Oと

週刊Webテク通信 2010年4月第3週号1位は、少しのコードで実装可能な20のCSS小技集、気になるネタは、ドラマ「素直になれなくて」でツイッターが荒れた？ ネットで見かけたWebテク（Webテクニック・Webテクノロジー）記事から、Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は、2010年4月12日～4月18日の間に見つけた記事のベスト5です。 1．少しのコードで実装可能な20のCSS小技集 | Webクリエイターボックスhttp://www.webcreatorbox.com/tech/css-tips20/ 便利なCSSのTips集です。ブックマークしてあったいろいろな小技を、整理もかねて記事にしたとのことで、目新しいものはありませんが実践的なテクニックが揃っています。 IE対策やCSSハックではないTipsをまとめた記事で、特に「かゆいところに手が届く応用

前回、「⁠IA One Sheeters」をご紹介しましたが、もちろんそれらを指してすべてが「IAタスクである」とは言い切れません。ただ少なからずIAというロール（役割）において関係してくるタスクであることは間違いないと思います。 そこで今回は、そのサンプルにもあった「ワイヤーフレーム」についてのツールを紹介します。 そもそも画面のレイアウトおよび原稿の整理という意味では、いろいろなツールが関係してきます。Web制作の現場においてはWebデザイナーやWebディレクターというロールが関わり、タスクベースにするとどのロールがそのタスクを遂行するのかが混乱しがちです。この連載ではWebデザイナーを対象として、ツールの使い方やぶつかる課題にフォーカスをあててみたいと思います。 ワイヤーフレームについて ワイヤー（線形状）でフレーム（枠）にしていくことから名前がついたと思われますが、もともとはCG（

他のライブラリや、自分のコードと共存させるときは、これらの名前と衝突しないように気をつける必要があります。同じ名前を使ってしまうと、コードがロードされた順番によって挙動が変わる、というようなわかりにくい問題が発生してしまう場合が出てきます。 オブジェクト、クラスの使われ方 ライブラリ内では、上記の名前空間は大きく分けて以下のような使われ形をしています。 その下に別のオブジェクトを入れるための親名前空間として使う Class.create()を使って Prototypeライブラリ風のクラスとして定義する Object.extend()を使って他のクラス、オブジェクトから継承されることを前提とする関数を集める コードを簡潔に記述する為に短い名前の関数として使う 特に、Object.extend()を使って継承を実現している箇所が多く、最終的にどのオブジェクト・クラスにどのメソッドが定義されてい

こんにちは、id:os0xこと太田昌吾です。今回から、クロスブラウザ対策を中心としたJavaScriptの初級から中級の方向けの連載を開始します。JavaScriptの基礎的な文法は理解されているという前提での解説となりますので、ご了承ください（間違いやすい、わかり難いと思われるところは適宜補足します⁠）⁠。初回である今回はJavaScriptやウェブブラウザの背景など盛りだくさんの内容でお届けします。 JavaScriptのイマ JavaScriptは2010年現在において、最も重要な言語となりつつあります。旧来はすべての処理をサーバーで行って、結果をウェブブラウザ上に表示するだけというのがウェブの一般的な姿でした。2005年に登場したGoogle Mapsを一つの契機として徐々にウェブブラウザ・クライアント側での処理が見直され始め、近年ではクラウドやSaas、そしてHTML5の流行によ

こんにちは、太田です。今回はGoogle Chrome拡張に使えるHTML5関連技術の3回目をお送りします。 前々回はcanvas、ドラッグ・アンド・ドロップ、前回はECMAScript5やCSS3の一部を取り上げましたが、今回はHTML5関連APIのWeb Storageと、HTML5とは外れますが、Desktop Notificationsを紹介します。Web StorageはHTML5関連の中でもIE8でサポートされているなど、実装が進んでいるAPIの一つです。Desktop Notificationsはウェブページや拡張からユーザーに積極的な通知を出すことができるAPIです。MacではGrowlというアプリケーションが有名ですが、Growlに相当する機能をブラウザベースで実現しています。 Web Storage Web Storageはブラウザ上で動作するキーバリューストアです。J

第6回Twitterタイムラインで見るWicketのオブジェクト指向プログラミング（後編） 矢野勉（やのつとむ） 2009-12-11

こんにちは、太田です。今回はGoogle Chrome拡張に使えるHTML5関連技術の解説をお送りします。 Google ChromeはWebKit（Safari）と連携して、HTML5とその周辺技術の実装を積極的に進めています。一般的なウェブサイトでは、互換性の問題からHTML5などの最新実装を積極的に使用することは困難ですが、Chrome拡張ではそういった問題にとらわれずに最新の技術を試すことができます。今回から数回はそういったHTML5関連の話題を取り上げます。 Chrome拡張で使えるHTML5 HTML5は2010年1月時点で策定途中の段階です。既に一部のブラウザで実装されている仕様であっても、（⁠実装によるフィードバックを受けて）仕様が修正される可能性があります。多くのブラウザで実装されていて実質的に確定している部分もありますが、まだほとんど実装されていない仕様や、実装はされた

あけましておめでとうございます。株式会社ミツエーリンクスの渡邊卓です。昨年の年初、弊社木達による「2009年のWeb標準」をお読みになった方は、執筆者の変更に「おや？」と思われるかもしれません。今年は縁あって私が執筆を担当させていただくことになりました。 2010年も、昨年と同様にWebコンテンツのフロントエンド実装に関連した標準とその周辺の動向について、短期的な予測を書かせていただきます。引き続きよろしくお願いいたします。 さて、2010年のWeb標準については「ECMAScript 5とJavaScriptエンジン」「⁠HTML5と周辺仕様」「⁠CSS 2.1・CSS3 モジュールとWebブラウザアップデート」「⁠JIS X 8341-3改訂とW3C DOM」をキーワードとして取りあげます。 ECMAScript 5とJavaScriptエンジン 去る2009年12月3日、JavaSc

2010年のJavaScriptと題しまして、JavaScript周辺の「これまで」と「これから」についてまとめてみたいと思います。 2009年までのJavaScript JavaScriptは各ブラウザベンダなどが個別に実装するという特殊性から、ブラウザ（実装）ごとの非互換性の問題に悩まされ続けてきた言語です。まず、そのJavaScriptの歴史を簡単に振り返ってみます。 ECMA-262 3rd editionとスピードコンテスト JavaScriptはNetscape社によってLiveScriptという名前で誕生し、その後ECMAScriptとして標準化が進みました。1999年12月にECMA-262 3rd editionが策定されてから、Internet ExplorerのJScript、MozillaのSpiderMonkey（TraceMonkey⁠）⁠、SafariのJav

勉強会を発見した2008年、勉強会が定着した2009年 id:hanazukinさんのIT勉強会カレンダーによって、IT系勉強会の隆盛を発見したのが、2008年だとすると、それがしっかりと定着したのが2009年だと思います。2009年6月には、勉強会勉強会の主催による勉強会カンファレンス2009が開催され多くの勉強会主催者が集まりました。 カーネル読書会 自分にとって思い出深いものは、わたしが主宰しているカーネル読書会に、Linuxの創始者であるLinusさんはじめ世界のカーネルハッカーの皆さんが遊びに来てくれたことです。カーネル読書会を最初に開催したのは、1999年4月でかれこれ10年続いていることになります。月に1回くらいのペースで開催していますので、年間10回くらいの開催でき、2009年10月に第100回記念を向かえることになりました。 ちょうど日本で初めてLinux Kernel