Livedoor テンプレート コントラスト メニューバー
私の動向に詳しい方なら、当ブログアクセスした瞬間に大きな驚きを体感したでしょう。
今日まで私のブログのデザインは、横野真史公式ブログの色違い版でしたが、そろそろデザインを変えたくて、ライブドアの公式新デザインテンプレートを採用。
流行の簡素なデザイン「フラットデザイン」をめざし、本家ブログとの差別化。

このデザインの目玉である「公式メニューバー」機能を試用する意味も兼ね、大胆にも衝動的な変更。
しかし、その後の苦しみも大きかったのです。
"タイトル画像問題"、"ヘッダーとタイトルの隙間が開きすぎ問題"。
いずれもなんとか理想に近い形に改善できました。

手段としては、本家ブログのHTMLと比較しながらの微調整の繰り返し
自分でデザインをいじるのって、大変。
みなさんのブログはテンプレ未改造のままですよね。

おまけ程度に旧デザインのスクリーンショット。

ライブドア デザイン


このデザインも、自分で改造を頑張りました。
みなさんはテンプレそのまま未改造で流用しますが、私は選んだテンプレを更に手を加えないと満足しない気質でして。

そのときの苦労話です。
http://deathmetal.blog.jp/archives/28769207.html



追記: 2月6日17時
気付いたのは、ブログで記事の投稿時間表示が年月日までで、時刻が出ないこと。
個人的に気持ちが悪いし、他のブログを見ていて、そういうブログを見ると気分が悪いので、自分は直そう、ということで原因究明。
    <p class="article-date"><time datetime="<$ArticleDateISO8601$>" itemprop="datePublished"><$ArticleDate$></time>
とあり、</p>との間に<span class="article-time"><$ArticleTime$></span>を挿入。
すると、時刻が表示された。 

上記のように、 些細な変更も相応の知識量が必要となる。
みんな私の苦労を知ってね。 



追記: 2016年1月21日
妙に画像の前後領域に間が開いたり、変なリンク位置の増設など起こるもので、元々悩んではいたところ、画像<img>タグに自動で付される class="pict" なるものが厄介者ではないかと気付き、CSSを覗いたところ、見事に的中していた。
.article-body-inner img.pict {
    margin: 55px 0;
このうち、 margin: 55px 0; の数字を任意のものに指定すれば、無駄な余白などは減るか、無と帰し得る。
私の場合は12pxとしておいた。