アフィリエイトブログなどでよく使われる強調表現として「蛍光ペン」があります。それをはてなブログで使う解説をするのですが、太字は太字としても使いたいですよね？ということで、蛍光ペンと太字の使い方を両方解説していきます。
はてなブログで「蛍光ペン」を使う方法
まずは蛍光ペンを使う方法です。
はてなブログを使っていて太字にする場合「B」のボタンを押して太字にすると思います。
これをHTML編集でみるとこのようになっています。
<strong>強調表示</strong>
strongタグで太字が表現されているので、デザインCSSで蛍光ペン部分を作ります。
ダッシュボードの「デザイン」を開いて「カスタマイズ」タブを開きます。
デザインCSSを開いたら以下のコードをコピーして貼り付けます。
.entry-content strong {
background: linear-gradient(transparent 60%, #FFF100 40%);
}
このように貼り付けたら「変更を保存する」をクリックして保存します。
これで「B」ボタンでの強調がこのように黄色の蛍光ペンで強調されるようになります。
はてなブログで蛍光ペンと太字を両方使いたい！
蛍光ペンを使えるのはいいのですが、押し出しがかなり強くなります。
ちょっと弱めの強調には、太字の<b>タグを使えばいいかと思いますが、はてなブログでは<b>が<strong>に変換されてしまいます。
その対策として日本語ではほぼ意味のない<em>の斜体をやめて、太字に置き換えましょう。
先ほどのデザインCSSに以下を追加します。
.entry-content em {
font-style: normal;
font-weight: bold;
}
このようにできたら「変更を保存する」をクリックします。
これで蛍光ペンと太字を使い分けられるようになりました。
ちょっとアイコンの意味が変わってしまいますが、ボタンで蛍光ペンと太字が使い分けられるのは便利でしょう。
<strong>というタグはGoogleの検索エンジンが解釈するときにも使われるので、強調したいときには「B」ボタンで蛍光ペン。<em>も強調の意味を持っているので「i」ボタンで太字ということで問題はないと思います。
はてなブログで蛍光ペンを使う注意点
個人的には、蛍光ペンのようないかにもアフィリエイトブログというデザインは好きではないのがって、あまり使いすぎるのもどうかなと思うところではあります。
ライターの立場からすると「いかにもアフィリエイト」というデザインが本当に効果があるのか疑問に感じます。
しかしながら、蛍光ペンはわかりやすい強調として意味はあるので、普段は普通の太字を使いつつ、ここぞというときに蛍光ペンを使うなら、デザインCSSをこのようにしておくといいと思います。
先ほどのデザインCSSに以下を追加します。
.entry-content em {
font-style: normal;
font-weight: bold;
background: linear-gradient(transparent 60%, #FFF100 40%);
}
これなら普段は太字にしつつ、押し出したいときには「斜体」にすることで蛍光ペンを使うことができます。
ぜひ使ってみてください。
