このむねさだブログを書き始めて後数日で半年が経とうとしています。
前のブログから引っ越してきた3月4日から、毎日更新し続けてきました。
そんな僕が、先日のブログ合宿でみんなに教えてもらった、
知らないとチョット恥ずかしいぞ・・・レベルなことを、
htmlとかの知識が全くなくブログを書いている人の参考になればと思い、ご紹介します。
<h2>タグって文字サイズが大きくなるだけだと思ってた
いきなりですが、<h2>っていうタグがあるのですよ。
なので、僕の中では
<h2>タグ=文字が大きくなるタグ
という認識でいて、結構多用してたんです。
当たり前のことが当たり前じゃなかった
そんな感じでブログを書いていたわけで、
そして誰にも突っ込まれて来なかったので疑問にも思わなかったんです。
それが、先日のブログ合宿でdelaymania.comに寄稿した際、
初めて判明したんです。
何度か説明を受けないと僕も頭で理解できなかったけど、
どうやらWEBの世界では、<h2>は”見出し2”として使うものらしい。
見出しって何だ?
↑これが見出しです・・・。
これまた全く知らなかったのですが、
style.cssというものをいじくることによって、<h2>タグで文字を囲むと
自動的に上のような見出しになってくれるんだと。
そんな貴重な情報、どうして誰も教えてくれなかったのかね・・・。
ってことで、その場にいた切り抜きジャックのタムカイや、
delaymania.comの大ちゃんに教えてもらいながら、CSSと言うものをいじってみました。
とりあえず、<h2>タグはこれまで多用していたので、
これをこのまま見だしとして運用始めるとどえらいことになる・・・。
というのは僕でも分かるので、ソレを回避する方法も教えてもらう。
クラスというものを使って見出しをつくる
h2.mds {
font-size: 150%;
font-weight:bold;
padding:3px 6px;
margin:0 0 10px 0;
border-left:10px solid #7ee028;
border-bottom:1px solid #7ee028;
}
もうね、呪文のようだけどとりあえずcssに上記を追記して、
普段のブログ書いているhtmlの中に、
<h2 class=”mds”>見だし</h2>
と入れるだけで、見出しデザインになるらしい!
そして、文字サイズを変えれるようにこれまたCSSをいじる。
style.cssで文字サイズを変えれるように追記
/* mu_ne3 original style */
.fontLL{
font-size:200%;
}
.fontL{
font-size:175%;
}
.fontM{
font-size:125%;
}
.fontS{
font-size:81.3%;
}
一応4種類のサイズを容易しておきました。
何を書いているのかほとんど分からないけど、これで文字のサイズが変えられるようになったようだ。
ちなみに、文字サイズを変えるときはこういう記述。
<span class=”fontL”>文字サイズ</span>
これで文字サイズが175%の文字が書けるわけです。
見だしを手に入れたぞ
そして、「むねさだブログ」はついに見出しを手に入れた!
いや~!嬉しいな。
そして、これがあるとブログが読みやすくなるので、
ここを読んでくれている人に、もっと読みやすい記事を提供できるじゃないですか!
わんぱくブロガー的まとめ
ブログ合宿ってこういう当たり前だと思っていたことを気づかせてくれる良い機会でした。
みなさんも、当たり前だと思っていること、普段やっている行動を
友人や同僚に見てもらってはどうでしょうか?
非効率だったり、綺麗じゃない仕事の仕方をしているかもしれませんよ・・・。
聞くは一時の恥、聞かぬは末代の恥
どうせなら早めに聞いて効率や品質を高めて行きたいよね。
まだまだ本当に知らないことだらけだけど、
少しずつ勉強しながら見やすく楽しく役に立つブログを書いていこうと思います。