今回はBlogの書き方の中でも、文章ではなくてタグまわりについて。
使用タグ
＜A＞（リンクタグ）
ブラウザは「Firefox」ラブです。リンクタグを作るときは「Make Link」というアドオンを使っております。テキスト選択して、右クリックから「Make Link →HTML」と選択すると、
＜a href=”http://blog.idezawa.info/archives/51604054.html”＞社会人の為の「ガンダム」で学ぶ丁寧な言葉づかい＜/a＞
が、クリップボードにコピーされます。あとはペーストするだけ。この書式もいろいろいじれるのですが、基本的に初期設定のまま使っています。これを使うと、次のようなシンプルなリンクがはき出されます。
基本的にテキストベースなので、これぐらいで私は十分です。
もし、目を引くリンクを作りたければ@hiro45jpさんの「ShareHtml（サイト情報取得）」を使われると良いと思います。
社会人の為の「ガンダム」で学ぶ丁寧な言葉づかい : ライブドア社長ブログ
「ザクとは差異がございます、ザクとは」
(ザクとは違うのだよ、ザクとは)
名言すぎる
こんなのがサクッと作れます。便利という言葉ではまったく表現しきれないブックマークレットです。
文字総力周りのタグ
続いて、文字周りのタグ。
基本のタグ
基本的に使っているのは、
- ＜H３＞（見出し）
- ＜H４＞（小見出し）
- ＜Blockquote＞(引用)
- ＜Div＞（編集後記の囲い）
- ＜Ul＞（リスト作成）
- ＜Li＞ （リスト項目）
- ＜Strong＞（太字）
これだけ。普通のテキストエディタ(Macならmi)で書きながら、打ち込むこともあれば、書き終えてwordpressの画面上で調整しながらタグ付けすることもあります。イメージファイルはwordpressから入力が基本です。
ちなみに、見出しとか引用のタグはATOKに単語登録してあります。
デザイン周り
ちなみにデザインは、＜H３＞は大きめの区切りになるので文字サイズ大きめで、青色のbackgroundを指定してあります。細長い付箋を貼っているようなイメージですね。
＜H４＞は中ぐらいの区切りなので、色は使わずにフォントをBlodにして、実線ではなくダッシュでやわからめの区切りを意識。
＜Blockquote＞は引用ということがはっきり分かるように、広めのインデントと背景色を変えてあります。色はメインカラーである深めの青ではなく、明るめの青。この位の色でないと、上にのる黒字が見えにくいです。
（参考例）「ザクとは違うのだよ、ザクとは」
＜Div＞はあんまり書いてませんが、編集後記用につかいます。全体の文脈と違う事を書くので明確に違うデザインにしてあります。
あとは、すべてプレーン。
さいごに
びっくりするぐらい短い記事ですが、言いたいことは一つだけです。日常的に使うタグは数を絞ったほうが良い。
アドオンを使ったり、ブックマークレットを使ったり、ATOKなどを使ったりと、補助してくれるものはいくらでもありますが、使うタグを最小限にしておく、というのが一番手っ取り早いことだと思います。
▼こんな一冊も：
現場のプロから学ぶXHTML+CSS |
|
 |
益子 貴寛 堀内 敬子 小林 信次 千貫 りこ 伊藤 学 山田 あかね 西畑 一馬 CSS Nite
毎日コミュニケーションズ 2008-11-11 |
| できる大事典 HTML & CSS |
|
 |
佐藤 和人 できるシリーズ編集部
インプレスジャパン 2006-04-27 |
| WordPress レッスンブック 3.x対応 |
|
 |
エビスコム
ソシム 2010-09-08 |
| ホームページ制作講座セット:ドリームウィーバー8講座+HTML講座(基本編・応用編)+CSS講座+フォトショップCS3講座+イラストレーター講座+デザイン講座基本編+合成写真講座 [DVD] |
|
![ホームページ制作講座セット:ドリームウィーバー8講座+HTML講座(基本編・応用編)+CSS講座+フォトショップCS3講座+イラストレーター講座+デザイン講座基本編+合成写真講座 [DVD]](http://ecx.images-amazon.com/images/I/51XG8RRMgmL._SL160_.jpg) |
株式会社ウォンツ 2007-12-10 売り上げランキング : by G-Tools |
| 機動戦士ガンダムDVD-BOX 1 特典フィギュア付(完全初回限定生産) |
|
 |
安彦良和
バンダイビジュアル 2006-12-22 |
1件のコメント