読者です 読者をやめる 読者になる 読者になる

ITUYOGA

特定の流派には属さないハートオブヨガという理念を持ったヨガの先生。

【備忘録】はてなブログを1日でおしゃれにカスタマイズする方法をまとめる【随時更新】

f:id:kasiwabara2013:20161010214550j:plain

ライブドアブログからはてなブログに引越して1ヶ月が経とうとしている。今日は自分の備忘録としてデザインカスタマイズについてまとめる。

おしゃれなデザインは人の心をくすぐる。書いている自分も気持ちがいいし、読んでくれる人にも気分がいい。ブログにとっての、おしゃれでいいデザインとはなんだろう。ぼくはこの3点だと思う。

  1. 簡素で迷いにくい
  2. 感性が刺激される
  3. 不快感がなく読みやすい

 おしゃれで読みやすいブログ作りをするうえで、多くの先人たちの知恵が役に立った。記事を借りさせてもらった方々には感謝を。

yuta.ituyoga.com

 

おしゃれでカッコイイデザインをしたいなら、そういった雑誌やウェブサイト、アーティストから刺激をたくさんうけること。深く感情を揺り動かしたものは必ず記憶に蓄積される。そして審美眼が磨かれる。審美眼はデザインのよしあしを直感的に判定するために必要だ。

フライヤー(チラシ)とかバナー画像作るならPhoto EditorとPicky-Picsで充分。【超簡単な画像編集】 - いつヨガ

 

 

  • この記事は随時更新していきます。
  • 2016/10/11 詳しい補足や、追記をしました。

初期設定

niche.hateblo.jp

 

「ブログを始めてみよう!はてなでやってみるか」と思った時に役立つまとめを書いておこうと思い立ちまして。 はてな以外でも新しくブログ立ち上げるときに役立つと思います。「あれ、何やっとけばいいんだっけ?」ってなったときに。また、すでにブログを開始している方も、意外なところに抜けがあるかもしれません。(私はありました。) ここでは、思い立ったときから自由に記事を書けるようになるまで、後々のアクセスアップを見越した設定がとりあえず終わるように書いておきました。全部やっておけば、あとは記事を書くのにだいぶ専念できると思います。

はてなブログを始めるときに、まずやるべき9つのこと(はてなブログの使い方・初期設定) - ニッチブログ

 まずは初期設定をしよう。

テーマを選ぶ

スマートフォンのデザインはパソコンほど大きく変えられない。もしパソコンと同じにしたければ、レスポンシブデザインを採用しているテーマを選ぶことが必要になる。

追記 2016年10月14日

テーマをDUDOから変更し、レスポンシブデザインを採用。

tsukuruiroiro.hatenablog.com

 

多くの方に参考にして頂いたようでとても嬉しい。続編を書いて欲しいというご要望をいくつか頂いたので、僭越ながらまたデザインカスタマイズのTipsを書こう思う。前回はスマホデザインについてのみ触れたが、今回はPC表示のカスタマイズについて。主にコピペだけで「超カンタン」におしゃれなブログが作れるので、Webデザイン初心者の方にも是非読んでいただきたい。

はてなブログを一瞬でおしゃれにする最強のデザインカスタマイズ方法(テーマDUDEの手引き) - Literally

 ぼくはこのテーマDUDOが大好きだ。スマートフォンのデザインも参考にさせてもらった。おしゃれなデザインは先進的な印象を与え、ブログの説得力をますことにつながる。どうしてもレスポンシブデザインに変えざるを得なかったが、今でも大好きなテーマの一つ。

本文

www.gadget-mission.com

 

貼り付けるだけの簡単作業で、はてなブログを見やすくする方法をご紹介します。 今回は、引用枠線デザインと太字マーカーを追加することで文章を読みやすくお洒落にする方法です。 誰でも簡単に出来るので特に必要な知識はありません!

【簡単コピペ】はてなブログを一瞬でカスタマイズ!-引用枠線デザインと太字マーカーを追加で見やすくする方法- - ガジェットミッション

 このように、太字にしたときにマーカーを引いたような強調のされ方になる。

プロフィール

www.miyahaya.com

 

思い切って具体的なプロフィール記事をかいて記事下に貼っておくのは、他のブロガーとの差別化になり、長期的な生存戦略として有効です。

はてなブロガーは必須!はてなブログの記事下にプロフィールを貼り付ける方法。 - 今日はどんな本音を語ろう

 プロフィールの存在は大きい。ブログと仕事をひもづけている人にとっては、必要不可欠だ。また、書き手のことを覚えてもらうことで、ファンが形成されやすい。「あのブログを書いてる人」ではなく「あの人が書いているブログ」のような覚え方をされたら最高だ。

フォロー、シェアボタン

www.ituore.com

blog.kaerucloud.com

読者登録をしてもらうことで、再びブログに訪れてもらうことができる。やらないと損をする必須項目の一つ。はてなブログにもともと備え付けられているボタンより、自分で用意したもののほうがおしゃれで目立つ。

シェアボタンで拡散してもらうことも重要なこと。「あれ、この記事どうやってツイッターでシェアしたらいいんだろう」なんてことになったらせっかくのチャンスを棒に振ってしまう。

サイドバー

あると便利です。このブログだと右側にサイドバーが表示されている。スマートフォンからだとサイドバーがないので、記事下にサイドバーと同じようなモジュールを用意しよう。

バナー

www.dagasorega-e.net

 

今回はマウスオーバーすると広告の色が変わるオーソドックスなタイプのバナーの作り方をご紹介。

はてなブログのサイドバーにオリジナルバナーを貼る方法 - だがそれがいい

画像付きのバナーはクリック率を大幅にアップさせる。ただの文字だけのリンクより、はるかに印象がいい。画像の選び方や装飾の仕方によってもクリック率は変わるので、広告の基本を調べておくといい。 

wepli-dot2.hatenablog.com

サイドバーに画像編と題しまして、その方法を備忘録として書き留めておきたいと思います。

『はてなブログ』のカスタマイズ!サイドバーに画像編 - wepli.2

 このサイドバーに画像をはりつける方法を採用している。シンプルで間違いにくいので初心者にはおすすめする。

ツイッター

route53.hatenablog.com

 

ブログ読者が増えれば・・・というより、 Twitter仲間が増えるのも楽しいと思いまーす! 私のアホなつぶやきに激しいツッコミお待ちしております(^_-)-☆

サイドバーにTwitterのタイムラインを埋め込んでみた【はてなブログ】 - わたしのみち

 というわけでツイッター仲間、増えることを期待しましょう。しゅうさん、わかりやすい記事ありがとうございます。

同じ要領でフェイスブックページのタイムラインや、インスタグラムの埋め込みも可能です。

お問い合わせフォーム

www.mutant-tetsu.com

 このブログのサイドバーにはお問い合わせフォームがある。レッスンやコンサルティングの依頼を受け付けたり、ブログの感想などを集めるのに効果的だ。「kasiwabara2013☆gmail.com の☆を@に変えてね!」みたいなやり方だと

  1. アドレスをコピーする
  2. メールアプリを起動する
  3. ☆を@に変更する
  4. メールを送信する

という心理的に壁になってしまう。なので一発で送信ができるお問い合わせフォームを用意しよう。

スマホ

バイルファーストという言葉がある。ブログの読者は半分以上がスマートフォンからのアクセスだと思ったほうがいい。パソコンのデザインは完璧でもスマホデザインがダサいと意味はない。本腰をいれてクリアしていこう。

tsukuruiroiro.hatenablog.com

スマートフォンのデザインに関してはこの記事を大きく参考にしている。テーマDUDOはレスポンシブデザインではないので、スマートフォンデザインを自分で決める必要がある。面倒かもしれないが、自分でデザインをいじれるのは楽しいものだ。え?面倒?そんなこと言うなよ(´;ω;`)

 

スマホにもカテゴリー一覧

www.usamofu.com

スマートフォンのデザインはパソコンほど大きく変えられない。もしパソコンと同じにしたければ、レスポンシブデザインを採用しているテーマを選ぶことが必要になる。

スマートフォンではカテゴリー一覧が標準装備されていないので、こちらを参考にパソコンからいじってみよう。これがあるかないかでブログ内の回遊率は大幅に変わる。

まとめ

早ければ1日。遅くても1週間もあればそこそこおしゃれかつ、読みやすいブログのできあがり。うちのブログをカスタマイズする上で、参考にした記事はほぼ全て紹介した。またカスタマイズしたときにでも更新していけたらと思う。

ヨガブログの作り方

ヨガインストラクター向けのブログの運営方法についての教科書を販売しています。ちょっとお高い分、オマケとして(むしろメインコンテンツ)無料コンサルティングのチケットをつけました。わからないことのフォローとして依頼をしてみてください。

ブログコンサルティング

ブログの運営について細かい指導が欲しいという人のためのコンサルティングをやっています。普通のブロガーと違うところは、ぼくがヨガ講師という「教えること」を専門の仕事としていることでしょう。また、ヨガ哲学的な本質に切り込んでいく考え方も、普通の人と違っていて面白い部分だと自負します。