はてなダイアリーガイド「日記の中で使うタグ(1)」

はてなダイアリーガイド「日記の中で使うタグ(1)」

(コミュニティ)
はてなだいありーがいどにっきのな

ガイドトップへ・ ガイドトップ ・ 目次 ・ 索引

その他、はてなダイアリーで日記を書いていく上で使えそうなタグを紹介していきます。日記の中で使えるはてなの省略記法(※ヘッダやフッタでは効きません)がある場合は、それも紹介していきます。

用語:「要素」

よく出て来る基本用語の説明です。

〜前略〜
<title>はてなダイアリー - キーワードでつながる面白ブログ</title>
<h1>はてなダイアリーへようこそ</h1>
<p>はてなダイアリーはキーワードでつながる面白ブログ。</p>
<p>「基本的な操作はシンプルに、複雑な"やりたいこと"もしっかりできる」そんな考え方で作られています。</p>
〜後略〜

のような文書があったとして、<title></title><h1></h1>の部分が「タグ」ですよね。

このとき<title>はてなダイアリー - キーワードでつながる面白ブログ</title>の部分ひとまとまりを「title要素」と呼びます。<h1>はてなダイアリーへようこそ</h1>の部分は「h1要素」です。その下の2行は両方とも「p要素」になります。

タグで囲まれた部分が要素とも言えますが、画像を貼ってみるで出てきたimgタグ(img要素)のように、タグが1個ですんじゃう例外もあります。

要素と言うのはつまり、ウェブページを構成する要素であるということです。逆に言うと、たくさんの要素が集まって1つのウェブページ(1つのHTMLファイル)になっています。タグというのはある「要素」がどこからどこまでか、場所と範囲を示すための“目印”ということになります。

この先、説明文の中で「○○タグ」と言ったり「○○要素」と言ったりすることがあると思いますが、意味はそういう違いです。

文の一部を強調してみる(emとstrong)

emタグとstrongタグを書いて、文章の一部を強調してみましょう。やりすぎると効果が薄れますけど、要点がわかりやすくなり、文章にメリハリがついて読みやすくもなります。標準の編集画面では、入力支援ボタンでも入力できます。
「em」は"emphasis"で「強調」、「strong」は"strong emphasis"で「さらに強い強調」です。

ムーミンの「フローレン」が昔のアニメ版で「ノンノン」だったことは有名だが、<strong>原作では「スノークのおじょうさん」</strong>であることを強調しておきたい。<em>スノークは種族名である。</em>

のように書くと、

ムーミンの「フローレン」が昔のアニメ版で「ノンノン」だったことは有名だが、原作では「スノークのおじょうさん」であることを強調しておきたい。スノークは種族名である。

のようになります。ポイントとしては「斜体」や「太字」のように見え方が決まるわけではなくて、日記で使用しているテーマや、閲覧者のブラウザによってどのように強調されるかは変わってきます(画像表示のない音声ブラウザや、検索エンジンによるページ解析などでも、そこが強調された部分であることは認識されるそうです)。
自分の日記のem要素やstrong要素が、ウェブブラウザでどう見えるかを指定したいときは、応用編「文章中の文字を強調してみよう」を参考にスタイルシートを書いてみてください。

補足:タグのかけ違いに注意

<a><strong></a></strong>
↑こういうふうに、タグが交差してしまう書きかたは間違いです。
<strong><a></a></strong>のように一方が完全に中に入るように、または
<strong></strong><a></a>のように、どちらも含まれないような関係にします。

削除と修正をするときは(delとins)

文章をあとから書き変えたときに、消した部分をdel要素、追加した部分をins要素にします。このふたつのタグも標準の編集画面では、入力支援ボタンで入力できます。

超電磁さんの日記にコメントしようと思ったら、書き込めなくなっていた。どうやら私はコメント拒否ユーザーに指定されてしまったらしい。何か気に触ることをしてしまったのだろうか。

という文章を

超電磁さんの日記にコメントしようと思ったら、書き込めなくなっていた。<del>どうやら私はコメント拒否ユーザーに指定されてしまったらしい。何か気に触ることをしてしまったのだろうか。</del>
<ins>追記:ごめんなさい、私がログインするのを忘れていただけでした!</ins>

と書きなおすと、

超電磁さんの日記にコメントしようと思ったら、書き込めなくなっていた。どうやら私はコメント拒否ユーザーに指定されてしまったらしい。何か気に触ることをしてしまったのだろうか。
追記:ごめんなさい、私がログインするのを忘れていただけでした!

のようになります(これも、打ち消し線や下線が引かれると言ったような見た目を指定するためのタグではありません。テーマやスタイルシートで見た目は変わります)。

登録後、ふたたび編集画面を見るとdelタグが<del datetime="2005-03-07T09:04:43+09:00">、insタグが<ins datetime="2005-03-07T09:04:43+09:00">のようになっています。これは日付と時刻を表す記述(参考リンク)で、はてなダイアリーの修正時刻保存機能によって自動的に登録時の時刻が記録されるようになっています。


フォームを使ってみるに戻る← | →日記の中で使うタグ(2)に進む


新着ブログ: はてなダイアリーガイド「日記の中で使うタグ(1)」