30代独身オタの哀愁

消化試合を生きる

目が覚めたらHTMLタグが軒並み非推奨になっていた

去年くらいから考えていたサイトの再構築を、今年になっていよいよ本格的に開始した。

特にこのブログからリンクしたことはないが、自分のサイトは1998年から実に18年も続いている。

サイトの見た目が5世代くらい前の印象を与えるチープなものなので、刷新しようと思ったのが今回の再構築の趣旨だが、古いのは見た目だけではなかった。

HTMLもまた旧石器時代。薄々気付いてはいたのだが、当時使っていたタグは軒並み非推奨になり、思ったより遥かにブラウザに「なんとか表示してもらっている」状態だった。

一例として抜粋する。

 

<html>
<head>
<style type="text/css">A:link{text-decoration:none}</style>
</head>

<body bgcolor="#ffffff" link="#0000ff" vlink="#0000ff" alink="#ff0099">

<br><br><br><br>

<center>

<img src="images/logo.jpg"><br>
<img src="images/RedLine.jpg">

<br><br><br><br><br>

<font color="#447700">- Since 1998.10 -</font><br><br><br><br>

<a href="title.htm"><font size="4">[ Enter ]</font></a><br><br><br><br>

</center>

</body>
</html>

 

<center>タグや<font>タグ、<body>タグのvlink属性やalink属性は、すべて非推奨になっている。

また、当時から推奨されていたわけではないが、よく見られた<br>の連続も見るに堪えない。

とりあえず書き直してみた。

 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<style type="text/css">
<!--
a:link {
color:#0000ff;
text-decoration:none;
}
a:visited { color:#0000ff; }
a:hover { color:#ff0000; }
a:active { color:#0000ff; }
body {
background-color:#ffffff;
margin-top:8em;
text-align:center;
}
-->
</style>
</head>

<body>

<p><img src="images/logo.jpg"></p>
<p style="margin-bottom:4em"><img src="images/RedLine.jpg"></p>

<p style="margin-bottom:3em">
<span style="font-size:100%;color:#447700">- Since 1998.10 -</span>
</p>

<p style="margin-bottom:3em">
<a href="title.htm"><span style="font-size:120%;">[ Enter ]</span></a>
</p>

</body>
</html>

 

これでも正しい、もしくは及第点のHTMLなのかは自信がないが、前よりはずっと良くなったと思う。

ただ、18年の歴史があり、今でもなお更新し続けているサイト。

HTMLファイルが1,000個近くもある。すべてを書き直すのは到底無理だ。

どうしたもんかなぁ。