STAR LIGHT PARADE CSS
一応cssと間違いのないHTMLできちんとお同じ事を出来ますよと言う例で…
正直、かなりの手抜き作業です。作業完了までが約30分です。そのうち作り直します。
（コンテンツそのままコピーしました、ごめんなさい）
投稿者 baban 2007/04/27 at 22:19
SLPのタグ設計に関して。
正直な話、タグの設計を最初から正しくやろうというのは、なかなか難しいんですよね。
(でもどうしてこれで、PHPとかを仕事で使う事が出来たんだろう…。正直グレンラガンというよりキャベツレベルで壊れていますから)
一応、今日から出来る範囲の正しいタグの組み方。
- まず、DTDを当てる
-
おそらく現段階でXHTMLにする事を求めるのは難しいのでしょうから、HTMLのバージョンは4.01Translationで逃げることになるのだろうと思います。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional/EN" "http://www.w3.org/TR/html4/loose.dtd">を
<html>の前に挿入してください。 - タイトルがあると良いです。
ページ最初の見出しはh1(header)タグを、日付の所にh2タグがあると良いのです。
- fontタグは全廃を目標に
-
もし少しだけスタイルシートを学ぶ気があるなら、全廃する事をお勧めします。正直これは格好悪いので。
STAR LIGHT PARADEのタグ周りは、ざっと見た感じでは
- フォントサイズ4が文字の基本の大きさ。
- 強調したいときはフォントサイズ5（亜種もあり）
- 特に強調したいリンクもフォントサイズ5で指定
等ですが、emタグとstrongタグで代換えして全く問題ないなぁ…と言った印象です。
- エントリーを区切る
-
あとは、１日ごとのコンテンツですが、hrタグで区切るのをやめてdivタグで囲う方法をお勧めします。
クラス名にはentryとかnewsとかtopicとか、そんな感じでよいのではないでしょうか？
あと、比較的大きなHTMLのミスですが、人のサイトからの引用を行ったときの引用符ですが
> 日本政府はこの問題にこだわることなく輸入条件の緩和を認めるよう、改めて要請した。 <br>
ジパング舐められてるよ、ジパング。<br>
引用符は、そこは「>」を使うのが適当です。気持ちは分かりますが、ちょっと致命傷。(でも、なんか今日作業したら直ってましたね。
ほかにもあるのですが、あれもこれも直す事より、要点だけしっかり直すほうが大事な気もしますので、ここらへんで…。
投稿者 baban 2007/04/27 at 20:51
さて、STAR LIGHT PARADEのタグでも直してみようか。
さて、STAR LIGHT PARADEのタグでも直してみようか。
以前、掲示板でアドバイスとかした手前、少しあちらのお手伝いでもできないかなーとか、思ってSTAR LIGHT PARADEさんのタグを見直してみました。
正直なところ、いまさら正しいタグと言われても、プログラムでテキストを入れ替えれば、情報を書き換えることはできても、情報を新しく入れることは結構難しいですから、まぁ、fontでされているデザインを変えて、DTD付けて、１日分のトピックをdivタグで囲んでもらって、ソレで終わりかな…とタグを見る前はそう思っていたのです。
実際の所、HTMLの中身を見てみたところ…。
うん、まぁ分かる。DTD(定義型宣言)入れていないのは。初めから予想していた。
headタグの中にtitleタグ以外情報入れていないのも予想内だ。
fontタグとaタグとbrタグ以外見あたらないのも予想通りなんですが…
なんでっ
お前はっ！
fontタグすら
閉じていないのだぁぁー！
今までも時々酷いタグのサイトに出会いましたが、この次元は久しぶりです。というかfontタグを閉じないのが当たり前というのは初めての体験です。
この後もすごいのですが
…タグが入れ子になっていない。どうしてこれに気づかないで平然と作業できるんだこの人は…。
htmllintにかけて
-101点とか以前の記事でありましたが。
おそらくこれは、topに載っている２日分程度の内容を通した結果なのではないでしょうか？
ご存知の方も多いかもしれませんが、htmllintは減点方式のプログラムです、酷いhtmlは内容が長い程さらに減点を積み重ねていきます。
過去ログの一月分の日記をlintにかければ、おそらく-1000点以上も夢ではないでしょう…。
しかも、ほとんどfontタグとaタグとbrタグしか使っていないのにです…。
ってゆーかエディタのマクロで入力しているって言いますが、まずHTMLの何を勉強して、このような入力体系ができたのでしょう。
私初心者時代に始めて本買って手入力していたときも、こんな酷いタグは書かなかったんですけどねぇ…。
うーん。アドバイスするつもりが…正直路頭に迷ってしまった感じがあります…。直せるところだけ直してあとは諦めるしかないんですが、終了タグが当たり前に無いとタグが入れ子になっていないというのが困った。
投稿者 baban 2007/04/25 at 22:20
一応回答しておく。
見やすくなりました！ けど、ＡＡがBOXからはみだす
んーうちがMozillaの1.7.8だからかな
的確な指摘ですが、正解は仕様です。
preタグ使うとこうなるのですが、これが正しいやり方なのでしょうがない。
まぁ巨大ＡＡは使うなって事ですね。
投稿者 baban 2007/04/24 at 20:34