ブログに使える簡単なタグ4選とSeesaaブログのデザインについて

最初はSeesaaブログ備え付けのテンプレートにタグなし改行しまくりでスタートしたこのブログ。

調べていたらどうやらあまりよろしくないようだったので、ここ数日で色々と変更した。

 

スポンサーリンク

 

ブログに使える簡単なタグ4選

<p> ~ </p>

段落わけタグ。

最近はスマートフォンからブログを読む人も多いので改行タグ(<br>)を使うのはよろしくないらしい。(改行を使うのは住所や詩などの必然性があるときくらいなんだと)確かに改行するより段落わけした方が変なところで切れずに読みやすい。

またCSSの方でclass名を指定して、class毎に下スペースの広さを指定してそれまでの改行の代わりとした。

 

<h1> ~ </h1>

見出しタグ。

この記事だとタイトル部分と、「ブログに使える簡単なタグ4選」「Seesaaブログ新デザイン向けのカスタマイズテンプレートを使う」「おわりに」部分。このタグは番号が若いほど重要なことを示すので、タイトル部分は自動で<h1>に囲われるよう設定し、記事内では基本的に<h2>を使っている。

 

<ul><li> ~ </li></ul>

箇条書きタグ。

この記事で使用。最初は横並べに読点(、)で書いたんだけれど、箇条書きにしたらかなり見やすくなった。1つの項目を<li>でそれぞれ囲んで、全体を<ul>タグで囲む。

 

<ol><li> ~ </li></ol>

箇条書きの先頭へ順番に数字をつけるタグ。

この記事で使用。使い方は上記の箇条書きタグと同じ。ただし全体を囲むのが<ol>になる。

 

参考にしたのは

https://naifix.com/br/

http://pointsite-net.info/category/customize/

http://www.tagindex.com/html_tag/attribute/class.html

など。他にもあるんだけれど見て閉じてしまったりしたので。

 

スポンサーリンク

 

Seesaaブログ新デザイン向けのカスタマイズテンプレートを使う

Seesaaブログの備え付けテンプレートは正直古臭くてあまり見やすくもなかったのでどうしたものかと悩んでいた。

テンプレートが配布されているのは知っていたがどうも更新がだいぶ前のところが多い?と思って自分でなんとかしようとするもののなかなか進まず。

そんなときどうやらSeesaaブログは最近完全に新デザインシステムに移行したらしいと知り検索ワードに新デザインを加えたら以下のサイトを発見。

Seesaaブログ:新デザインシステム向けカスタマイズテンプレートの配布

(今検索すると新デザイン入れなくても出てくるけど、検索がGoogleにカスタマイズされたのか?それとも見落としてただけ?かな)

ありがたく使ってます。上記のタグを使ううちにCSSなど色々いじりはしたけれどね。自分だけでなんとかしようとしたら何ヶ月もかかっていたかもしれない。

 

ただ実はまだ解決していないことが1つ。

グローバルメニュー(フィギュアスケート、ハロプロ、パソコン・デジモノ、このサイトについての部分)の下部分にスペースを作りたいのだけれど、うまくいかない。

いや、パソコンから見れば一応うまくいっている。でもスマホから見たとき、MENUを押すとそれぞれの項目の下まで空白になっちゃって見栄えが悪いんだよね。

多分もっとスマートなやり方があるんだろうけどまだわかってない。これが今の課題だなあ。

※追記※
解決しました。下の記事に詳細を書いてます。

hタグの使い方について再考する
以前書いたこの記事↓ にて「グローバルメニューの下部分にスペースを作りたいけどうまくいかない」と書いた。 その問題がhタグ(見出しタグ)で解決したので、今一度hタグについて考え整理してみたいと思う。 そもそもhタグとは何なのか? 見出しタグ...

 

おわりに

たかがブログだけれどされどブログで、今の時代はホームページを作らずともある程度htmlタグの知識がないとダメなんだなと痛感。

とはいえ昔ホームページを作った経験(ただタグをコピペした荒削りな趣味サイトだけど)もあり、タグに関して抵抗なく使えたのはよかった。なんなら久しぶりに触って少し楽しいくらい。

いつまで続くかわからないけど記事を書くこともがんばります。

タイトルとURLをコピーしました