strongとemで強調する

文字の強調について説明します。

強調のemは、pxのように数値の単位として使われるemとはまた別で、「<em>A</em>」と記述することにより、Aと言う文字を強調させる事ができ、強調された文字は斜体になります。

strongタグは、「<strong>A</strong>」とすることで、Aという文字をより強調させる事ができ、強調された文字は太字になります。

強調というのは具体的には、そのページ上の全単語に対するその単語の重要度を高めるという意味であり、検索エンジンで検索される際に、強調を使わないよりもemやstrongで強調したほうがAという単語の重要度が上がり、検索されやすくなります。

あくまで比率の問題で、100単語中2回strongを使ったときと50単語中1回strongを使ったときは大体同じだし、100単語全てをstrongでくくればstrongの効果は皆無です。

実際emでチマチマ強調するより、strongをピンポイントに使うほうが効果があるように思われるので、strongのみサンプルに導入します。

タイトルに指定したキーワードの重要性を補佐する目的で、同じキーワードをstrongで囲い、class="b1"を指定しました。 

<html>
<head>
<title>ホームページ作成講座</title>
<meta http-equiv="Content-Type" content="text/html;charset=shift_jis">
<link rel="stylesheet" type="text/css" href="style/style.css" media="all" />
</head>
<body>
<h1><a href="index.html"><img src="gif/7.gif" alt="ホームページ作成講座" /></a></h1>
<p id="a1">｜<a href="index.html">HOME</a>｜<a href="#">Lesson1</a>｜<a href="#">Lesson2</a>｜<a href="#">Lesson3</a>｜<a href="#">Lesson4</a>｜<a href="#">Lesson5</a>｜</p>
<p><img src="gif/6.gif" alt="境界画像" /></p>
<p id="a2">>>　<strong class="b1">ホームページ作成講座TOP</strong></p>
<h2>INFORMATION</h2>
<ul id="d1">
<li>ホームページを更新しました。</li>
<li>ホームページを終了しました。</li>
</ul>
<h2>Lesson1：メモ帳を起動してみよう！</h2>
<p class="a3">ホームページを作成するためにはエディタと呼ばれるアプリを起動して、そこにプログラムを記述します。</p>
<p class="a3">Windowsをお使いの方は標準で付属しているエディタとして、メモ帳とwordpadがありますので、それを使うとよいでしょう。</p>
<p class="a3">さらに高性能のエディタをお求めの方は、無料ならterapad、有料なら秀丸エディタがお勧めです。</p>
<h2>LLesson2：タグを書いてみよう！</h2>
<p class="a3">ホームページを作るのに使用する言語はHTMLと呼ばれ、タグと呼ばれる命令を使って、色やフォントの大きさを指定することができます。</p>
<p><img src="jpg/1.jpg" alt="メモ帳に記述" /></p>
<h3>＜文字の大きさを変える＞</h3>
<p class="a4">文字の大きさは、font sizeタグを使用します。</p>
<h3>＜文字の色を変える＞</h3>
<p class="a4">文字の色は、colorタグを使用します。</p>
<p class="a3">ホームページ作成に使われるタグは文字の装飾だけに限らず、背景や画像、ページの骨格を指定するものもあります。</p>
<address>Copyright 2007@nkdesk. all right reserved.</address>
</body>
</html>

そして、CSSファイルにstrongのスタイルを追加します。

先ほど説明したとおり、デフォルトで太字なので、スタイルシートでnormalに直します。 

strong.b1 {
	font-weight:normal;
	}

ここまでの作成経過はコチラ→サンプル（ホームページ作成講座）

Lesson4～スタイルを細かく指定する～

コメントor補足情報orご指摘あればをお願いします。

（件名or本文内でキーワード検索できます）



  • << 前のページ
  • 次のページ >>
ページトップへ