XserverXserverSupportDomainDomainSupportMany-KingMany-King Support

「2007年05月05日」のアーカイブ

header.php をより完璧に！

投稿日：2007年05月29日
Category: ウェブプログラミング

より完璧！？な XHTML を目指して、「Another HTML-lint gateway」で抽出された問題（投稿記事、「より厳しい XHTML チェック」に詳細があります）を解決する必要がありますが、まずは header.php に関連する問題を解決します。

1. <html> における「lang 属性」と「xml:lang 属性」
これは、以外に簡単でした。以下のコードを修正します。
修正前

<html xmlns=”http://www.w3.org/1999/xhtml”>

修正後

<html xmlns=”http://www.w3.org/1999/xhtml” xml:lang=”ja” lang=”ja”>

2. <head>〜</head> 内の修正
指摘されている mailto とナヴィゲーション用のリンクの下記のコードをスタイルシートを指定するコードの直前に挿入しました。

<link rel=”index” href=”/index.php” />
<link rev=”made” href=”mailto:webmaster@nakui.biz” />

上記 2 点を修正するだけで、header.php に関する問題点が解決できました。投稿記事、「XHTML における「XML 宣言」の方法」と合わせて、ほぼ完璧！？な header.php に変身！

No Comments »

XHTML における「XML 宣言」の方法

投稿日：2007年05月29日
Category: ウェブプログラミング

XHTML 1.0 では、XML 宣言することが強く求められる！という事は良く知られているようですが、Internet Explorer 6.0 （IE6.0） が、それをカバーしていないため（エラーになったり、ページ表示できなかったり・・・）、宣言することを避けているサイトが結構ありますよね！

しかし、PHP が稼動するレンタルサーバでは、これを簡単に解決してくれます。詳細は、「BirDesign::IE6でのXML宣言の問題と回避方法」という投稿記事に示されています。

本サイトでも上記の投稿記事を参考に header.php の最上位行に下記のコードを挿入しました。

<?php
$ua = $_SERVER['HTTP_USER_AGENT'];
if (!(ereg(”Windows”,$ua) && ereg(”MSIE”,$ua)) || ereg(”MSIE 7″,$ua))　{echo ‘<?xml version=”1.0″ encoding=”‘ .get_settings(’blog_charset’) .’”?>’ . “\n”;
}
?>

上記のコード中、<?php と ?>の前後に、余計なスペース・改行などは入れないことが注意点くらいで、単純に挿入するだけで、XHTML 1.0 では、XML 宣言することができるようになります。上記のコードは、訪問者のブラウザが Windows の IE 以外だった場合に、XML宣言をするようになっているそうです。

No Comments »

より厳しい XHTML チェック

投稿日：2007年05月29日
Category: ウェブプログラミング

本サイトでは、ウェブ標準に拘って、XHTML + CSS をできるだけ正確に表記したいと考えているのですが、取り急ぎ W3C が提供している「W3C Markup Validation Service 」において “Valid XHTML Traditional” を目指しています。

しかし、一度クリアすると更なる上を目指したくなり、ウェブサイトを運営されている方なら誰でも！？ご存知の「Another HTML-lint gateway」での採点を実施したくなりました。

XHTML をチェックすることでは、最も厳格なものである、と個人的には信じていますが・・・そして早速採点すると、下記のような評価で得点は 85 点！Line とは、ページの XHTML の Line を示しているので無視するとしても結構ありますね～修正すべき行が・・・

  1. line 0: (文書の先頭に BOM が含まれています。)
  2. 【解決策】line 1: XHTML1.0 では XML宣言をすることが強く求められています。
  3. 【解決策】line 2: <html> には lang 属性を指定するようにしましょう。
  4. 【解決策】line 2: <html> には xml:lang 属性を指定するようにしましょう。
  5. 【解決策】line 19: (<head>〜</head> 内に <link rev=”made” href=”mailto:〜” /> が含まれていません。)
  6. 【解決策】line 19: (<head>〜</head> 内に <link rel=”next” href=”〜” /> などのナヴィゲーション用のリンクが含まれていません。)
  7. 【解決】line 127: <form> には name 属性と id 属性の両方を指定するようにしましょう。【解決策は、name 属性を挿入するだけですが、属性は id 属性と同一である必要があります】
  8. 【解決策】line 136: <div> と </div> の間が空です。
  9. line 174: (<td> と </td> の間に空白文字しか含まれていません。)
  10. line 175: (<td> と </td> の間に空白文字しか含まれていません。)
  11. line 176: (<td> と </td> の間に空白文字しか含まれていません。)
  12. line 182: (<td> と </td> の間に空白文字しか含まれていません。)
  13. line 195: (<td> と </td> の間に空白文字しか含まれていません。)
  14. line 204: (コメント中に `<` や `>` を書くと、いくつかのブラウザを混乱させることがあります。)
  15. 【解決策】line 219: <div> と </div> の間が空です。
  16. line 249: (コメント中に `<` や `>` を書くと、いくつかのブラウザを混乱させることがあります。)
  17. 【解決策】line 298: <div> と </div> の間が空です。
  18. line 322: (コメント中に `<` や `>` を書くと、いくつかのブラウザを混乱させることがあります。)
  19. 【解決策】line 341: <div> と </div> の間が空です。
  20. 【解決】line 348: <a> の href 属性の URI に不明のスキーム名 `feed` が指定されています。【解決策は、単純に feed を削除するだけ】
  21. 【解決】line 348: 空要素タグ <br> を閉じるときは `/>` に空白を先行させましょう。【解決策は、単純に指示に従うだけ】
  22. 【解決】line 350: <a> の href 属性の URI に不明のスキーム名 `feed` が指定されています。【解決策は、単純に feed を削除するだけ】
  23. 【解決】line 350: 空要素タグ <img> を閉じるときは `/>` に空白を先行させましょう。【解決策は、単純に指示に従うだけ】
  24. 【解決】line 350: (<img> には width と height 属性を指定するようにしましょう。) 【解決策は、単純に指示に従うだけ】
  25. 【解決】line 350: 空要素タグ <img> を閉じるときは `/>` に空白を先行させましょう。【解決策は、単純に指示に従うだけ】

上記の問題では、減点されない項目もありますが、一つずつ潰していきたいと思っています。ただ、上記の第 20 項から 25 項は、単純なミスですので即刻修正しました。

No Comments »

サイドバーのメニューをツリー化：tree-maker

投稿日：2007年05月29日
Category: WP Plugins

Movable Type では、知らない人がいないのではないでしょうか・・・「小粋空間」というブログ。既にブログを解説されてから 3 年を経過しているそうです。私も Movable Type を利用している時は、本当に良く参考にさせて頂いていました。

この「小粋空間」では、最近 Movable Type 用で人気のある plugin を WordPress 用にリリースされています。そんな中かで、「小粋空間::サイドメニューのツリー化プラグイン for WordPress」を参考にサイドメニューをツリー化しました。

利用方法は、上記にあるページに、それこそ素晴らしく詳細に記述されていますので、それを参照して下さい。私の場合、ページとカテゴリーに適用しましたが、解説通りに treehandler.js に日本語表記のカスタマイズを実施しただけで見事にツリー化に成功しました。

No Comments »