サバのトランク

本やコンピュータや病気のことなど *当ブログではアフィリエイト広告を利用しています*

ブログのデザインテーマ変更

PCの画面を見つめる少年

去年の11月以来、このブログでは "Color Book" というデザインテーマを使っていたのですが、久しぶりに変えてみました。
今回使わせて頂いたのは、かなりシンプルな公式テーマ3位の "Life" です。

これまでの "Color Book" もトップページでは大きいアイキャッチ画像にタイトルしか表示しないなど、なかなかシンプルでクールなデザインだったのですが⬇️

colorbookデザインテーマ

 

先日の記事で書いたように、はてなブックマークを見逃していたということがあったので、その情報などがタイトルを見るだけでわかるものにしようと思っていました。
また、最近のバッチファイル関係の記事では、1行が長いコマンドラインがあり、1行の文字数が多い方が良いなと思っていたところでした。

その他にも気にした点はあります。上記の件も含めてまとめると、

・デザインのカスタマイズなどがスマホにも反映される「レスポンシブデザイン」に対応していること
・トップ画面の記事の一覧に、はてなブックマークの状況、「記事の概要」など多くの情報が表示されること
1行の文字数が多いこと(PC版)

以上のような条件で探してみて、とてもシンプルな "Life" に落ち着きました。
サイドバーの無い1カラムのデザインは初めてなのですが、スクリーンショットの写真なども大きく表示されるので、細かいPC関連の記事などにも良いですね。😃

サイドバーが無いと、不便かとも思いましたが、下にまとめてプロフィールやカテゴリーなどの情報が集まるので、これはこれで見やすいかなという印象です。

また、この機能が欲しいと思って探したわけではないですが、記事の「タグ」も表示されるのは結果として良いですね。
話はそれますが、はてなブックマークという「タグ」で飛んでみたら、私と同じように「はてなブックマーク」を見逃していたという方の記事が紹介されていました。⬇️

onedayhike.hatenablog.com

この方の人柄と星空の写真が素晴らしいです。😄
はてなブックマーク見逃し系の話は、私も含めて「あるある」のようですね。😣


デザインテーマの話に戻ります。
これは以前からなのですが、少しだけカスタマイズしています。

・目次のデザインを変更
・見出しのデザインをわかりやすく変更(オリジナルは字の大きさの違いだけ)
・記事中の文字を「斜体」に設定することで「黄色のマーカー」を引く
・「カテゴリー」を「タイル」表示に変更

 

★★★ こんな感じになります ★★★

目次のデザイン⬇️

 

大見出し(見出しのデザインについて)

どのデザインが「大・中・小」に向いているのかは難しいところですが、私は「大見出し」はほとんど使わず、たいていの記事では「中見出し」小見出しを使っています。

 

中見出し(黄色のマーカーを引く機能)

記事中の文字を「斜体」に設定することで黄色のマーカー」が引かれるようにしています。(「斜体」の機能を乗っ取って「マーカー」の機能にしています)


小見出し(「カテゴリー」を「タイル」表示に)

「カテゴリー」「タイル」表示はこんな感じです。⬇️

カテゴリーをタイル表示

 
しばらくこれでやってみます。また何かいじったら報告します。