2007年4月アーカイブ

Forums - Opera Community のフィードって、RSS2.0 だと投稿に含まれるPRE要素内のHTMLが中途半端に描画されてしまうね。

画像はフレッシュリーダーで Operaから利用できないサイトを教えてください の korosuke0123さんの報告 を表示させたもの。PRE要素内は以下のようになっている。

<div id="content">
<div id="mainArea">
<div id="mainAreaLeft">
<div class="mainAreaLeftText01">
<h2><img src="img/localmenu01.gif" alt="eneloopラインナップ menu" width="210" height="295" /></h2>

<div id="localNavi">
<ul>
<li id="localNavi01"><a href="eneloop01.html">eneloop 充電池 単3形・単4形</a></li>
<li id="localNavi02"><a href="eneloop02.html">eneloop 充電器・充電器セット</a></li>
<li id="localNavi03"><a href="eneloop03.html">eneloop スペーサー</a></li>
<li id="localNavi04"><a href="charger.html">eneloop eneloop solar charger</a></li>
<li id="localNavi05"><a href="kairo.html">eneloop kairo</a></li>
<li id="localNavi06"><a href="../info/info08.html">eneloop対応三洋電機製充電器の情報はこちら</a></li>
</ul>
</div>
<!--//globalNavi-->

</div>
<!--//localNavi01-->
</div>
<!--//mainAreaLeft-->

Atom1.0 なら次のようにまともに表示される。

Bloglines や livedoor Reader、Opera Mail でも同じような結果になったが、僕は難しいことはよくわからないので、Opera Forum のフィードは Atom1.0 で購読しようと思った。

The Rendering Engine for the Wii という Tim の記事の中に、

New to the rendering engine used on the Wii is support for more CSS 3 selectors, partial text-shadow support (colors aren't correct),...

The Rendering Engine for the Wii | Stranger, yet...

とあったので、具体的に何が対応したのかを調べてみた。

Opera CSSセレクタチェック

ついでに、Opera 7.54，8.54，9.00，9.10，9.20 も調べて一覧表にした。

1. CSS3.info の CSS Selectors testsuite を利用した。
2. 対象は、Opera 7.54u2（build3929），8.54（build7730），9.00（build8501），9.10（build8679），9.20（build8771），Wii（Opera 9.10 build1621）
   1. Opera 6 は CSS3.info に行った途端クラッシュするので対象から外した。
   2. Mobile Opera は持ってない。
   3. DS Opera は無くした。
   4. ちなみに、Opera videoは 9.20 と同じ結果だった。
3. 微妙に結果が異なることがあったのでそれぞれ4～5回チェックを行い、前後の対応から見てそれっぽいのを採用した。
4. 結果は CSS3.info のそれに準じた。
   1. ただし、順番は W3C Working Draft - Selectors と同じように並び替えた。
   2. OK だの n out of n failed だのから詳細ページへのリンクを張った。
   3. E:active，E:hover，E:focus，E::selection はテストできないので、自分で作ったテストページでチェックした。
      1. これらの結果については斜体の小文字になっており、当然 CSS3.info へのリンクも張っていない。
      2. Wii の E::selection についてはチェックのしようがなかったが、とりあえず no としておいた。

チェック結果について

Opera 9.20 のチェック結果において、Opera 9 の CSS サポートでは"Yes"であるはずの E[foo="bar"]，E[foo^="bar"]，E[foo$="bar"]，E:first-child，E:empty，E:lang(fr) が、failed となっている。詳細は、

failed BE[foo="bar"]

<div align="hogebar">

<div align="bar hoge">

<div align=" bar ">

failed AE[foo^="bar"]

<div foo="hogebar">

<div foo="hoge bar">

<div foo="hoge-bar">

<div foo=" bar ">

failed AE[foo$="bar"]

<div foo="barhoge">

<div foo="bar hoge">

<div foo="bar-hoge">

<div foo=" bar ">

failed BE:first-child

<div> <div id="insertBefore"></div> </div>

var ib = document.getElementById('insertBefore'); ib.parentElement.insertBefore(document.createElement("div"), ib);

failed AE:empty

<div></div>

<div><!-- Just a comment --></div>

failed BE:lang(fr)

<div align="enUS">

とあり、failed Aが未対応、failed Bがバグとのこと。Opera，CSS3.info 双方のチェックの妥当性については僕の知るところではないが、とりあえずそういうことらしい。

Wii Opera

さて、Tim の言うNew to the rendering engine used on the Wii is support for more CSS 3 selectorsとは何か。

Opera の公式文書を全てとする場合

即ち、failed AE[foo^="bar"]，failed AE[foo$="bar"] 及びfailed Bを対応と見なす場合は以下の5つ。

E:root，E:target，E:not(s)，E:nth-child(n)，E:nth-of-type(n)

CSS3.info の結果を全てとする場合

即ち、failed Aが未対応、failed Bがバグと見なす場合は以下の5つ。

E[foo^="bar"]，E[foo$="bar"]，E:root，E:target，E:not(s)

共通するのは E:root，E:target，E:not(s) の3つか。ややこしい。

単純に、CSS3.info のチェックを全てと考え、Wii Opera で修正・追加されたセレクタ（CSS1～3）を見た方がわかりやすいかもしれない。

1. E[foo="bar"]
2. E[foo^="bar"]
3. E[foo$="bar"]
4. E:root
5. E:first-child
6. E:target
7. E:lang(fr)
8. E:not(s)

合計8つということで、The rendering engine used by the Internet Channel is the most advanced rendering engine publicly available from Opera Software.という一文にも頷ける。この分だと、今後のデスクトップ版にも期待できそうだ。

参考リンク

• Opera for Wiiリリース - ノヴム・オペラヌム - by Satoru Watanabe
• Opera 9 でサポートされるウェブ仕様 - CSS
• CSS3 . info - Everything you need to know about CSS3
• W3C Working Draft - Selectors
• CSS セレクタに関するおさらい | WWW WATCH
• CSS セレクタに関するおさらい 2 | WWW WATCH
• CSS セレクタに関するおさらい 3 | WWW WATCH

my.opera.com の方であれこれ書いていたら、突然 Opera が次のような画面になった。

入力エリアが #11e757 で満たされて、まあ綺麗。これは何という現象なのかしらん、ひょっとして妖精さん達の悪戯？ お茶目だなぁ、とあちこち触ろうとしたら、マウスオーバーでボタンやブックマーク達がどんどんパステルカラーに変わっていく。そして、しばらくしたら真っ白になって Opera が死んだ。これは、昨晩から今朝にかけて行った大量の画像処理や動画エンコードにより、パソコンが悲鳴を上げているんだろうか、しかしそんなことって起こりうるんだろうか......等と思いながらも、何日かぶりに再起動を実行した。

しかし再起動後も、Opera を立ち上げてしばらくすると、パステルな世界が再び僕を襲った。同じように、マウスオーバーでツールバーやパネルの色が変わって行き、やがてデスクトップは純白に包まれる。何度か試してほぼ同じタイミングでそうなることと、真っ白な世界は Opera を終了すれば無くなるということから、1つの原因と思しき事象に逢着した。

僕は Twippera というhigeorangeさん作の Widget を使っている。これは Opera から Twitter への更新を簡単かつ便利に行うことのできる Widget で、僕が初めてデスクトップアクセリーという枠を超えて「1つのアプリケーション」と認識し、これは長い間使うことになるだろうと予感した素晴らしい Widget だ。もし、あなたが Twitter を利用していて、ブラウザに Opera を選択しているのなら、是非ともインストールして使ってもらいたい。アイコンクリックで @hoge が補完される点も嬉しい。

原因というのは、この Twippera を拡大して使っていたからであった。しかも、デスクトップ領域の1/4～1/3を占有するほど。

他の Widget でも試してみた結果、どうやら Widget は極端に拡大・縮小すると著しいパフォーマンスの低下を招くことがあるようで、この症状は Twippera に限定したものではないことがわかった。これはユーザーの環境に左右される現象なのかもしれないが、ともかくも、「何事もやり過ぎは禁物」という使い古された言葉は、僕の心に深く突き刺さったのであります。

9.20 から導入された「スピードダイヤル」

のカスタマイズ覚え書き......ではなく、既に詳しいドキュメントがあるので、それらを参考にして己の欲望を満たしてみるテスト。

• Opera The Fastest Browser on Earth: Opera9.20 Weekly Build8746
• bend tail - スピードダイヤルの背景変更方法

Speed Dial Skin セクション

各セクションについて、operawiki.info の該当箇所へそれぞれリンクを張った（セクションからは説明、場所からはスクリーンショット）。つまりは早見表。

セクション内のキーと値については、次のドキュメントが良くまとまっていてわかりやすい。

• bend tail - スキンを作成するときのために

カスタマイズ

skin.ini は次のようになっている。

# This file describes the skin for the Opera browser

[Info]
Name=Speed dial
Author=Madoka Ashizuka
Version=2

[Speed Dial Widget Skin]
Type		= Box
Tile Center	= custom_sd/background.jpg
Border		= 1
Border Color	= #bec2cb
Color		= #ffffff
Text Color	= #000000

[Speed Dial Thumbnail Image Skin]
Border		= 1
Border Color	= #e0e0e0

[Speed Dial Thumbnail Image Skin.hover]
Type		= BoxTile
Tile Center	= custom_sd/center.png
Border		= 1
Border Color	= #a0a0a0

[Speed Dial Thumbnail Widget Skin]

[Speed Dial Thumbnail Widget Skin.selected]

サムネイル部分と外枠部分を透過状態にするため、Speed Dial Widget Skin セクション以外の Color キーは指定せず、Speed Dial Thumbnail Widget Skin，Speed Dial Thumbnail Widget Skin.selected セクションは空にした（なんらかのキーと値を書いておいた方がいいのかもしれない）。また、マウスオーバーで枠線色を変えるだけというのもあれなので、Speed Dial Thumbnail Image Skin.hover セクションに 半透明画像 を敷き詰めるように指定した。

欲望のままにカスタマイズしてみてわかったことは、「ページを登録するのが惜しくなるような背景画像は、スピードダイヤルの機能を半減させる恐れがある」ということだ。恐るべし、石坂ちなみ。

既報の通り、Opera 9.20 正式版が公開された。build は 8771。

• 電話だけの機能ではもったいない！Opera、スピードダイヤルを PC へ提供
• ウェブブラウザ Opera ダウンロード
  • Opera 9.20 for Windows Changelog
  • Opera 9.20 for UNIX Changelog
  • Opera 9.20 for Mac Changelog

チェンジログについて、Weekly 追っかけてる人や Beta1 をインストールした人は、

• Since Opera 9.20 beta 1
  • Opera 9.20 for Windows Changelog
  • Opera 9.20 for UNIX Changelog
  • Opera 9.20 for Mac Changelog

こっちの方が見やすいかもしれない。中の人、忙しくて大変だとは思うけど邦訳がんばれ。以下は、9.10 からの変更点で目玉的な何か。

1. スピードダイヤル
2. Developer Tools
3. アドレスフィールドから検索
4. サーチエンジンの統合

スピードダイヤル

電話の「短縮ダイヤル」に着想を得たという「スピードダイヤル」。

• Opera ヘルプ: スピードダイヤル
• 「短縮ダイアル」ならぬ「スピードダイヤル」チュートリアル - Opera ニュース - by 市川恵貴

機能自体の説明としては TERRAZI さんの記事がわかりやすいと思う。

• TERRAZINE - Opera9.20の「スピードダイヤル」って何？

このように、よく行くサイトやページを登録してもいいし、

「あとで読む」タグを付ける代わりに気になったページを登録してもいいし、

お気に入りギャラリーを作ってもいい。

Yahoo!検索が気に入らない

設定 » ネットサーチ で好みのサーチエンジンを選択して編集をクリックし、「スピードダイヤルのサーチエンジンとして使用する」にチェックを入れる。

スピードダイヤルに検索エンジンを表示させたくない

チェックを外す。

スピードダイヤル自体を非表示にしたい

スピードダイヤル画面右下の「スピードダイヤルを非表示にする」をクリック。

つうか無効にしたい

opera:config#UserPrefs|SpeedDialState を 3 にして保存。ちなみに、画面右下に「スピードダイヤルを...」が表示される上の状態は 0 で、1 が表示（デフォルト）、2 が並び替えや追加等の編集不可。

Developer Tools

上のメニュから ツール » 詳細ツール » 開発者用ツール を選択すると、次のページにジャンプする。

• Tools - Opera Developer Community

Developer Console、DOM Console、CSS Editor、DOM Snapshot と4つのカスタムボタンが用意されているので、ツールバー上にドラッグ&ドロップ。それぞれについては歩行者さんの記事が詳しいので丸投げ。

• Opera が純正の開発者ツールをリリース - WebOS Goodies
• Opera 最新ビルドの Developer Console を試す - WebOS Goodies

アドレスフィールドから検索

アドレスフィールドに、例えば「opera カスタマイズ」複数の単語を入力してエンターを押すと、

今までならこのような画面が表示されていたが、9.20 からは、

と、標準サーチエンジンでの検索が可能になった（F2で表示されるページの移動ダイアログからでもOK）。標準サーチエンジンの設定は、設定 » ネットサーチ » 編集 から。

1つの単語でも検索可能にしたい

「g opera」として検索しないと「サーバー名の自動補完」が働いてしまい、http://www.opera.com/ 等に飛ばされてしまうところ、以下のようにすれば、1つの単語でもアドレスフィールドから検索が可能になる。

1. 設定 » 詳細設定 » ネットワーク » サーバー名の自動補完 で「次の文字列を使用して補完を行う」のチェックを外す。画像
2. opera:config#Network|Enable HostName Web Lookup にチェックを入れて保存。
3. opera:config#Network|HostName Web Lookup Address に好みのサーチエンジンのURLを入力して保存。
   1. URLは search.ini の書式と同じ（設定 » ネットサーチ » 編集 のアドレス）。

なお、「Opera」は何故か検索できない。

http://www.google.com/search?q=%s

サーチエンジンの統合

9.20 からは、デフォルトサーチとユーザーのカスタムサーチが統合される形となった。別の言い方をすれば、「デフォルトのサーチエンジンをベースに、ユーザーが好みのサーチエンジンを追加・削除していく」という方式。基本的に、ユーザーのカスタムサーチ（profile以下の search.ini）がそのまま読み込まれるという点は変わらないが、9.20 にバージョンアップしたらサーチエンジンが意図通りに並んでいなくて戸惑う人も多いと思う。

手っ取り早いのは、今まで使っていた search.ini の File Version を 9 にして、デフォルトのサーチエンジン（インストールディレクトリの search.ini）に上書きしてやるか、デフォルトの search.ini の拡張子を変更するなどして profile以下の search.ini のみを読ませるようにすることだ。しかし、これは上書きインストールをしない人や、インストールのたびに search.ini を書き換える手間を厭わない人の方法。

Hidetoさん情報によると、デフォルトのサーチエンジンを「設定>ネットサーチタブ」で削除すると、削除されたサーチエンジンが profile フォルダの searchi.ini に追記され末尾に「Deleted=1」がつくそうで、試しに Yahoo!検索を消してみると、

[Search Engine 1]
Name=
Verbtext=0
URL=http://yahoo.opera.com/search/?q=%s&fr=opera2
Query=
Key=y
Is post=0
Has endseparator=0
Encoding=utf-8
Search Type=0
Position=-1
Nameid=-1752296930
Deleted=1

という具合に profile以下の search.ini に書き込まれた。そして、インストールディレクトリの search.ini の Yahoo!検索は、

[Search Engine 2]
Name=
URL=http://yahoo.opera.com/search/?q=%s&fr=opera2
Query=
Key=y
Is post=0
Has endseparator=0
Encoding=utf-8
Search Type=0
Verbtext=0
Position=-1
Nameid=-1752296930

と、何も書き換えられていない模様。これを利用して、profile以下に search.ini を作成し、それへデフォルトのサーチエンジン全てを記述してそれぞれ Deleted=1 とすれば、

となり、GUI からは消せないGoogle先生もいなくなってすっきり & あとは追加していくだけな状態。「デフォルトサーチなんて要らない。俺は新しいスタートを切るんだ！」という人は、全てのデフォルトサーチ（翻訳除く）を Deleted=1 にした search.ini を上げておくのでどうぞ（ページ内検索も無効にしてあるので、有効にするには Deleted=0 に）。

1. 9.20（build8771）Classic版 search.ini
2. 9.20（build8771）MSI版 search.ini

また、自分で追加したサーチエンジンも GUI から削除すると Deleted=1 となることから、「使わないやつは search.ini から削除するのではなく、Deleted=1 と指定して非表示にしておく」というスタンスがうかがえる。menu.ini 内の記述をコメントアウトして残しておくのとなんとなく似てるね。

だからというかなんというか、上書きインストール派で今後も search.ini を使い回したいという人は、面倒でも 設定 » ネットサーチ から各々消してやり、デフォルトサーチの所在をちゃんと定義してやった方が後々楽（のような気がする）。

その他関連記事へのリンク

• Opera 9.2 と スピードダイヤルのネット記事 - Opera ニュース - by 市川恵貴
• A blog? with Σαιτω - After Merlin
• [暴満館] A FASTEST BROWSER "Opera 9.20" IS APPROACHING FAST!

Operaの認証管理機能の"メール（E-mail）"に何か情報を登録してある人は、以下のフォームの周りがオレンジ色になっていて、Ctrl+Enter でその情報が入力されるはず。

そのサイト・ページに情報を記憶させていなくても、name属性に"email"という文字（fuckin'email とか emailaholic とかでもOK）を含むinput要素ではそうなるみたい。今の今まで知らなかったよ母さん。ひょっとして既出中の既出ですか先生。他の項目についてはよくわからないので教えてサミアドン。

例えば、以下のようなリンクの張られていない画像URLに出会った場合、Opera使いのあなたはどうするだろうか。

• ../../image/test/meikyuu.png
• ../../image/test/ff3.png
• ../../image/test/kai.png

残念ながら、上記URL先の画像は全く意味のないものばかりだが、もしそれが話題に上がっていて見る価値のあるものなら、URLを反転させて右クリックメニュー（Hotclick Popup Menu）から「URLへ移動」で表示させるだろう。ちょうど拡張子の辺りをダブルクリックすればURL全てが反転された状態になり、デフォルトでは「テキストをダブルクリックでコンテキストメニューを表示」にチェックされているので、ダブルクリック→メニュー選択という2ステップでOK。

しかし、その単純な作業さえも厭うユーザーがいるようで、Opera フォーラムに次のような投稿があった。

するとほどなく回答があり、1つの UserJS が提示された。

そんなわけで、リンクの張られていない画像URLをa要素としてマークアップし、マウスオーバーでリンク先画像のサムネイルをポップアップさせる UserJS。

• url to image? - Customizing Opera - Opera Community

ちなみに、画像に限らずそういうURL全てをリンク化するには、

• takememo - URLからリンクを作成（h抜きURLも変換してくれる）

マウスオーバーでリンク先画像のサムネイルをポップアップさせるには、

• チーム俺等 - USOperaION／ε∂.∂з＼ - 画像ファイルを先読みするニダ

という素敵な UserJS がある。だから、今回紹介した UserJS は、利用環境やユーザー層をかなり限定するものなのかもしれない（実際、僕は「リンクの張られていない画像URL」をあまり目にすることがない）。

サーチエンジンについて、build8746 からデフォルトとカスタムの統合という形が取られていて、これは当初不具合かと思われたが、build8758，build8762，build8767，build8769 という Weekly → Beta → Weekly の流れを見ると、なんとなく今後はこういうスタイルになるのかもしれないと感じてしまう。

そんなわけで、今のうちに search.ini を整理しておく。正式版までにこの形式が変更されれば、それまでの話。

デフォルト

以下は 9.20 Beta におけるデフォルトのサーチエンジン。URL のリンクは、search.ini の「URL」に記載されているものをそのままa要素のhref属性に貼り付けたもので、「クエリ文字」は省略している。

MSIインストーラー

翻訳エンジンは 英→日、日→英 しか用意されていないため、menu.ini の Translate menu セクションの殆どが動作しない。

Classicインストーラー

目がチカチカする。Shopping と Ebay.com はよくわからない。

カスタム

デフォルトのサーチエンジンを弄らずに好みのものを追加していく感じで、g，y，a，z，ym，yf，r，n，f，s とかぶらないキーを割り当てる。

追加したいサーチエンジンを見つけたら、サーチフィールド内右クリックで即作成。そして、F2 のページの移動ダイアログや F8 でアドレスフィールドにフォーカス移して、「キー（スペース）検索語」というのが検索スタイル。だから、少なくとも僕にとってサーチエンジンの順番はあまり重要ではない......とかなんとか言いながらも、menu.ini の Hotclick Popup Menu セクションからの検索に限っては、ある程度まとまっていた方がお目当てのサーチエンジンを選択しやすいので、折を見てはSeeMeを使って並び替えたりセパレータを追加したりしている。

他に「これ入れとけ！」みたいなやつあります？

地図検索 NAVITIME

キーの後に出発地、目的地、経由地と入力→エンターでルート検索。これ便利。

[Search Engine *]
Name=地図検索 NAVITIME（車ルート検索）
Verbtext=0
URL=javascript:query=escape("%s");queryArray=query.split("+");URI="http://www.navitime.co.jp/?keyword0="+queryArray[0]+"&keyword1="+queryArray[1]+"&keyword2="+queryArray[2]+"&tollroad=1&ctl=0604";document.location.href=URI;
Query=
Key=nc
Is post=0
Has endseparator=0
Encoding=utf-8
Search Type=0
Position=-1
Nameid=0
Deleted=0

例えば「nc　米原インターチェンジ　東京都目黒区東山3-8-1　埼玉県春日部市」とか。乗換案内も同様に、

[Search Engine *]
Name=地図検索 NAVITIME（乗換案内）
Verbtext=0
URL=javascript:query=escape("%s");queryArray=query.split("+");URI="http://www.navitime.co.jp/?orvStationName="+queryArray[0]+"&orvStationSelect=&dnvStationName="+queryArray[1]+"&basis=1&sort=0&wspeed=100&airplane=1&sprexprs=1&utrexprs=1&mtrplbus=1&othexprs=1&ctl=020010&init=0&through=0";document.location.href=URI;
Query=
Key=nt
Is post=0
Has endseparator=0
Encoding=utf-8
Search Type=0
Position=-1
Nameid=0
Deleted=0

こんな感じで。経由地を入れると undefined とか入力されてそのまま検索押せないから省いた。同じ理由で漢字 - Infoseek マルチ辞書とシータ ハイパー検索も Hotclick Popup Menu からの検索に止まっている。こういうのは目的別に作成してやらないとだめなのかな。

参考URL

• チーム俺等 - HigeOpera - search.iniをいじって乗換検索
• Opera The Fastest Browser on Earth: search.iniにGoogle Local追加
• Search.iniに電車乗換案内検索を登録する。 - おぺら ぷらす あるふぁ。 - by karakara
• 続・Search.iniに電車乗換案内検索を登録する。 - おぺら ぷらす あるふぁ。 - by karakara

テストで忙しいからチェンジログは書かねーよ、だって（異訳）。

• Easter egg! - Desktop Team - by Desktop Team

Easter eggsとかそういうの苦手。Classic版の方の search.ini 内、Shopping のキーが c から s になったというつまらないことしかわかりません。しかし、これはいよいよ search.ini を整理する必要があるな......