このページの本文へ

前へ 1 2 3 次へ

ウェブのインターフェースを改めて考えるOpera

WebGLやウェブカム対応の最新ブラウザーOpera 12公開

2011年10月12日 17時00分更新

文● ASCII.jp編集部

  • この記事をはてなブックマークに追加
  • 本文印刷

 10月11日(現地時間)、Opera Softwareが開催するプレスイベント「Up North Web」が今年もノルウェーの首都オスロで開催された。創立15周年を記念して、昨年から始まったイベント(関連記事)。

会場となったHolmenkollen Park Hotel Rica

会場となったHolmenkollen Park Hotel Rica。オスロの高台にあり、すぐ近くにスキーのジャンプ台がある

テーマはWeb everywhere

テーマは「Web everywhere」

 今回は「Web everywhere」をテーマに据えている。パソコン向け(Desktop版)のブラウザーはもちろんだが、モバイルや組み込み市場向けの製品、広告配信サービス、HTML 5+CSS3などウェブ標準技術に対する取り組みなども積極的にアピールしている。

 編集部ではキーパーソンへの個別取材する機会を得たので、数回に分けてその内容を紹介する。第1回はプレスイベントで発表された開発中の最新バージョン「Opera 12」の見どころについてみていこう。

ブラウザーも「巻き物」から「本」へと形態が進化

 ウェブブラウザーというと、HTML 1.0とNCSA Mosaicが登場した黎明期(1993年ごろ)から、一貫して縦長のページをスクロールして表示するのが基本的なスタイルとなっている。しかしインターネットに接続するデバイスが多様化する中、ウィンドウの右端に当たり前のように置かれたスクロールバーをマウスでドラッグしていくのが、常に最適なインターフェースなのかは、疑問が残る。

 例えば外出先でのネット接続では、今後スマートフォンやタブレットといったデバイスを活用するのが主流となってくる。こうしたデバイスでは、指で操作するのが一般的なので、画面上の小さなポイントを触って動かす、あるいは長いウェブページの画面を指でなぞって下まで見ていくというのは、なかなか骨の折れる方法だ。

ページネーションで表現したウェブサイト

プレスイベントで紹介された、スクロールではなく、ページネーションで表現したウェブサイト

 こうしたオールドファッションな表現方法に対して、同社CTOのHåkon Wium Lie氏が提案したのが「Page based Presentation」という方法だ。紙の雑誌のようにページごとにレイアウトされた内容を順番に表示していく。横に指でなぞるとページがめくられ、段組みなどを活用した複雑なレイアウトにも対応する。一方でコーディングする際の手間は非常に少なく、トランジション効果などウェブブラウザー側の機能を利用することで、リッチな表現も可能となっている。

実際に書いたコード

左の画面が実際に書いたコードの1例。ウィンドウサイズによってフローティングする3段組のレイアウトを指示している。ウェブブラウザーの機能を利用するので、コードは非常にシンプルだ

 プレゼンテーションでは、マルチカラムのレイアウトを採用した米新聞社のサイトについても言及されたが、これまでこうした表現をするのは手がかかった。

マルチカラムのレイアウトの例

マルチカラムのレイアウトの例

雑誌のようなレイアウトの実現が可能

雑誌のようなレイアウトの実現が可能

 Lie氏は「Rethink the Art, Rethink User Interface」(いままでのやり方を見直し、ユーザーインターフェースを考え直す)と話し、Wikipediaの「Codex」(写本)の項目をページベースに再構成したデモを紹介した。

 こうした新しいウェブコンテンツのあり方もOperaとして積極的に提案し、ウェブブラウザー独自の機能ではなく、標準技術として積極的に提案していく意向だという。HTML 5のベースとなったWebForm 2はOperaが開発したものだが、こうしたプロパーではなくスタンダードを重視する取り組みは15年以上の歴史を持つOperaが積極的に進めてきたアプローチである。

本のようなレイアウト

本のようなレイアウトも可能になる

前へ 1 2 3 次へ

カテゴリートップへ

注目ニュース

ASCII倶楽部

プレミアムPC試用レポート

ピックアップ

ASCII.jp RSS2.0 配信中

ASCII.jpメール デジタルMac/iPodマガジン