HSKぐうたらジャーナル

カメラ、ガジェット、かっこいいもの、かわいいもの、おいしいものが大好きな個人トレーダーのぐうたらな日常をマイペースに綴ります。

【B】 HTMLやCSSをいじらずに、はてなブログを自分らしく演出するのだ!の巻

f:id:hisoka_maki:20130502233741j:plain

無情にもGWが過ぎ去っていきます。
あれもこれもやってないのに…。おまけに相場は負け越し。
個人トレーダーとしては苦しいかぎり。
そんなときはブログを更新して気分転換するに限ります!(涙目)

さて、以前の記事:

【B】 はてなブログに過去記事を写真で表示する、お手軽カンタンカスタマイズの巻

を読者の方にご参考にしていただき、設置レポートを何通か頂戴しました。
ありがとうございます!

調子に乗って、今回もちょっとした小ネタをご紹介します。
今回のネタは、本ブログで本文中にも使っている、こちら。

f:id:hisoka_maki:20130502234835j:plain

そもそもこれってナニ?

私の場合、「自分らしい」ブログの雰囲気を
なるべく高い完成度でお見せするために、このアクセント画像を使っています。

少し言葉を足すと、タイトルに使われてるキャラクターを本文中にも入れることで
ぐうたらジャーナルのブランドイメージ(=ぐうたらジャーナル「らしさ」)
強化する効果があると思ってます。

 たかが個人ブログにそこまでこだわらなくてもいいじゃん、
って思われるかもしれませんね。
でも、私にとっては、それ、逆なんです
仕事じゃなくて個人で好き勝手できる個人ブログだからこそ
自分らしさを出したいのです。

f:id:hisoka_maki:20130428134610g:plain

優れたテーマほど「普通」になってしまう罠

はてなブログの既存のテーマは素晴らしいデザインばかり。
自分の手を加えなくても「それっぽく」なります。
作者の方々にはホントに頭が下がります。ありがとうございます!

しかし、優れたテーマほど多くの人に使われています。
つまりそのブログは(デザインにおいては)「よく見かける普通のブログ」
なってしまっているのです。

ブログを書くからには、少しでも多くの人に読者になっていただきたい
というのが人情というもの。
そのためにも、他のブログとの違いを明確に出していく必要があります。

CSSをいじるのはハードルが高い!

しかし、ここで大きなハードルが立ちはだかります。
はてなブログのテーマをカスタマイズするためには、
HTMLやCSSを理解して、変えていかなくてはならないのです。
ハッキリ言います。超めんどくせー!

 

f:id:hisoka_maki:20130428134609g:plain

面倒なのはイヤなのだ! 

さて、このアクセント、一見すると小さなアイコンがセンタリング
(align="center") されてるように見えます。

ブログ開設当初は、このセンタリングのために

  • 見たまま編集モードで画像を追加して、
  • HTML編集モードに切り替えてセンタリングのためのHTMLを追記して…

と手間をかけていたのですが、これが非常にめんどくさいのです
そんな面倒なことやってたら、この「ぐうたらジャーナル」の名がすたる!

クリック一発でアクセント画像を表示させる方法

そして先日、風呂に入ってるときにふと思いついたのです。
センタリングするのがイヤなら、センタリング済みの画像を作ればいいじゃない!
つまり、こんな横長の画像です。

f:id:hisoka_maki:20130502233742j:plain

あ、画像の大きさはご自身のブログの横幅に合わせてくださいね。
私は580ピクセルにしてますが、自分のサイトではどうしたらいいの?
って方は、「ものさしX」を使うとカンタンに測れます。
あまり神経質にならずに、ざっくりでも大丈夫ですよ!

f:id:hisoka_maki:20130503004840j:plain


あとは、自分のはてなフォトライフに、アイコン用のフォルダを作ったら、
画像をアップロードすれば準備OK!
使いたいときには、画像を挿入する手順で本文中に入れてできあがり、です。

f:id:hisoka_maki:20130503010849j:plain

画像を作るのはちょっとだけ手間がかかりますけど、
一度作ってしまえば、あとは毎回使い回せますしね。オススメです!

f:id:hisoka_maki:20130428134606g:plain

…というわけで、今回は当ブログのちょっとしたコダワリと、
それを実現するカンタンなやり方を紹介してみました。

少しでも皆様のご参考になれば幸いです。

ではでは、またのお越しをお待ちしてます!

 

こちらもおすすめ!:

【B】 はてなブログに過去記事を写真で表示する、お手軽カンタンカスタマイズの巻

 

ノンデザイナーズ・デザインブック [フルカラー新装増補版]

ノンデザイナーズ・デザインブック [フルカラー新装増補版]

  • 作者: Robin Williams,吉川典秀
  • 出版社/メーカー: 毎日コミュニケーションズ
  • 発売日: 2008/11/19
  • メディア: 単行本(ソフトカバー)
  • 購入: 58人 クリック: 1,019回
  • この商品を含むブログ (97件) を見る