« | ホーム | »

_blankを使わないで別ウィンドウを開く

2007/05/28 月曜日 19:10 投稿者 zon

個人的に別ウィンドウを開かせるようなリンクの張り方はほとんどしないのですが、たまにどうしても別ウィンドウで開いて貰いたい場合があります（PDFデータのダウンロードページとか、そのページからリンクが張れなくて、行き止まりになってしまう場合とか）。

でも、_blankは XHTML 1.1 では廃止されたとか、HTML4.01とXHTML1.0で非推奨だとか、そういった感じのイメージだけはなんとなくあって、今は基本的にほとんどが XHTML1.0 で書いているので良くはなくてもダメではないという感じなので、使ってもいいかとも思うのですが、将来的に XHTML 1.1 とかにしていくときに修正するのが大変なので、軽く調べて以下を参考にすることにしました。

_blankを使わないで別ウィンドウを開くにはrel=”external”を使うのが美しいと思う。

_blank 使わない別ウィンドウを開く方法

コメント欄を見るといろいろと議論されていて、この記事の内容から修正されている点もありますが、特にガチガチに XHTML に準拠した形にしたいわけでもないので、とりあえずは、a タグに class="extarnal" を指定して、JavaScriptで anchor.target = "_blank"; にすることにしました。

rel="extarnal" にしなかった理由は、WordPress のコア部分の auther 関連が既に class="extarnal" を指定していたからです。コア部分に手をつけるのはあまりしたくないし。

それなら external じゃなくて、別の名前にすればよかったのですがもう一つ理由があって、上記の記事のコメント欄を読んでいると、rel="external" は非準拠だどうだといった議論があったりして、詳しく調べるのも面倒なので、無難に class にしておくことにしました。ついでに rel属性の準拠、非準拠の話の中で、(X)HTML仕様に定められていないリンクタイプを記述するときは、プロファイルをhead要素で指定しないといけないといったことが書かれていました。

headタグの profile要素の指定について

プロファイルとか言われても、あまり意味が分からないので、とにかく参考にされている以下のリンク先などをざっと読んで rel="nofollow" を使う場合もプロファイルを指定しておく必要があるとありました。

rel="nofollow" ほかメタデータのプロファイル

WordPress のプロファイルは既に、XFNを使っていますが、このプロファイルが、どうも複数指定は出来ないようで、XFN をとるか XHTML metainformation profile 二者択一になってしまうので、XHTML metainformation profile を採用することにしました。幸い XFN は、指定するのが面倒で、全く使っていなかったし。

ソースコードは、<head profile="http://gmpg.org/xfn/11"> を <head profile="http://purl.org/net/ns/metaprof"> に変更すればOKのはず。

タグ: , ,
WordPress | コメント(0) | トラックバック(0) | ページトップ
« | ホーム | »

style.cssの変更に対応する

2007/04/22 日曜日 18:40 投稿者 zon

ブログを立ち上げて間もない状態なので、ブログのレイアウトやデザインの微調整のためにスタイルシートを頻繁にいじっている状態になっています。

で、このスタイルシートがブラウザにキャッシュされていて、内容を変更しても閲覧している側がページの再読み込みをしてくれなければ、古いキャッシュファイルのスタイルシートのまま閲覧されておかしなレイアウトになっていることってあると思います。

正確には、自分が使っているFirefox2.0はスタイルシートが変更されたら、自動的にスタイルシートを再読み込みしてくれているのかこの現象は出ないのですが、IE6.0だと、スタイルシートを変更しても古いスタイルシートを使ってレイアウトがおかしくなります。

これを回避する為にちょっとした小技メモ。

ファイル名が同じでもHTMLで読み込む際のファイル名の後に、?v=xxx をつければ、別ファイルとしてキャッシュされるようです。これが、HTMLの文法的にありかなしなのかは調べていないから分かりませんが、割と使われている方法みたいだし、この際その辺の細かいことは気にせずコレを利用します。

?v=xxxを使った例

<style type="text/css" media="screen">
@import url(style.css?v=1.0.0);
</style>

この ?v=xxx の xxx 部分を更新時間が表示されるようにして、スタイルシートを修正すると自動で xxx が変更されるようにします。

WordPress の場合は、スタイルシートを読み込んでいる処理をしているところは、以下のファイルがほとんどだと思うのでここを修正すればOKです。

/wp-content/themes/テーマ名/header.php

スタイルシートのパスを出力する関数は、

<?php bloginfo('stylesheet_url'); ?>

でこの後に、ファイルの更新時間を取得する関数 filemtime('ファイルのパス') を使って

?v=<?php filemtime('ファイルのパス') ?>

を追加します。

WordPressでのカスタマイズ例

難しいことは分からないという人のために WordPress で使えるサンプルコードを以下に書いておきますが、この小技は、WordPressだけじゃなく、スタイルシートのパスさえ変更すれば、いろいろなところで使えます。

<style type="text/css" media="screen">
@import url(<?php bloginfo("stylesheet_url"); ?>?v=<?php echo filemtime(get_stylesheet_directory() . '/style.css'); ?>);
</style>
タグ: , ,
WordPress | コメント(0) | トラックバック(0) | ページトップ

zontheworld HTML convert time: 0.058 sec. ( Login )