Seesaaブログのタイトルを画像にしてみる

2013年04月13日
ブログのタイトルを画像にしてみるブログのタイトル(1)を作ったロゴ画像に変更してみます。

デザイン > コンテンツの「ブログタイトル」内のHTMLを修正します。
初期値は以下のようなかんじ。
<​h​1​>​<​a​ ​h​r​e​f​=​"​<​%​ ​b​l​o​g​.​p​a​g​e​_​u​r​l​ ​%​>​"​ ​a​c​c​e​s​s​k​e​y​=​"​1​"​>​<​%​ ​b​l​o​g​.​t​i​t​l​e​ ​%​>​<​/​a​>​<​/​h​1​>

<​%​ ​b​l​o​g​.​t​i​t​l​e​ ​%​>​の部分を<img>タグへ変更すればいいんだけど、
ここで一点気になるところが。
このブログタイトル...<h1>タグになってる!
<h1>タグとはそのページの大見出し。そのページがどんな内容のものなのかを一番説明しているテキストに付けられるべきタグです。
ブログの場合、ブログタイトルよりも記事のタイトルが<h1>タグのほうがふさわしいのでは!

記事タイトル(2)のほうはどうなってるかと見てみると、
(デザイン > コンテンツの「記事」)
<h3 class="title"><a href="<% article.page_url %>" class="title"><% article.subject %></a></h3>
<h3>タグ。

不満です。

なので(1)のタイトルロゴは#logoというIDを付け、(2)の記事タイトルを<h1>タグに、修正しました。
カスタマイズ後の値は以下のようなかんじ
(1)ブログタイトル
<div id="logo"><a href="​<​%​ ​b​l​o​g​.​p​a​g​e​_​u​r​l​ ​%​>​" ​a​c​c​e​s​s​k​e​y​=​"​1​"​><img src="http://画像のURL" alt="Kuma Kuma Factory" border="0" /></a></div>

(2)記事タイトル
<h1 class="title"><a href="<% article.page_url %>" class="title"><% article.subject %></a></h1>

ブログのタイトルを画像にしてみるあとはデザイン > デザイン設定で(1)は#logo、(2)はh1でcssを整えれば
←こんなかんじになります。
posted by シュガリー at 21:39 | Comment(0) | TrackBack(0) | ブログのカスタマイズ | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
Name *
Mail
Website

×

この広告は1年以上新しい記事の投稿がないブログに表示されております。