ファンブログのスキンはHTMLとXHTMLが混在している

ファンブログのスキンのXHTMLとHTMLの混在について。開始タグと終了タグに関しての整合性エラーの直し方。

スポンサーリンク


2014年1月22日にA8.netのファンブログはSeesaa Blogのシステムをベースにして生まれ変わりました。よってファンブログ関連の記事は今では当てはまらない可能性があります。新しいファンブログのカスタマイズは別ブログ「ファンブログ テック」で詳しく書いていますので、そちらをご覧ください。

ファンブログ

管理ページのリンク元URL一覧に珍しくファンブログ内からのリンクがあったのでクリックしたら
パソコンを便利に!!というブログに着きました。

その記事「ブログのタグ対応の間違いの直し方」のコメント欄からリンクを張られていたのですが、
読むと、ソフトを使ってタグ対応をチェックした結果が書いてありました。

今、右サイドバーに「プロフィール」だけを表示しています。
この「プロフィール」が無い状態だと、この記事にあるように
エラーなしです。
ところが「プロフィール」を表示すると、エラーが13個・・・(^_^;

とのこと。
ファンブログのスキン(テンプレート)は冒頭に

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

と書かれています。これはXHTMLの宣言です。
つまりファンブログのスキンはXHTMLで書かれています。

詳しい説明はしませんがXHTMLHTMLは違うものです。
そして、自動で出力される「プロフィール」のソースはなぜかHTMLで書かれています。
その結果、厳密な判定をすると「プロフィール」の中で13個のエラーが出ます。

HTMLとXHTMLの違い

XHTML
空タグの最後にスラッシュがなくてはいけない。
 <br />&nbsp<img src=”http://…” alt=”” />
HTML
空タグの最後にスラッシュはいらない。
 <br>&nbsp<img src=”http://…” alt=””>

自動で作成される「プロフィール」のフォーマットは変更できません。
そこで、スキンの冒頭部分のdoctype宣言をHTMLの物に代えてテストしてみました。
すると別の箇所でエラーが出ます。何故でしょう。

ファンブログのスキンそのものは前述の通りXHTMLで書かれています。
ですから、スキンを直す際はスキン中の全ての空タグの末尾からスラッシュを取り除く
必要があります。

厳密に訂正するならスキンの次の2つを直さないといけません。

ここではHTML4.01にして説明しますが、これからやるのならHTML5にした方が良いと思います。ただしHTML5とHTML4ではまた違うのでもっと多くの作業が必要になります。

1.doctype宣言をHTMLのものに変更する。

スキンのdoctype宣言とhtmlの開始タグ

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">

これをHTMLのものに変更

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">

2.スキン内の全ての空タグから末尾のスラッシュを削除する。

<meta … /> を <meta …> に
<link … /> を<link …> に
<br /> を <br> に
<img … /> を <img …> に
など

こうすれば開始タグと終了タグに関しての整合性エラーはなくなると思います。
(が、勝手ながらテストはしていません。)

ただし、そこまで厳密にしなくても動くので、システム開発者でもないのなら気にしないで
いいと思います。


関連コンテンツ

スポンサーリンク

「ファンブログのスキンはHTMLとXHTMLが混在している」への1件のフィードバック

  1. Tomさん、こんにちは(^_^)
    ブログを紹介していただいて、ありがとうございます。

    私のブログにいただいたコメントとこの記事、とても解りやすくて
    勉強になりました。

    最近、ブログのカスタマイズにハマっているので、また勉強しに
    きます(^.^)/~~~

コメントを残す

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください