初代編集長ブログ―安田英久

Opera 10.50正式リリース、HTML5+CSS3をサポートし、新エンジンCarakan/Vega/Presto 2.5で劇速に

新たに搭載された各種エンジンで高速化、HTML5やCSS3などのウェブ標準サポートも。
Web担のなかの人
Opera 10.50

Opera Softwareは3月2日、同社の提供するウェブブラウザ「Opera」の最新バージョンとなる「Opera 10.50」を正式リリースした。

今回リリースされたのはWindows版。日本語を含めた42言語をサポートしており、opera.comからダウンロードして無料で利用できる(Mac版は現時点ではベータ版で、Linux版は「提供予定」となっている)。

http://www.opera.com/

前バージョンの10.10ではOpera UniteやWidgetのような新機能が搭載されたが、Opera 10.50では新機能の追加よりも、使いやすさの向上、動作の高速化、Web標準への準拠が中心となっている。

Opera 10.50では、ページを表示する領域を広くとるために、標準ではメニューは省略され、ツールバーの最小限の内容になっている。ぱっと見にはGoogle Chromeのようなウィンドウの見え方だ。

Opera 10.50
メニューなどを省略して表示エリアを広くとったウィンドウデザイン。

ブックマークや履歴、印刷といった各種のメニューはウィンドウ左上のOperaメニューボタンから利用できる(メニューバーの表示を含め、アイコンやタブのサイズや位置の変更など、ユーザーがそれぞれの好みにあわせてカスタマイズ可能)。また、新しいグラフィックスライブラリVegaにより、Windows VistaなどでAero Glassエフェクトが有効になっているとOperaのウィンドウも透過して表示されるようになっている。

Operaメニューボタン
機能はウィンドウ左上のOperaメニューボタンに集中している。

Operaはもともと表示速度が速いブラウザとして有名だが、Opera 10.50でも速度面でのチューニングが成されており、各種処理エンジンも新しくなっている。同社によると、Opera 10.50で搭載されたJavaScript エンジン「Carakan(チャラカン)」、グラフィクスライブラリ「Vega」、レンダリングエンジン「Presto 2.5」によって、1つ前のバージョンOpera 10.10よりもページの表示速度を大幅に向上しており、ほとんどのベンチマークテストで最速の結果を見せているとのこと。

HTML5 Audio
HTML5のcanvas+JavaScriptでの3D処理の例。10.10に比べると8倍くらい速くなっているので、3D表示が重くなっても表示速度は低下しない。
http://deanm.github.com/pre3d/monster.html

おもしろい機能としては、「プライベートタブ」の機能がある。履歴などが残らないプライベートブラウジングは多くのブラウザでウィンドウ単位で実装されているが、Opera 10.50ではタブ単位でプライベートブラウジングを利用できる。ログイン状態と非ログイン状態で動作が変わるWebサイトの開発などでは重宝しそうだ(今までどおりプライベートウィンドウも利用可能)。

プライベートタブ
プライベートブラウジングをタブ単位で行える。

Webサイト制作者が気になる開発者向けツール「Opera Dragonfly」も健在だ。Firefoxの人気アドオンFirebugと同様のツールで、表示しているページのHTMLやCSSを確認したりその場で修正したり、ネットワーク処理の状況を確認したり、JavaScriptのコードを確認したりデバッグしたりできる。

Opera Dragonfly
Opera Dragonflyはウィンドウ左上のOperaメニューボタンから[ページ]>[開発者用ツール]>[Opera Dragonfly]を選ぶか、ページを右クリックして[要素を調べる]で表示できる。
Dragonflyのユーティリティ
Utilitiesタブを選ぶと、ページ内の特定部分を拡大して見たり、色を選んだりできる(この部分はまだ日本語化されていないようだ)。ほかにも、保存されているクッキーの情報を参照する「Storage」なども用意されている。

また、新しいウェブ標準であるるHTML5とCSS3をサポートしていることも特徴。HTML5 のビデオやオーディオ、CSS3のボックスシャドー、トランスフォームなど、多くのウェブ標準技術をサポートしている。

CSS3
CSS3の角丸などを利用した例。背景のテクスチャは画像だが、あとはrounded corner、text-shadow、box-shadow、webfont、CSS transitionなどで実現されている。
http://people.opera.com/danield/css3/freebeer/

HTML5のビデオ/オーディオのサポートにより、これまでFlashで再生していた動画などをHTML 5で再生できるようになっている。これで、Flashがインストールされていなくても動画を再生できることになる。特にモバイルではFlashがあるとCPUリソース消費が増えるし、脆弱性も増える(Operaはモバイル向けブラウザとしても普及している)。また、処理がブラウザだけで行われるほうがセキュリティ面での問題も起きにくいだろう。

HTML5 video
Flashを使わずに動画を再生している例。字幕もHTMLで指定してるので、アクセシビリティや検索エンジン対策にも有効。
http://people.opera.com/brucel/demo/video/multilingual-synergy.html
HTML5 Audio
HTML 5のcanvasやaudioを利用するビジュアル&オーディオの例
http://www.nihilogic.dk/labs/juicydrop/
この記事が役に立ったらシェア!
メルマガの登録はこちら Web担当者に役立つ情報をサクッとゲット!

人気記事トップ10(過去7日間)

今日の用語

フジツボ式SEO
主にローカルSEO(地域限定ビジネス向けのSEO)において、顧客にとって印象的だ ...→用語集へ

連載/特集コーナーから探す

インフォメーション

RSSフィード


Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]