QUEST MILE

おもしろいを、あなたともっとおもしろく

はてなブログ開始からカスタマイズまでの流れを公開してみる【ブログ開設1日目】

 

f:id:kotonoha_sorakuni:20170611110019p:plain

 

(©Hatena Co., Ltd./ブログを作成 - はてなブログより引用)

 

コトノハです。ブログを始めようと思い、名前を知っていた【はてなブログ】をはじめるまでは簡単でした。

しかしここから先がまさに果てしなき道でした。いままで見てきたおしゃれなサイトは一朝一夕では無理だったのです。

 

そんなわけで、はじめのブログをどのような流れで、それっぽく形にしていったのか、備忘録がわりに書いておきたいと思います。

 

はてなブログを始めようかと考えている人に、初めはこんなことをやると参考になればさいわいです。

 

 

 

1. はてなブログを開こう!

とりあえずはじめたらなんとかなるだろうと、「はてなブログ 開設」と検索します。

ちなみにここに至るまでもどのブログサービスがいいのか?(はてなブログ、アメーバブログ、ライブドアブログなど)いろいろと検討しました。

 

その結果気軽に交流できること、ほかのサービスも充実していること(はてなアンテナ、はてなブックマークなど)からめでたく【はてなブログ】で開設することになりました。

 

まずはアカウント登録ページへ進みます。

ブログを作成 - はてなブログ

ここで一つ注意です。はてなIDは登録後に変更はできません。

考えすぎて後々変更のために退会するようなことはないように気をつけましょう笑

私は単純にハンドルネームにしました。

 

 

2. 記事を書こう!

登録が終了すると、すかさず記事を書くよう勧めてきます。

口車にのって自己紹介を書いてみました。それが本ブログ最初の投稿であるこちらです。

kotonoha-s.hatenablog.com

 

 

3. 次、なにしたらいいのかわかんない・・・

さて初めてブログを更新し、達成感もひとしおですが次なる問題が降りかかります。

「次、なにしたらいいのかわかんない・・・」笑

こんなときはGoogle先生の出番だと素直に「はてなブログ 初心者」とググっていきます。そして出てきたありがたいサイトがこちらでした。

www.goodgoodlife.xyz

 

 

4. タイトルと基本的な操作を覚えよう!

上のサイトから下のサイトにとび、タイトル(QUEST MILE)を設定し、基本的な操作を覚えます。一端のブロガーっぽい雰囲気を味わいます笑

niche.hateblo.jp

 

 

5. おしゃれなデザインにしなければならない(義務感)!

タイトルも決め、本当に最低限、ブログとしてやっていけるようになってきたところで「このブログをおしゃれにしていかなければならない!」という謎の義務感がむくむくとわいてきます。

 

しかし私は文系大学でHTMLだか、CSSだか意味不明の状態です。理解するまでどれくらいの月日が流れるのか…。

そうだ、きっとおしゃれな人がテンプレートを公開しているはずだと迷わずパクっていくことを決意します。

 

いろいろ探した結果こちらのサイトから使用させていただきました。

shiromatakumi.hatenablog.com

 

こちらと迷いましたが、自分の好みからよりシンプルそうな方にしました。

www.yukihy.com

 

 

6. カスタマイズ、奥深すぎる…!

上のサイトに従ってどんどん本ブログをカスタマイズしていきます。

 

その過程で分るブログの奥深さ…。普段からなにげなく見ていたおしゃれなブログがどれほどの手間でつくられているのか恐ろしくなってきました。

ブログでよくみるtwitterのシェアボタンや、タイトルのフォントをカスタマイズして、悦に浸ります。

 

実際には載っているコードをコピペしているだけですが、そんなこと関係ありません。自分的にはこれでも十分たいしたことやっている気分です笑

 

しかしその過程で、あまりものカスタマイズの種類に絶望します。もちろんやらないといけないというわけではないですが、紹介されてると一応やってみたくなる習性なのです。

shiromatakumi.hatenablog.com

 

 

7. 解析…ツール?

もう十分だろと一息つきたいところですが、

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

ここのサイトで「解析ツール」という謎言語を発見します。

 

調べてみるにGoogle Analytics、Google Search Consoleなどがあり、アクセス解析やSEO対策(検索されやすくする?)のためにはじめに設定したほうがよいとのことです。

 

ここまできたら今やるのも後でやるのもおなじだと覚悟をきめて設定していきます。

実践修行!初心者の為のGoogle(ユニバーサル) Analyticsの使い方講座

はてなブログにGoogle Search Console(ウェブマスターツール)を設定する方法 - MUTANT

なお順番はGoogle Analyticsからのようです。

 

そしてこれが完了したら、2つを連携していきます。(今できることはもういまやってしまおうという精神)また他にもできそうなことはやってしまいます。

Search Console(ウェブマスターツール)とGoogle Analyticsを連携するメリットと具体的な手順の図解入り解説

超簡単に自分のアクセスを除外する方法 | 初心者の為のGoogle Analyticsの使い方講座

 

 

8. あれ、もうアクセスきてる…?

せっかく設定したのだから、使ってみなきゃ損だとGoogle Analyticsからアクセス解析をしてみました。当然はじめたばかりで、0だとばかり思っていたのですが、そこに書かれている数字は「2」でした。

 

うわっ、もうアクセスされてると喜んだのもつかの間、恐ろしいことに気づきます。

「そういやさっき、スマホからどう見えるのか気になってスマホでブログ見たな…。」

そうです。先ほどの

超簡単に自分のアクセスを除外する方法 | 初心者の為のGoogle Analyticsの使い方講座

で設定したのは、あくまで自分のパソコンのGoogleブラウザからのアクセスのみなのでした。

 

vdeep.net

 

こちらのサイトでそれっぽいことが書いてくださっていたので、やってみようと思ったのですが、、、あまりもの難しさに断念しました。

いつかまたできるかもしれない日のためにリンクを貼っておくことにします。

 

 

9. まだできることは…?そうだ、faviconつくろう!

一通りツール系の設定ができたと信じて、ここらではじめのサイトに載っていたfaviconをつくることに。

 

faviconとはパソコンでサイトを開いたときに出てくるGoogleの【G】やtwitterの【鳥】のようなマークのことらしいです。私は初めて知りました。

 

スマホだとウェブクリップアイコンといって、よくみるスマホアプリのデザインとなるとのこと。

ブログ作成するだけでもなかなか知らなかったことを知ることができますね。

綺麗なfavicon(ファビコン)作成の基本的なコツ・アイデアまとめ | 株式会社LIG

www.logogarden.com

 

上のサイトのコツを参考に、下の無料ロゴ作成サイトを使ってfaviconをつくってみました。さまざまなジャンルのロゴがあり、favicon作成には最適だと思います。こんな感じとなりました。

f:id:kotonoha_sorakuni:20170611110057j:plain

 

Googleでタブを開くとこんな感じです。これはfavicon必須ですね笑

f:id:kotonoha_sorakuni:20170611110105p:plain

 

 

10. Twitterやってみようかな?

さらにいい機会だと思って、これまでやってなかったtwitterもはじめてみました笑

 

これでtwitterでもブログの宣伝などができるようになります。

www.pojihiguma.com

 

よろしければフォローお願いします!

内容は以下の通り、ブログの更新や、映画、web小説の紹介などやっていこうかなと思っています。

アカウント名はtwitterの15文字制限でsoraku「ni」が入りませんでした笑

twitter.com

 

 

11. RSSは知ってるぞ!

さすがにRSSは知っていたので、これまたボタンを設置します。

ついでに下のサイトを参考にさせていただいてシェアボタンやフォローボタンを設置します。

www.yukihy.com

 

【追記】
シェアボタンについて、なぜかぐるぐるしてしまう状態が続いていましたがテンプレートを使わせていただいたサイトの別記事を参考にさせていただいて直すことができました!
(グルグルする不具合治しました)Facebookの仕様変更があったので、シェア数カウントのコードを修正して下さい - NO TITLE

 

 

12. そろそろ一段落だろ…?

そろそろ一段落だろと思い、はじめの

はてなブログ初心者が参考にすべき7つのサイト - 僕は猫だった

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

2つのサイトを確認してみます。

 

まだまだやれることは多そうです…。

・サイドバーのカスタマイズ

・グローバルナビの追加

・見出しのカスタマイズ

など、きりがないので下のサイトから最低限形を整えるために必要だと思うことをやっていきました。自分だけのブログとしていくにはまだまだやれることは多そうです。

shiromatakumi.hatenablog.com

 

 

13. ブログのトップページを一覧表示にしたい!

そろそろ切りをつけようと思ったところで、最後に気になったのはトップページ。

 

よくみる一覧表示ではなく、一つ一つの記事をすべて表示する仕組みだったので調べてこちらのサイトを参考に一覧表示で出るようにしました。

iitaikotoha.hatenablog.com

 

【追記】

 現在ははてなブログの公式設定で一覧表示が可能です。

 

おわりに

そんなこんなで自分としては最低限納得できるブログの形ができあがりました。

いやー、無料ではじめられるからと言って正直なめていたところはあります。やろうと思えばいくらでもカスタマイズして、自分だけのブログを作っていけるところにもブログの楽しみがあるのだと実感できました。

 

上記の流れはあくまで自分が調べた結果、辿った流れなのでこれがベストではなくもっと良い方法などあると思います。

あくまで備忘録としての意識が強いので、参考程度になればと思います。

 

そして形が整ったからにはいよいよ執筆を開始できます。あとは書いていくだけ!

いろいろな情報を惜しまずにサイトに載せてくださっている先達のみなさんありがとうございました。この記事もすこしでも誰かの役に立つことを願ってます。

 

 

カスタマイズの続きはこちら! 

 

【おすすめ記事】

白熱のインド映画見てみませんか?

9個の作品を紹介しています!