初心者脱却への道?ハイライトを使いこなすべし。-AddQuicktab-

GINJI
GINJI

こんにちは。GINJIです。

「ハイライトが使えたらいいのにな・・・。」

ブログ初心者のGINJIは、そう思っておりました。

文字の太さを変えるだけでは、どうも味気ない。

ハイライトをつけることができたら、文章にメリハリがついて、より見やすいブログ記事を作成できるのではないか。

私はググりました。

するとどうも、「AddQuicktab」というプラグインが、ハイライトを作成するために必要だということを知りました。

そこで再度、ググりました。

すると、とても丁寧にAddQuicktabの使い方を解説してくださっているサイトを見つけました。

この記事では以下、マーカーの追加方法とおすすめのカラーを紹介します。

 

必見!WEBST8のAddQuicktag解説

WordPressを始めたばかりの方にとって、なかなか分かり辛いハイライトの作成方法ですよね。しかし、上記の画像にリンクさせていただいている記事では、とても簡単にかつ分かりやすくハイライトの作成方法を解説してくださっています。

私から説明するよりも、うんと分かりやすいので、ぜひ画像をクリックし、WEBST8でAddQuicktabを導入してみてください。

 

おすすめ3色カラーコード

続いて、私からハイライトにおすすめの3色をご紹介させていただきます。

黄:FFFF99

.marker-yellow {
background: linear-gradient(transparent 60%, #FFFF99 60%);
font-weight: bold;
}

最もスタンダードなハイライトの色です。強調したいときには、ぜひとも使いたい色ですね。

 

青:99ccff1)黄(#FFFF99)の Split Complementary Color (補色の両端にある色)で、補色と異なり色を並べてもちらつかない

.marker-blue {
background: linear-gradient(transparent 60%, #99ccff 60%);
font-weight: bold;
}

続いて青色。肯定的な文章をハイライトする際に用いたい色です。

 

赤:ff9999 2)黄(#FFFF99)の Tetradic Color (4つの補色が十字型に交わる配色。)ですが、黄との間には補色関係がなく、ちらつかない。

.marker-red {
background: linear-gradient(transparent 60%, #ff9999 60%);
font-weight: bold;
}

最後は赤色。何かのデメリットなどを伝える文章で用いたい色ですね。

 

3色は同じ明度なので、3色を同じ記事で用いたときに調和し、目に優しい印象を与えます。もしハイライトの色にお悩みでしたら、ぜひ検討してみてください。

 

参考までに・・・

今回私がカラーコードを入手した先は、「ColorHexa」というサイトです。ここでは検索したカラーコードの補色や類似色を紹介してくれるサイトです。自分だけのハイライトを作りたい方、またウェブのデザインをされたい方は、一度使ってみてはいかがでしょうか。

 

おわりに

いかがだったでしょうか。

色はセンスが問われる、なんてよく言われますが、実はセンスのような曖昧なものよりも、数値といった具体的なもので求められるものなのですね。

この記事が少しでもあなたの役に立っていれば幸いです。

脚注

脚注
1 黄(#FFFF99)の Split Complementary Color (補色の両端にある色)で、補色と異なり色を並べてもちらつかない
2 黄(#FFFF99)の Tetradic Color (4つの補色が十字型に交わる配色。)ですが、黄との間には補色関係がなく、ちらつかない。
タイトルとURLをコピーしました