no title - blog -

http://blog.notitle-web.com/においてアンカーの指定を

<a href="image/../history/../temple/temp001/../../"></a>

と指定したらどうなるかという疑問。
どこに飛ぶんだろう？と思って試しにやってみたり。

http://blog.notitle-web.com/image/../history/../temple/temp001/../../

なんてアドレスに跳ぶのか？と思った。

アンカータグの指定としては、明らかに普通じゃないんだが（つか冗長性の塊）、これでも動作するのかな？と思ってやってみました。

答え

なんか、以前から作成してあった広告表示プログラム。
それの改良版を作成してみました。

具体的に言うと、以前のverは１つのみの表示だったのに対して、今回のは一応理論上はいくらでも広告をランダムに表示できます。
やろうと思えば簡易的なGoogle Adsenceみたいなデザインの広告が作れるわけです。

今のところは、横表示型。

いくつかの広告リストからランダムに広告を呼び出して表示する。
当然ながら、ランダムに呼び出しても同じ広告が２つ表示されることがないようにしてある。
二重表示防止もしてあるからなかなかの優れもの。

一応完成しているけどテストを重ねてみないとまだ分からない状況。
私的には気に入っている。一応、ブログとかでも使える。
ってかむしろブログ（主にＭＴ？）に特化させたもんです。

ＭＴユーザーの人は分かっていただけるかもしれませんけど、テンプレートの内容等を更新したらサイトを再構築しなければなりません。（HTMLでファイルを出力している場合）
それを再構築しなくても済むように何気に頑張ってみた。

近日公開するかもしれないし、しないかもしれない。
とある方の依頼から作成したもんなんで、その人専用っぽいですが公開できるなら公開するかも。

ＣＧＩとかを使っている時に不便に感じることが最近は多々ある。
例えば、スパム対策。
スパム対策で私がスパムに有効だと思うのは、メッセージエリアでのＵＲＬの書き込みを禁止する。こうすることでスパムが極端に減少する。

しかし、その機能（禁止語句）を実装していない掲示板が多々あることに気づいた。
私が使っていた掲示板も禁止語句の設定ができない。

仕方がないのでテキストを数行追加して、機能を追加したのだ。

さて、突然だが私はＣＧＩを作れるでしょうか？
答えはＮＯです。
未だにＣＧＩを１つも自分で制作したことがありません。（カウンターくらいなら最低限すぐ作れそうだけどね）
しかし、最低限の知識と技術さえ持っていれば自分が欲する機能を自分で実装することも簡単にできます。つまり、なんか問題があったりすれば自分で改造して使えばいい。
だから、誰かに頼るのではなく自分で少しだけでも改造する知識や能力を手に入れればできることの枠が非常に広がる。

ちなみに私は、今回掲示板を改造してみた。
まず、吐き出すＨＴＭＬをヘッダとフッターに分けてなるべく冗長性を排除して出力すること。
そして、掲示板の記事などを見るとアンカーを微妙に変えたりと色々やってみた。

途中、変更点もあったけど自分なりによくできたと思う。

http://www.notitle-web.com/bbs/wforum.cgi

これです。
本来のデザインはださかったので自分のｻｲﾄ風のデザインに変更してみました。
興味のある方は是非チャレンジしてみてくださいな。

Perlという言語はそんなにムズカシいもんじゃないんでね。

IE7.0

IEのver 7の日本語版が正式にリリースされました。
メジャーバージョンアップとしては５年ぶりということで様々な機能の追加。

・タブ機能
・FSSフィールド
・検索ツールバーで検索エンジンの選択が可能
・セキュリティー機能

などです。
様々な機能がつきました。
まぁ、セキュリティー面を除いてしまえば大半はSleipnirで解決してしまうのですが。

まぁ、ブラウザは当面Sleipnirで済ませてしまおうという考えなので、今後はIE7.0の環境。

主には、HTMLやCSSの対応状況などについて考えていきたいと思っています。
対応状況などの詳しい情報については、今後頻繁にMicorosoftに通うしかなさそうです。

さて、久しぶりにCSSをガシガシと弄ってみました。
というのもメニューが未だに気に入らない部分があるので修正をしています。
しかし、１つ修正するとまた１つ問題が出てきたりしているので、３歩進んで２歩下がるってヤツです。
まぁ、技術的には向上しているので良い経験をしているのですが。

さて、今回はCSSのテクニックです。
これは、興味のない人は見なくて結構です（つまらないし）

私は、背景画像があるファイルに対してオンマウスで効果を付けるCSSを記述していました。
ただ、その効果を再現してみると重くて効果が起こるたびに画像を読み込んでいるようでした。
これは何か改善しなければ！と思って修正作業。
そこで１つのことに気付きました。

スタイルシートのクラスで、aとa:hoverというのがあります。
aはアンカータグ、a:hoverはアンカータグの範囲にマウスを乗せたときに動作です。
実はスタイルシートは

アンカータグの範囲にマウスを乗せる→a:hoverの実行→マウスを離す→aクラスの再度読み込み

というプロセスになります。
つまり、aタグの範囲に画像を読み込ませるようにしてしまうとマウスが離れた場合には、もう一度画像読み込み処理を行うということなので連続で上記のプロセスを踏むとかなりの処理が必要になってしまい結果重いページになります。

それを改善するためにはスタイルシートではaクラスで画像の読み込みを行わないってことです。
まぁ普通やらないと思いますが。

現在divタグをメインとした（意としては、テーブルタグでメイン部を作らない）ページに移項するために必死で移項するようにサイトを作成しているのですが、面倒です。

何が面倒かというと、昔の自分に触れることが。
サイトは半年以上前に作成したものですが、その頃はCSSやHTMLの知識が稚拙だったため非常にまずい状態だったわけです。そのため、随分更新作業をしました。
それはテンプレートも同じ。昔作成したテンプレートをそのまま引っ張ってきているもんだからソースが汚い汚い。仕方がないからdivタグで一から作り直すことにした。

それが失敗だった。
基本的にdivタグ系サイトを作成経験が少ない私には鬼門。
現在、移行中のページがはじめてなのに、作り直すなんて作業したもんだからブラウザとの互換がとれず非常に苦労しました。

Internet Explorer　と　Netscape系（Firefox含む）はブラウザの表示が大分違うので、互換を考えずに作成してしまうと滅茶苦茶になるわけです。IEで動作確認しながら途中まで作成したところでFirefoxで確認してみるとこれまた酷い表示になっているわけです。

まず、センタリングされるべきところがセンタリングされなかったりしてましたからね。
そういったところを一つ一つ修正。
paddingなどの値も考慮してどんどん修正作業を続けました。

しかし、途中でいきなりつまってしまったのは、Firefoxでは何故かレイヤーを使った表示になっていました。つまり、テキストや画像が浮いている状態になっていました。これは一体なんでなんだろうといろいろ弄っていたのですが全く分かりませんでした。１時間以上ずっと考えていました。
しかし、答えは回り込みの解除をしてなかったという単純なものでした。

こういったようにブラウザの互換云々を考え出すと非常に疲れるのです。

とりあえず、IEとネスケ系ブラウザは次のバージョンはpadding値の表示の仕方だけでもいいので同じにしてくれると非常に助かります。

今回は、HTMLの仕様の話。

HTMLを扱っていると自分でこういうタグ作りてぇ～！とか思うことが最近多々あります。
これは、汎用性に欠けるだろ？とか、こういうプロパティがあったらとか色々思う。
思いもよらない意味不明な動作をするときもありますしね。
（それは、制作者側が悪い場合が大半ですが）

そして、私が一番嫌だと思っていたのがFormタグの余白。
Formタグというタグを使うと上下にどうしても余白ができてしまうのです。

何故か定義もしていない余白ができてしまう。
これは一体何故なのか？多分、Formタグには最初から余白を作成するような仕様になっているんじゃないかな？そうでなければ理解ができないしね。

私だけでなく、この使用を嫌だと感じている人も多いのではないだろうか？デザインを気にするサイトだと１pxにも気を使う。そのため、無駄な空白なんぞ作られてはたまらないわけだ。
それで、Formタグの余白を消す方法を検索してみたらあったあった。私と同じ考えの人は少なくなかったようですね。

【やり方】

<table><tr><form><td>
<input type="text">
</td></form></tr></table>

このように、tableタグのtrとtdの間に、Formタグを入れると余白がなく動作します。本来、trタグとtdタグの間は何も入れないのが常識ですが、Formタグを入れても正しく動作します。
デザインに凝ってて余白つくるんじゃねぇええええって方は是非どうぞ。

最近、ＳＥＯの面でもdivタグでサイトを構築することに興味を持っている。
divタグというのは本来全く意味を持たず、属性や、スタイルシートなどで変化させることを目的としたタグなのですが、最近のサイトは、テーブルタグを使用せずに、divタグを使用しているケースがよくある。

blogなんかはdivタグで構築されている場合が多い。（一般のサイトに比べて）
divタグはかなり利用されています。
しかし、divタグのどこが良いのかと言うと構築次第では、テーブルを利用するとどうしても下に来てしまうソースを上に送ることが可能になるためです。