トップページ修正 - ☆　六等星　〜Second Chapter〜　☆

中々、トップページの改善が進まないので、取り合えず以前指摘して頂いたaltとtitleの部分を修正しました。ご指摘して下さった方、有り難うございました。

さて、そんなわけで、トップページの改装。まずは、現在のトップページを論理マークアップのみでマークし、骨組みを作る。HTMLで余計な装飾はしない。タイトルにＨタグ、リストにＵＬ＆ＬＩタグ、リンクにＡタグ、イメージ表示にＩＭＧタグ、段落にＰタグ……まあ、極端な話これだけでマークアップは出来ます*1。そうして出来た雛形がこれ。

http://www.oekaki.ws/hinagata.html

Body部分のソースはこんな感じ。

<div class="title">

　　　<h1>Paint Shop Pro で遊ぼう！！</h1>

</div>

<div class="menu">

　　　<h2>PaintShopPro</h2>

　　　　　　<ul>
　　　　　　<li><a href="sakusei/index.html" title="イラスト作成リプレイ">イラスト作成記</a></li>
　　　　　　<li><a href="sakusei/kowaza.html" title="簡単小物作成">イラスト小技集</a></li>
　　　　　　<li><a href="hanasi/index.html" title="好き放題、言いたい放題">イラスト座談会</a></li>
　　　　　　<li><a href="haihu/index.html" title="改変・加工可のフリー素材">フリー素材</a></li>
　　　　　　<li><a href="okurimono/index.html" title="本当に有り難うございます！">頂き物のコーナー</a></li>
　　　　　　</ul>


　　　<h2>Others</h2>
	
　　　　　　<ul>
　　　　　　<li><a href="http://d.hatena.ne.jp/usou_tuki/" title="流行のブログです">六等星（日記）</a></li>
　　　　　　<li><a href="http://ex.x0.com/%7Eemperor/oekaki/picture.shtml" title="沢山の人が参加中">共有お絵描き掲示板</a></li>
　　　　　　<li><a href="http://a.hatena.ne.jp/usou_tuki/simple" title="個人的アンテナ">Ｌｉｎｋｓ</a></li>
　　　　　　<li><a href="http://www.oekaki.ws/yomi/y_mail.cgi?id=psp" title="匿名投稿可">メールフォーム</a></li>
　　　　　　<li><a href="info.html" title="一度読めば十分">ご案内</a></li>
　　　　　　</ul>

</div>

<div class="nikki">

　　　<h2>2005年3月28日</h2>

　　　<p><img src="nov050328.jpg" alt="15万打、有り難うございます。" width="700" height="500"></p>
　　　<p>そんなわけで、15万ヒット達成有り難うございました！……う〜ん、何もしないまま月日だけが流れていく（汗）</p>
　　　<p><a href="http://d.hatena.ne.jp/usou_tuki/20040710" target="_blank">100,000Hitした時</a>の志が何一つ出来ていない所に駄目駄目っぷりが伺えますが、これからも気長に見守って頂けると嬉しいです。</p>
　　　<p>あと、レイアウトは暫定です（^^;）ちゃんと弄っている余裕がなかった……ソース的には最悪の状態です。</p>
　　　<p>ＩＥでスクロールさせている時、突如として、ここの文章が消える事があるのは何故だろう……。あと、モジラ系ブラウザだと、最下段の文責部分の上下のラインが表示されない……。</p>

</div>


<div class="bunseki">
	
　　　<address>管理人：霜月（雨相 月）<br>
　　　電子メール：<a href="mailto:psp@s36.xrea.com" title="霜月へメールを送信">psp@s36.xrea.com</a></address>

</div>

……うん。何だか、これはこれでシンプルでいいかも（笑）

で、文章の意味をＨＴＭＬでマークアップしたら、今度は見かけをスタイルシートで定義していく。……この段階で現在思案中（苦笑）

*1:本当は、あと、文責部分にaddressタグも使っています