殺風景な記事にさらば！装飾に統一感をプラスして読みやすさアップ！

最近、更新に気をとられ記事の装飾がおろそかになっていました。

ちょっと寂しいので装飾を施そうと思います。

当初、テーマ「affinger5 wing」に、デフォルトで入っている装飾を使用していたのですが、統一感はあまりありませんでした。

そこで今回は、当ブログの基本色である「青」をベースに、パーツの色を少し変更して統一感を出したいと思います。

記事の基本的ルールについて

当初は、装飾をしていたんですが、使いたい所に使いたいものを使うといった感じで装飾をしていました。

そのため、記事に統一感がありませんでした。

今回は、全体の統一感を意識して調整します。

当ブログのイメージカラー

当ブログの色はテーマ「affinger5 wing」デフォルトの色となります。

• #039be5　少し濃い青（ちょいダーク）
• #13b0fc　少し明るい青（水色に近い）
• 黒
• 白

です。

（#f58300　補色はオレンジ、リンクなどと区別が付きづらい場合などに使用）

記事装飾は、統一性を高めるため青をメインに使います。

これらが及ぼす影響はわかりません。

あくまで、統一性を重視しています。

本文について

本文は、そのままベタ打ちで入力。

色は#444141（濃いグレー）。

基本、見出しの下は行間をあけずに打ち込み。

各見出しの終わりは、1行文あける。

ですが、単純にスクロール量が増えるので当ブログでは多用しないように注意します。

文中は読みやすいように適度に1行分あけます。

記事の装飾について

記事の装飾は統一感を出すために、既存の装飾パーツを一部色を変えて使用します。

テキストの強調について

テキストの強調は、基本、

・青マーカー（細）

・青字ボールド

を使用。

また、ボールドは<b>タグを使用。

囲み枠について

囲み枠は、なるべく見やすいものを使用します。

また、多色使いにならないよう注意します。

新規タグ（quicktags保存）

統一感を出したかったので、アイコンとボーダーの色を基本色の青に変更しました。

ショートコードはプラグインaddquicktagで管理しています。

タグ→テキストパーツ→クリップメモ（テキスト）→〇〇

注意は、既存のパーツを使います。

おすすめ記事（カード）

ブログ内リンクです。

見た目はいいですが、少し大きいので、文中の使用は禁止。

各見出しの終わりなど、キリの良い所での使用に限定します。

次点：タグ→テキストパーツ→まるもじ（小）→〇〇

ワンポイントに使えそうです。

ワンポイントに使えそうです。

記事装飾に統一感をだして、視覚的にも読みやすさアップ！

今回は、既存パーツの色変更程度でしたが、今レベルの記事なら十分…ということにしておきます。

ブログの基本色である「青」で統一できたので記事自体、視覚的にも読みやすくなったのではないでしょうか。

まだ、cssやショートコード？などは超がつく素人なので、細部をちょこちょこっと調整出来るくらいの知識は覚えておきたいですね。