かえでのWebログ

試してみた。これまで日記帳の説明部分に張っていたリンクやカウンタなどをサイドバー下部に表示させることに。
だいぶすっきりしました。

バグ報告？

• システムモード対応テーマでもシステムモードでテーマがsatsukiとなってしまっています
• デザイン変更機能でインライン要素中に改行が入ると半角スペースが挿入されてしまいます。
  これは期待された動作なのでしょうか
• デザインIDに利用できる文字が半角英数＆_くらい。これ以外の文字を入力すると削除されてしまう。
  例：「Kaede's Style」→「aedetyle」
• <!-- -->でのコメントが許可されていません。

システム的な考察

デザインの編集での<@s.text_side0>, <@s.text_side1>, <@s.text_main0>, <@s.text_main1>部分でそれぞれデザイン埋め込みテキストの編集で記述したタグが挿入される模様。

一応役割的には
<@s.text_side0>：サイドバー上部
<@s.text_side1>：サイドバー下部
<@s.text_main0>：記事部上部
<@s.text_main1>：記事部下部
に挿入されることになっているが、デザインの編集で<@s.text_○○>の場所を変えることにより、上記の役割に縛られることなく配置することができる模様。

サイドバーにモジュールのように要素を追加する方法

<div class="hatena-module">
<div class="hatena-moduletitle">サイドバー項目のタイトル</div>
<div class="hatena-modulebody">
要素の内容
</div></div>

で要素がモジュールのようになります。

これまでの日記帳の説明部のソース（個人的メモ）

マイニングしても知識は抽出できません<br><a href="http://kaede.homedns.org/blog/album" target="_blank">かえでのアルバム</a>, <a href="http://jp.last.fm/user/Kaede_/" target="_blank">Last.fm</a><span class="cheer">リトルバスターズ 激しく応援ちぅ～</span> <a href="http://key.visualarts.gr.jp" target="_blank"><img class="banner" src="http://kaede.homedns.org/blog/album/top/image/lb_large.jpg"></a><br><hr>現在プレイちぅ～<br><a href="http://shchara.co.jp/" target="_blank"><img src="http://kaede.homedns.org/blog/album/top/image/sh_chara.gif"></a><br><hr><a href="http://kaede.blog.abk.nu/0343">Since 2006/06/08</a><br><img class="counter" src="http://kaede.homedns.org/blog/cgi-bin/daycount.cgi?gif"><br><img src="/album/image/kaede/adiary/t.gif"><img src="http://kaede.homedns.org/blog/cgi-bin/daycount.cgi?today"><img src="/album/image/kaede/adiary/s.gif"><img src="/album/image/kaede/adiary/yesterday.gif"><img src="http://kaede.homedns.org/blog/cgi-bin/daycount.cgi?yes"><br>

ユーザー定義タグ設定

sup	= html:sup
sub	= html:sub

実際に使用してみる

上付き文字記法

2[sup:10]=1024

2¹⁰=1024

下付き文字記法

H[sub:2]Oは水の化学式です

H₂Oは水の化学式です

ブラウザがどの程度W3C勧告のCSSやHTMLに準拠しているかをテストするAcid2というものがあるのですが、意外なことにOpera9はこのAcid2テストに合格しているということを知りました*1。

ちなみに、Firefox3.0の開発版は合格したようですが、正式版ではまだ合格していません。IEは当然(ry

ということで、テーマの開発ターゲットとしてOpera9を積極的に利用しようと考えています。Safariも合格しているようなのでOpera9で正しく表示できればSafariも問題ないでしょう。多分。

#Opera Mobileの非公式版はテストに合格しているらしい。早くAcid2に合格したOpera Mobileを公開してくれないかな……。

参考

• Wikipedia Acid2
• Acid2 Test

adiary on Opera Mobileなテーマ「つぐみ」をリリースしました。
[album:adiary/theme:tsugumi090beta.jpg]

ダウンロードはこちら

Rev0.70(Preview)→0.90beta 変更点

Opera Mobile 8.6上で意図したように表示できるように修正

その他、以下のブラウザとの親和性を高めました

• Firefox 1.5.0.8 (on Win2k)
• Opera 9.02 (on Win2k)
• Internet Explorer 6SP1 (on Win2k)

テーマでsatsuki-mobile/tsugumiを選択して頂くことでPC環境でもつぐみテーマが利用できます。
ただし、ユーザースタイルシートは有効になりません。

注意点

Opera Mobileで利用する場合、PCモードで表示しないとサイドバー部分が正しく表示されないことがあります。
現在、「ログイン」画面でこの現象を確認しています。通常の閲覧では現在問題は起きていません。

Opera Mobileの最小フォントサイズは16pt(デフォルト)で確認しています。このサイズより大きい場合表示が崩れてしまう可能性があります。

その他

Internet Explorer Mobileではadiary側の問題か、利用できません。きっとそのうち対応するでしょう。
WM5.0のIE Mobileには永遠に対応しません
不具合とか感想や(このテーマに関する)要望はこの記事にコメントなりトラックバックなりして下さい。
できる限り対応させて頂きます。

Opera Mobile on W-ZERO3[es]で見たときにサイドバーが窮屈な感じがしたのでもうちょっとすっきりしたデザインにしようと思います。

ライセンスなどはRev0.70(Preview)版の記事を参照して下さい。

W-ZERO3専用テーマとして「つぐみ」を作成中です。
昨日リリースされた116:adiaryβ14にてPreview版が同梱されています。

[album:adiary/theme:tsugumi-m070prev.jpg] [album:adiary/theme:tsugumi-m070prev2.jpg]

主な特徴/仕様

• 何かの特設ページに多分に影響されたテーマ
• adiary default skelton system(Satsuki Skelton)専用テーマ
  • システムモード対応
  • テーブル拡張仕様(table.crub)に対応
  • adiary Ver1.00β13 snapshot061110で開発
• Opera Mobile on W-ZERO3での閲覧に最適化
  • VGA環境(480x640/640x480)でそれなりに利用できるように作成
    • 本文が読みやすいようにサイドバーは上部に配置
    • 表示できるサイドバーの項目を制限
  • ダイヤルアップ通信時(x1)でも快適に閲覧できるように画像は使用していません
• GPLライセンス
• 開発環境
  • Firefox 1.5.0.8 on Win2k
  • Opera 9.01 on Win2k
  • Opera Mobile 8.6 on WM5.0 (VGA)

Preview版とは

今回は開発期間が短かったため、実機(Opera Mobile)での十分なテストができていません。
現状で下記の項目を確認しています

• システムモードでの一部フォームがはみ出してしまう部分があること
• 実機(Opera Mobile 8.6 on W-ZERO3[es])でデザインが崩れてしまうことがあること
• 実機で意図したように表示できないこと

このあたりは追々対応していくつもりですが、adiaryβ14で搭載されたモバイルモードを体感して頂くための暫定版です。

今後の予定として

• システムモードの十分なテスト
• Opera Mobile 8.6への完全対応
• Internet Explorer Mobileへの完全対応対応しません(06/11/19)

を予定しています。

最後に

前々からOperaはdisplayプロパティでもともと要素の持つ表示形態を変更することが苦手だと思っていましたが、Preview版ではインライン要素をブロック要素に変更した部分でデザインが崩れてしまっています。
Opera 9.01 on Win2kでは正しく表示されていますのでOpera Mobileもそのうち対応するでしょうが、現状(Opera Mobile 8.6)で正しく表示できるように何とかしようと思います。

また、サイドバーを上部にまとめるというのは初めての試みでしたが、以外とうまくいき非モバイル環境でもそれなりに使いやすそうなので非モバイル向けにも対応させようかと考えています。

何にせよ現状では完成度はイマイチなので完成度を上げることが先決ですが（笑

メモ

• Opera Mobile 8.6はインライン要素→ブロック要素が微妙
• Opera Mbilee 8.6は:before/:afterセレクタには未対応