トップ «前の日記(2004-08-16) 最新 次の日記(2004-08-18)» 編集

2002|01|02|03|04|05|06|07|08|11|12|
2003|01|02|03|04|05|06|07|08|09|10|11|12|
2004|01|02|03|04|05|06|07|08|09|10|11|12|
2005|01|02|03|04|05|06|07|08|09|10|11|12|
2006|01|02|03|04|05|06|07|08|09|10|11|12|
2007|01|02|03|04|05|06|07|08|09|10|11|12|
2008|02|03|04|07|

2004-08-17 [長年日記]

_ 今にも雨が降りそうな天気 (11:36)

image

IE系だと

写真付きの段落は表示がおかしくなるなー。レイアウトは崩れないけど、文字部分がレンダリングされない。というか、されているんだけどレンダリング終了後に、いったんその部分だけ再描画(InvalidateRect)させないと、読めない状態になってしまう。Mozilla系だと大丈夫なんだけど。

と思ったら

このくらい文章量があるとちゃんと表示されるな。文章量との兼ね合いなのか。

文字欠け対策

MLの「[tDiary-theme] 文字が欠けるテーマ(http://www.tdiary.org/archive/theme/threads.html#00506)」から始まるスレッドに関連した情報があった(サンクスzoeさん)。ひとまず、default.cssのdiv.sectionの項目に、width: 100%;を追加して様子を見る方向で(一応手元の環境では文字欠けが出なくなったっぽい)。

これって結構古い話題みたいだけど、tDiary 2.0の標準テーマでも対策されていないってことは、何かほかの問題があるからなのかな?

_ blogツール/サービスサイドバーの判別 (13:00)

適当に見て回った範囲で書いたので、いろいろ間違いというか、デフォルトではないものを参考にしていたりする場合があるかも。それにしてもまだまだえぐいtableデザインのところが多いなー。tableデザインでもいいから、論理要素をDOMで判別できるようにしてくれると、ありがたいんだけど。

今回はサイドバー周りしか見なかったけど、一通りのデザイン要素をチェックしてみるのも面白そうだな。ある程度共通のアプローチってのもあるみたいだし。一応サイドバーはdiv class="sidebar"ってのが多数&主流派かな? ただ、tDiaryではclass="sidebar"で表示位置まで決まっちゃうけど、blogツール系ではさらに外側にdivをかぶせて表示位置を指定することで、3ペインとかを表現している模様。

個人的には一番ロジカルなtDiaryのデザインをベースに、もうちょっと日記(日付ベース)以外でも使いやすい標準デザインを作って、各blogツール/サービスもできる限りそれに準拠するようにするといいんではないか、とか思ったりした。

訂正・追加等のツッコミ歓迎。

blogツール系

tDiarydiv class="sidebar"※その他tDiary互換テーマを利用しているツール/サイトも同様。
IBLOGdiv class="side"
movable typediv id="links"※これが2.661以前の標準だったらしい
movable typediv id="frame-left"※本家
movable typediv class="side"※というパターンもある模様
Nucleusdiv id="stuffbar"※本家
WordPressdiv id="sidebar"※本家
lilydiv class="menu"※本家
P_BLOGdiv id="menu-box"※本家
blosxomdiv id="links"※かなー?
HNS ※tableだよね
その他 ※サイドバー要素を判別できるツールはあるかな

blogサービス系

はてなダイアリーdiv class="sidebar"※tDiary互換
JUGEMdiv class="links"※サイドバーじゃないけど、サイドバーのリンク一覧文字要素はこれにしている模様
livedoor Blogdiv id="links"
Excite Blog ※DIV ID=LEFT/RIGHTは、その中身がメニューだろうが本文だろうがかまわず、純粋に表示位置だけのために指定されるらしい
goo Blogdiv class="leftblock"※こっちが標準か?
Yaplog ※tableオンリー
Doblogdiv class="menu"※だと思う
WebryBlog ※サイドバー的な表示はないのかな?
Seesaa blogdiv id="links"
My Profile* class="side_text"※えぐいtableデザインだけどサイドバー相当に表示する文字はspanやtdのclass="side_text"に統一されているっぽい
Blogzinediv class="sidebar"
AOL Diarydiv class="sidebar"
melma! blogdiv class="sidebar"
チャンネル北国div id="links"
MyPressdiv class="menubody[\d]?.*?"※とかになるのかなー
BLOCKBLOGdiv id="menu"※のような気がする
2log ※table
ココログdiv class="sidebar"※movable type
TypePaddiv class="sidebar"※movable type
LOVELOGdiv id="links"※なんだろうな
DI:DOdiv class="freespace"
News-Handlerdiv class="sidebar"
Diary Notediv class="menu"
Tags: blogmap

_ データ収集対象からサイドバーを除去 (16:27)

↑を参考にサイドバーおよびコメントやtrackback一覧表示部をデータ収集対象外に変更。あとその他大手サービスに関しても、正規表現で対応できそうなものはそれなりに対応した。これでずいぶんREFERER SPAMtrackback SPAMに対する耐性が強くなった&常設リンクの影響を受けにくくなったんじゃないかな。あとは目立つものについてぼちぼち対応していこう。

Tags: blogmap

_ コメントちょっとだけ表示 (17:59)

トップにまったく最近のコメントが表示されないのも寂しいんで、最新10件だけtrackbackの下に表示するようにした。

Tags: blogmap

_ 充電一直線 for CDMA (18:41)

KBC-CDMA/U 充電一直線 for CDMA 相変わらずバッテリーが持たない(ふつうに通勤の往復で使うと途中で切れる)こと以外は文句がないW21Sだけど、純正充電器&バッテリーを買おうかと思ってauショップに行ったら、取り寄せになると冷たく言われて面倒くさくなってしまい、手近なところで「KBC-CDMA/U 充電一直線 for CDMA」を買って妥協してしまった。会社にいるときはこれを使う方針。純正以外の充電器を使うとよくないと聞くけれども、ひとまずどのくらいよくないのか実地で確認してみることにしよう。

Tags: W21S
本日のツッコミ(全10件) [ツッコミを入れる]
_ くりす (2004-08-17 18:33)

DI:DOはdiv class="freespace"となります。ご参考まで。

_ ishinao (2004-08-17 18:37)

↑ありがとうございます。追加しておきました

_ miyagawa (2004-08-17 18:50)

livedoor Blog も div id="links" です。
その中の1個ずつの要素が div class="sidetitle" とか class="side" ですね。
# HTMLテンプレートがカスタマイズできるのでその場合はその限りではありません。。

http://bookmarklet.daa.jp/
にある「DIVの id部を表示」「DIVにclassが定義されているものだけを表示」が便利です。

_ ishinao (2004-08-17 18:55)

↑ありがとうございます。
このbookmarkletはいいですね。というか、HTMLを目で追った努力のほとんどは無駄だったってことか……orz

_ 加野瀬 (2004-08-17 20:23)

Movable Typeは2.661以前だとデフォルトは「div id="links"」です。JUGEMやivedoor Blogも同じなのでMovable Typeに影響されたのではないかと。

_ ishinao (2004-08-17 21:31)

↑ありがとうございます。
なるほど、元々movable typeはdiv id="links"だったんですか。ってことはdiv id="links"なツールたちは、きっと開発者がその頃のバージョンのMTをベースにデザインしたんでしょうね。
ただ、ちらっと見た限りでは、古いMTの(CSS周りの)デザインってあんまり筋がよくないっぽいから、最近MT系自体もdiv class="sidebar"方向に移行しつつあるって感じなのかな。

_ zoe (2004-08-17 22:06)

http://www.tdiary.org/archive/theme/msg00506.html
このスレッドが参考になると思います。>文字消えの件

_ ishinao (2004-08-18 05:30)

↑ありがとうございます。ひとまず上記MLを参考に、div.sectionにwidth: 100%;を追加して様子を見てみます。

_ pnoko (2004-08-25 22:06)

チャンネル北国tvも div id="links"です。
HTMLのテンプレートは今のところ1種類だけなので、全ブログ共通です。

_ ishinao (2004-08-27 07:52)

↑あ、本当ですね。class="sideblock"なのは、チャンネル北国のトップページ(blogじゃなく)でした。修正しておきました。ありがとうございました。