しらいし
Jump to navigation
2004・05・20
ステータスモニター関連
ステータスモニターに表示されているアドレス及びポート番号
はその接続の相手のIPアドレス及び接続に利用しているポート番
号です。
LAN内に接続する先がいない場合には基本的には弊社の中継サー
バーに接続に来ますのでそのIPアドレスが表示されているものと
思います。
最大5台まで接続を行いますが、1台接続されていればシステムと
しては正常に動作している状態です。
リモート再送中:データはagentq(v3からは表示されなくなった)
再送中:データはローカル
2004・05・15
作成上の注意点 および お約束etc.
UI関連ファイルの作成上の注意点 および お約束etc.雑多な情報を書きためるスレッド
★ @ariel-test(?)など、あきらかに社内テスト用とわかるメールアドレスでセットアップします。
(CA登録の内容を確認する時、社内テスト用の登録か実際のユーザかの判別がつかなくなるため)
★ テスト用のルームとメンバーを作成し、使用します。
(業務で使用しているものを使用すると、不要な通知が飛んだりして、迷惑がかかるとともに、データが破損する危険性があるため)
★ html,xslt,css を修正する時は、その時点で最新のファイルに対して行ってください。
これらのファイルは、UI以外の人も修正を行うため。
★ 作成/修正した画面の確認は、NNとIEの両方で確認行ってください。
それぞれ種類が多いので、作成時はそれぞれの1バージョンで構いません。(ex.NN or Mozilla / IE5 or IE6とか)
# NN系の方が記述の正確さを問われるので、NN → IEの順番で確認をした方が、修正作業が少なくて済むと思います。
★ 作成と確認をする環境が同じ場合、コミット漏れが発生しやすくなるので注意してください。
★ 修正したxsltファイルをcvsにコミットする時は、きちんと変換されているか確認後、コミットしましょう!
(修正に失敗していた場合、表示が白画面になったり、アプリが落ちたりするため。)
★ 試用期間の確認などで、日付を30日以上など未来にして動作させた場合、AirOneを起動していると掲示板文書が過去へ行ってしまう可能性がある(移動した文書は戻せない)ので、注意しましょう。
2004・05・10
HTML
# 全角で<>を記述しています。
【お約束】
- 修正後、構文チェックをしましょう!
- <img>には、必ずaltを指定しましょう!(リンク先参照)
- altを指定した時(alt=""は除く)は、titleも指定しましょう!(IEはaltの値が、tooltipとして表示されるため)
- tabindexを指定しましょう!
指定可能なタグ:input, select, textarea などフォームコントロール。a, object, button, area 要素。
- 入力欄にimeの設定をしましょう!
- 言語コード(lang属性)を入れましょう!
(# xhtmlではlang属性は廃止で、xml:lang。互換性のために両方記述した方が良いとかなんとか)
【メモ】
・JavaScriptで表示するミニカレンダー用のウィンドウ
GNU/Linuxでは、(MozillaでもNetscapeでも)titlebar=0が効かないらしい。(2002/01)
・<col>は使わないようにする。(NN7, mozilla, xsltで問題あり)
・</a>の後に改行を入れると、IE6で見た時1行余分に空く。
関連で、メニューバーのボタン部分のセル内の記述を、改行で整形すると縦に位置ずれが起こるので、
見にくくても、1文になるように記載する必要があります。
2004・05・05
キャッシュが効いて、画面の表示が切り替わらない(Bugzilla 2722)
# 全角で<>を記述しています。
・ルームを移動したのに、表示が前回入室していたルームの画面が表示されるとか、
・[更新]ボタンを押したら他ルームの一覧が表示されたなど
ブラウザキャッシュによる表示の不具合についての報告が度々あがってきます。
対策としては、html,xsltに
<meta http-equiv="pragma" content="no-cache">
を記述することで回避できます。
しかし!IE5については打つ手なし?
・urlに /?netid=1&roomid={$roomid} を送っても、パラメータ部分はキャッシュとして読み込まないみたいです。
(デバッグして、requestが来ていないことを確認しました。)
そのため、他のルームに移動するときにルームを移れないということが起きていました。(田中さん談)
・http://support.microsoft.com/default.aspx?scid=kb;JA;234067
[HOWTO] Internet Explorer でキャッシュを無効にする(マイクロソフト サポート技術情報 - 234067)
> Cache-Control META HTTP-EQUIV タグはInternet Explorer 4 または 5 では無視され機能しません。
> Cache-Control を使用するには、前述の「Cache-Control ヘッダー」で説明した HTTP ヘッダーを使って、
> このヘッダーを指定する必要があります。
理論上は、airportalでCache-Controlヘッダをつけられますが、パフォーマンスに響く可
能性があるので、制限事項で良いと思います。
2004・04・30
CSS (定義関連)
# 全角で<>を記述しています。
AirOneは、
- IE5.01をサポート
- ブラウザ共通cssを使用(振り分けは行っていない)
- AirOne特有の問題
などが影響し、使用できるcssに制限があります。
※以下、cssの記述がまちがっていたり、回避策を知らないだけかもしれないので、参考程度に見てください。
■メモ
【!】floatで、ex.[icon]文字列と配置した時、表示幅に収まらなくなると改行が発生する(IE)。
【回避方法】
・<span>文字列</span>でくくり、画像を<span>の背景扱いにし、paddingで文字列の開始位置を調整する。
この場合、NN系で見た時、画像の下部1pxが欠けるので、padding-bottom:1pxとするとよい。
・floatを設定するブロックの両方に設定(left,right)する(未検証:某雑誌より)。
・float側のブロックが常に長い場合に限り、float設定をしない方のブロックのマージンを、
float側の表示幅より大きく設定する(未検証:某雑誌より)。
【!】tableをfloatで左右に配置した時、IEではtable間のmarginの指定幅通りに余白が空かない。
【回避方法】左側のtableにmargin-rightで指定するとちゃんと空く。
【!】tableのセルにiframeを配置する場合、セルとiframeとの間に1pxほど隙間ができる。
【回避方法】セルにpadding:0pxを指定すると良い。
【!】<a>に余白のスタイルを割り当てるとIEではその範囲も選択可能の範囲となる。
【回避方法】余白のスタイルを<span>に当てて、<a>を囲む。
【!】[共有フォルダ]などアプリを起動するためのボタンに<a>を使用すると、新規ウィンドウが開いてしまう。
【回避方法】
“見えない”iframeを作成し、target先に指定する。
しかし、この見えないに display:none を使用すると、NNでは本当に無いものとして扱われるため回避できない。
なので、iframe { width:0px; height:0px; border:0px; }で、見えなくすると良い。
メモリー用にiframeを使用している場合も同様。
【!】ボタンの画像を<a>の背景画像としてcssで指定するとき、改行して表示させる時は display:block を使用することで表示可能になります。
インラインで表示する時は
− IE: 指定なしで、inline-block(css3)のような効果となります(たぶんbug)。
− NN: 表示されません。
【inline-block的な表示をさせる方法】
− IE: bugを利用する。
− NN: paddingで、画像の width, heightを指定する。
画像サイズによっては、vertical-align:で表示位置を下げたり、画像が欠けたり表示位置がヘンな時はposition:relativeを記述すると良いっぽい。(あまり推奨しない)
【!】画像のurlには「"」or「'」で囲む。(NN7で画像が表示されない問題あり) ← AirOneだけ?
【!】white-space:nowrapはie5.5以降で使用可能なためHTML側で指定する。
【!】cursorは、pointerとhandの両方を指定する。(JavaScriptの絡み。IE5ではどちらも効かない。)
【!】cssのクラス名には、アンダースコア(_)を使用すると不具合がある。(ハイフン(-)はOK)
* id class ともにHTML CSSの規則では特に制限はないが、ブラウザ側で"_"(アンダースコア(_)はうまく認識しないようです。
【!】プルダウンリストにwidthの指定をすると・・・
− NN6ではプルダウン内はすべて表示されるが、スクロールバーが表示される。(NN7では未確認)
− IEはプルダウン内も指定した幅までしか表示されない。
【!】ブロックレベルをセンタリングしようとすると・・・
Windows版IEでは左右のマージンにautoを指定しても効きません。
【回避方法】http://mozilla.gr.jp/standards/webtips0004.html
【!】Windows版IEは、ウィンドウ内に内容が収まっていても、スクロールバーの領域が確保されてしまう(IEのバグ?)。
【回避方法】
確保したくない時、body {overflow:auto;}とすることで、解消できます。
しかし、作りによってはNNの方に
− 表示上の不具合: ex.ページの内側にスクロールバーが表示されたり
− 印刷プレビュー: 1ページに収まらないものはスクロール表示となり、印刷できない
などの不具合が発生してしまうので、注意が必要です。
2004・04・25
[Wontfix] 予定のコメントを入力すると枠が伸びる (Bugzilla3170)
・・・こう言うことらしい。
バグに上がっている該当箇所(ログイン画面のパスワード欄も確か影響を受けていたはず・・・)は、inputの幅指定が影響している。
幅指定を止めれば伸びなくなる。
# ブラウザのバグでもあるので、よほど辛くない限りは対処しない(作る時に気にする程度)で良いと思います。
2004・04・20
リストマークの位置揃え
リストマークに画像を使用した場合、画像と文字との位置ズレが目立つ場合があります。
(bodyにline-heightが指定してあると、IEでのズレが目立つらしい)
■改善方法
画像の上部にあらかじめ3pxの余白をつけておく。
【方法1】liの行間(line-height)を本文に合わせ、縦位置を上揃え(vertical-align:top)にする。
【方法2】liの行間を1.0にし、行間は margin-bottom で指定する。
と、良いらしい。
(某誌より)
2004・04・15
sans-serifを指定したHTMLファイルを表示すると文字化け
■AirOneで確認されていること
UTF-8(エンコーディング)+Me+IE5.5では
− font-family:sans-serifを指定すると文字化けする。
− font-familyを指定してもUTF-8下では、文字セットが「ラテン語基本」となり、効果が得られません。
■関連情報 1
http://east.portland.ne.jp/~sigekazu/css/font_family.utf8.htm
> font-familyを設定した場合、CSS1/CSS2の仕様書を読むと、CSS1では1つの要素に
> つき1つのフォントが採用され、CSS2では同時に複数のフォントを採用させること
> ができるということのようです。
> 仕様とは異なり、各ブラウザの実装は(日本語ページでは)以下のような感じです。
> WinIE4/5
> 1つの要素につき1つのフォントしか採用されない。
> 欧文フォントが採用された要素では、表示できない文字はブラウザに設定されている
> 日本語用プロポーショナルフォントで表示される。一般フォントファミリは不確実。
> IE5以降は"MS PGothic", "MS Mincho"などの英字表記も認識する。
> WinIE5.5/6
> 一般フォントファミリへの対応が良くはなってはいるが、相変わらず中途半端。
> 確認したWindows 98SE/Me/2000/XPのうち、Me版は一般フォントファミリである
> sans-serifの扱いがおかしい。
■関連情報 2
[IE5]sans-serif を指定した HTML ファイルを表示すると文字化け(マイクロソフト サポート技術情報 - 417057)
http://support.microsoft.com/default.aspx?scid=kb;ja;417057
2004・04・10
mozilla1.01に対する注意
# Nucleusを混乱させないため、全角の<>を使っています。
From: "XXX" <XXX@ariel-networks.com>
Date: Wed, 28 Jan 2004 14:12:49 +0900
Subject: [airone-dev:09423] javascriptのmozilla1.01に対する注意
mozilla1.01では、span要素がブロック要素を含む場合に、
span要素をIDで参照する以下のようなコードが動きません。
document.getElementById("span-id").className = "none";
...
<span id="span-id">
<block-element>...</block-element>
</span>
<block-element>はブロック要素で、<div>等です。
このような構造になっている箇所があるとmozilla1.01で動かないので、
<span>を<div>に置き換えるような修正をお願いします。
2004・04・05
Image File
v2.3向け新規分からgifで保存します。
現在はGIFとPNGが混在していますが、最終的には「GIF」に統一します。
「PNGに統一できるならPNGが良い(←好みの問題)」と言うだけの話のようなので、
・アニメーションGIFを使用する。
・PNG24はIEのサポート状況がよろしくない(ex.不透明度の指定が表示できない)。
・PNG8は、NNだと同じ数値色を使用しても、色ズレが激しかった(ガンマ値の関係と思われる)ので、
背景色と絡むような画像はgifの方が無難。
と言うことからもPNGに統一は難しいと言うことで「GIF」することにします。
2004・03・30
GIFのライセンス
# 何度となく質問があがるので、記述&リンクを張っておきます。
「GIFファイルのライセンスでUNISYSがうんぬん」と一時期話題になりました(?)が、このライセンスは、GIFにかかるものではなく、LZWと言うデータ圧縮アルゴリズムにかかるものです。
現在のAirOneに関して言えば、GIFファイルを作成(Fireworks,Photoshop)、表示(ブラウザ)するためのソフトウェアがエンドユーザに正式にライセンスされていれば、問題ないかと思います。
詳細は、
日本ユニシス(株)−LZWライセンス
http://www.unisys.co.jp/LZW/
Macromedia(会社所有:StudioMX)
http://www.macromedia.com/support/general/ts/documents/gif_license.htm
# 日本語サイトで見つけられなかったのでUSサイトから・・・
(Adobeの文書とそっくり(逆?)なのは定型文があるから?)
Adobe(個人使用)
http://www.adobe.co.jp/support/lzw.html
2004・03・25
条件によってtitle="*"の内容を変えるとき・・・(記述の注意点)
条件によってtitleの内容を変える時、例えば・・・
<xsl:attribute name="title">
<xsl:choose>
<xsl:when test="x-project = x-refid">
このタスクを保存します
</xsl:when>
<xsl:otherwise>
このプロジェクトを保存します
</xsl:otherwise>
</xsl:choose>
</xsl:attribute>
とします。
すると、IE6では添付ファイルのようになってしまいますので、
<xsl:when test="x-project = x-refid">このタスクを保存します</xsl:when>
または
<xsl:otherwise>
<xsl:text>このプロジェクトを保存します</xsl:text>
</xsl:otherwise>
と、書くようにしましょう!(NN7では問題なし)
2004・03・20
AirOneファイル作成時の注意点
・html,cssファイルは、「Shift_JIS」で作成/保存する (下記参照)。
- Shift_JISで作成する理由:UTF-8だと、GoLiveやブラウザで確認する時、文字が文字バケするため。
- cssのコメント文に2バイト文字不可(UTF-8に変換する関係上。UTF-8で作成する時は使用可。)
・xsltファイルはUTF-8 (メモ帳での編集は不可)。
- メモ帳不可の理由:UTF-8識別のために最初の3バイトを必ず使用するのだそうです。
・画像やcssなどの相対パスは、html「../」、html/ja「../../」で統一する (下記参照)。
# v2後、ディレクトリ構成を変更したため、パスが通らなくなりましたので、画面の確認はデバッグ環境で行います。
(今後パスを通るようにするかは、検討中)
※インストーラ作成(kitting)時に、以下のようにマクロで一括変換されるため、記述を揃えておく必要があります。
1. ファイルの文字コード変換
- sjis → utf8
2. ファイル内の文字置換
- charset=Shift_JIS → charset=UTF-8
- ../../css → http://$localhost?>/airdir/css(theme.cssは airdir → airuser)
- ../../images → file://$airdir?>/images