みとべのできるかな

自分と家族を大事にしつつ、そこそこ仕事しながら、たまにもやっとして、あまった時間で貯金と投資するブログ

ブログ雑感とフォントサイズ&見出し&ボタンのカスタマイズ

時間ができたので久しぶりにブログデザインを整理した。

今年の春ぐらいからブログに文章を書くようになって、4月から「はてなブログ」に引っ越して、7か月たった。

これまでは、他のブログと何がどう違うのかボンヤリとよくわからなかったが、ようやく自分のブログに色々足りないところが、客観的にわかってきた。たくさんの人に読まれる面白いブログを書いているブロガーは本当にすごい。

自分なんてブログ始めてから数年たってもこんな感じ。投資と一緒で歩みが遅い。

ブログを楽しみながら、ちょっとずつ成長したい。

ペーペー投資ブロガー雑感

はてなブログの感想

有料プランを使っていて、カスタマイズも記事投稿もしやすい。ほとんど知識がない自分には助かる。

常時SSL化のhttpへの移行はいつになるんだろう?「保護されてません」って出るのが嫌。

AMP配信される時のデザインが簡単に設定できるようになってほしい。

はてなブログ以外のブログへのトラッキング機能がないのが不便。運営側に問い合わせたら「今後も対応の予定はない」とハッキリ言われた、残念。

 

記事投稿で気を付けていること

パソコンで書いているので、Google Chromeウェブブラウザで[F12]を押してスマフォでの見え方を確認。ちなみに「はてな」では記事編集からスマートフォン画面のプレビューもできる。

記事を書いたら必ずスマホで見よう!パソコンでもできる確認方法 | クロネのブログ講座

投稿後にもURLで記事がわかるようにカスタムURLを記事毎に設定。

一つの記事で一つのテーマ、伝えたいテーマははっきりと。(ただのメモの時もあるけど‥)記事の書き方はこれから少しずつ学びたいな。 

 

f:id:mitove2:20171127173739p:plain

ブログをカスタマイズ

ブログのデザインを整理&更新した忘備録

フォントサイズや行間、見出しを整理

使っているテンプレートのMinimal-Greenのサイトをチェックして、大見出しh3→オリジナル、中見出しh4→デフォルト、小見出しh5→オリジナルに整理。

見出しのデザイン CSS - Minimal Green

h3のデフォルトの見出しデザインをクリアにするCSSの入れ忘れ、h5のデフォルトの見出しデザインをクリアにするCSSの重複を修正した。

デザインテーマ「Minimal Green」のカスタマイズの手引 - Minimal Green

目が疲れ気味で、自分で自分のブログが見難い、フォントサイズが小さいと思ったので、17pxに大きくした。行間も変更。

ブログにおすすめのフォントサイズと行間を徹底解説【簡単CSS】 - 急がば 急いでまわれ!

パソコンとスマフォのデザインは共通になるようにレスポンシブルで設定している。スマフォのフォントサイズは18pxがいいかもと思ったが、スマフォの設定に手が回らないので、パソコンと共通のままにしておこう。

 

フォローボタン、シェアボタンをカスタマイズ

半年前はなぜか?挫折した、ボタンのカスタマイズ、今回はできた。

コピペ+αではてなブログにSNSフォローボタンを設置するカスタマイズ - Yukihy Life

そのままだと、フォローボタンが縦並びになるので、HTMLの途中にある</a>を消して横並びにした。

 

関連記事のデザインと配置

関連記事をカード型にして2×2の4つ配置に。

シェアボタンの下に関連記事が配置されるように変更。

関連記事内の日付、冒頭文を非表示に変更。

関連記事と記事下の順番を変えたり、いろいろカスタマイズ - FOXISM

 

AMP配信の停止

スマートフォンなどのモバイルで高速表示に対応したAMP(Accelerated Mobile Page)配信。

はてなブログをAMPに対応する時の注意点!設定・デザイン・広告まとめ - 晴れ時々晴天なり

ほとんどのCSSデザインがキャンセルされる。見出しも自動で太文字になり、シンプル化することで高速表示する。

Twitterカードから自分のブログリンクをクリックすると、このAMP配信になる。

写真は一枚しか使わないし、高速表示の必要もないと思ったのでAMP配信は停止した。

AMP配信用のCSSやデザイン設定もできるようだが、自分にはちょっとハードルが高すぎる。

収益面においてAMP導入はデメリットのみ|ASPが限定されるだけ - テケオは眠くても頑張るぞ!

 

これからのカスタマイズ

カテゴリーの整理、グローバルメニューの見直しは、時間があるときにボチボチしよう。

これからもどうぞよろしく#