こんにちは、はね子です。
7月入った頃にこのブログも何気に100記事超えてるんだなぁとふと感慨深くなりました。実はこのブログ、始めてから2年近く経ってるんです。年数考えると記事数は少ないですが、趣味で好きな時にしか更新しないのでこんなものかと。収益化させる気もありませんしね（一応補足しておくと、このブログに付いている広告は無料版はてなブログの初期装備です。個人の収益には還元されない広告になります。詳しくははてなブログ個人営利利用ガイドライン（2019年10月1日施行）を参照）。
さて、そんなふうにブログを見つめ直すと、思いのほか愛着も湧いてきた今日この頃。この機にもう少し見栄えを良くしようと改装を始めました。
当初の予定ではグローバルメニュー付けたり、カテゴリ分けをしっかりしたり、本当に簡単なことしかしない予定だったのですが、気づいたら楽しくなって色々デザインにこだわる結果になりました。
私はデザインとか全く学んだことのない人間ですし、当然ブログなどのサイト制作に欠かせないHTMLなどの知識もほとんど皆無です。
しかし、世の中にはコピペOKの自分で少し設定をいじるだけで独自性を出せるタグを配布してくれるようなサイト制作補助のいろんなサイトがあるのです。
わたしもそれらのサイトにあやかって、自分のブログを徹底的に見直しました。
大幅改装のため、約2週間近く再公開まで時間を要しましたが、おかげでかなりブログの質は高まったと思います。
今回は当ブログの変更点を紹介しながら、非常にお世話になった「はてなブログで使えるおススメサイト（ブログ）」も紹介させていただきたいなと思います。
①プロフィール画像の変更
6秒で自分で描いた雑アイコンをネコのようなメーカーを使って可愛らしいアイコンに変更しました。自分で描いたほうが味は出るとは思ったものの、やっぱり絵がうまい方のアイコンの方が可愛いので可愛さを優先しました。
今更ながらの紹介ですが、私のハンドルネームは「ねこ」が由来です。また、学生時代に「花見団子」っていう名前使っていたので組み合わせて「はね子」に落ち着きました。実際のところ本名とも結構似てますけどね。
なお、このアイコンは商用も加工も許可されているのでおススメです。かわいい。
②ブログデザインの統一
ブログデザインは「シンプル」をテーマにしています。当ブログはゲームのスクリーンショットやディズニーで撮った写真などを載せることが多いので、そういう画像が映えるようにブログ自身は色味をなくしました（最も私自身がモノトーンをめちゃくちゃ好きなのも理由の一つ）。
デザインについて詳しくはないのですが、個人的には基本は3色統一にするほうがまとまりがあってよいと考えています。もちろん場合によっては4色以上利用することはありますが、メインの3色から近似色を使うことで統一感を損ねないようには意識しています。
なお、私のブログのメイン3色はこちら。パッと見たらただの黒灰白なんですが、微妙に変化させています。黒（♯000000）のまま使ってもいいんですが、メリハリ強い色だと疲れてくるので多少淡くする工夫です。まぁ、ほんの気持ち程度ですけどね。
基本テーマは人気の「Minimalism」
改装する前から使わせていただいていたのが、はてなブログのテーマ配布サイトで無料で公開されている「Minimalism」。codomisu様によって作られたテーマで、はてなブログのテーマショップで堂々の1位を獲得している人気テーマなのでご存じの方も多いはず。
私が当初このデザインを選んだ理由は特になく、「とりあえず1位だから」で使っていました。基本てきとーな性格の自分がブログをつづける可能性も未定だったので雑な感じがよく現れていますね。
しかし、今になって「納得の1位だったんなぁ」と実感します。
「Minimalism」は製作者であるcodomisu様自身も「モバイルファースト」で作られたと発言なさっているほど、スマートフォンなどでの表示を意識されていて非常にレイアウトが美しいのです。もちろん他のレスポンシブ対応テーマが悪いというわけではないのですよ。ただ個人的な感想ですと、文字バランスがほとんど乱れることなく読めるのは「Minimalism」が一番特化していると思います。それでいてパソコンでの見た目も疎かではないため、私は文字を読むブログの特性を見抜いた”読みやすさを究極に追い詰めた”シンプルなデザインだと感じました。
そのため、ブログ改装に伴い変更するかも考えましたが、根底のテーマとして利用を続投させていただきました。
ナビゲーションメニューを設置
ナビゲーションメニューとは、タイトルやヘッダーなどの下に設定されている「HOME」や「ABOUT」とかのボタンメニューのことです。サイドメニューにカテゴリなどはありますが、ページトップに表示されるためアクセスしやすい機能ですよね。
なお、「Minimalism」は標準装備でついてます。私は何故その標準装備利用しなかったんだ……？（当時の私の面倒くさがりぶりが異常すぎて草）
ということで2年越しにナビゲーションメニューが導入されました。
このカテゴリ分けに「TWST」や「DISNEY」があるのが私のブログらしくてよいと思います。
おススメ記事のピックアップ
ナビゲーションメニューの下に設置された4つの記事。おススメ記事をトップページにのみ表示させる機能を付けました。
ブログなので過去の記事は検索上位になっていない限りはなかなか見てもらう機会がありません。自己満足ブログですが、一般の目に触れる場に公開している以上は、個人的に気に入ってる記事とか作ったゲームとかをもっと目に触れてもらいたいって気持ちは少なからずあるんですよね。
本当は「Minimalism」のcodomisu様がひとつ前に公開していたテーマ「こどみすフラット」で使っていたスライドショーを実装してみようと思ったのですが、スマホではちゃんと作動するのにパソコンだとリンク先に飛ばないという事故が起こりまして……。私が設定をいじくりまわしたのが悪いのですが何度やってもうまくできませんでした。
それでも諦めきれずに探し回った所見つけたのがパソコンガイド様。
参考にさせていただいたのはこちらの記事。
記事にははてなProでと注意書きはあったもの、チャレンジするなら無料と試したところ全く問題なくできました。コピペOKに飛びつき、自分のブログ用にカラーコードだけ修正するお手軽作業。
なお、ちゃんとスマホ画面でも動作してます。すごくないですか？？？
プロフィールのオシャレ化
このデザインのプロフィールを使っている人は割といらっしゃるため、有名かもしれませんが、フジブロっ！で公開されているプロフィールカスタマイズを利用してます。
せっかくプロフィール画像を変更したので、初期設定ではなくお洒落にしたいなぁと考えていた際に、はてなブログテーマ制作者としても活動されているフジグチ様のブログを見つけました。
デザインの変更もフジブロっ！内の記事でできてしまうため、CSSなどがわかっていなくとも誰でも簡単に使えます。これを無料で公開してくれる凄さよな……。
他の記事であるアイコンフォントなども非常に有能な記事になっていますので、是非とも皆さんも参考にしてみてください。
見出しデザインの統一
お気づきでしょうか。この日記記事にもちゃんと見出し分けがなされていることを…！
基本面倒くさがって見出し分けをちゃんとしていない私ですが、ツイステのイベント記事のときには必ず見出し分けはしていたのです。ですが、これからはもっとデザインにこだわるぞと意気込み、全見出しにCSSを導入しました。
ちなみに、各見出しこんな感じです。
CSSで設定されているため、いちいちHTMLで編集することなく見たまま編集で見出しを選ぶだけでお洒落な見出しが設定されるんですよ。CSSは面倒くさがりの強い味方。
もちろん私はCSSなんざ分からないのでコピペ頼り。
はてなブログのテーマの配布者でもあるSHIROMA様のSHIROMAGに見出しのカスタマイズ記事があります。
見出しデザインをたくさん紹介してくれているのできっとお好きな見出しが見つかるはずですよ。
上に戻るボタンの設置
長い記事は読みごたえがある一方、カテゴリーや他の記事が遠く離れてしまうという弊害を生じさせるのです。
私のブログは平均2000文字の記事が多いです。日記だと短くて1000文字などもありますが、人に読んでもらおうと意識して書いた記事は長くなりがちです。ちなみに、よく書いているツイステイベント紹介記事は短くとも約4000文字です、長ぇ。
そして、この記事は既に約3100文字。いつ離脱されてもおかしくはない。
そんな問題への強い味方が上に戻るボタン。
下にスクロールしていくと画面右下に登場して、ワンクリックでナビゲーションメニューのあるページトップにまで飛ばしてくれる優れもの。
私は先ほど紹介したパソコンガイド様の記事を参考にカラーのみ変更して利用しています。現状こちらはスマホ版に反映されていないみたいなので、導入する際にははてなProを申し込む必要がありそうです（収益化予定のない私は無料版を貫くため諦めました）。
「あわせて読む」でスタイリッシュに別記事誘導
この別記事を紹介する窓枠、憧れていたんですよ。
かっこよくないですか？ かっこいいよね？ かっこいい。
ただ過去記事張り付けるのでも目には着きますけど、やっぱり目立ってなんぼですよ。
なお、今回は全く内容に関係ない当ブログで一番幅を利かせているともいえる「ツイステ記事まとめ」で例を出してますが、基本的には関連する記事であれば「あわせて読みたい」は使えます。ブログ内リンクでアクセス数を伸ばすのは収益化をしている人にとっては非常に重要だと思うので、めちゃくちゃ使える機能ですよね。
まるっと参考にさせてもらったのはこちらの記事。
漆うしる様の元IT土方の供述では、他にも様々なカスタマイズを紹介してくれています。いろんなアレンジ方法なども載せてくれていてカスタマイズしやすいのでおススメです！
そのほかいろいろ設定してます
アフェリエイトをというわけではないですが、ボタン設置のためにDwarfRabbit様のうさぎ日和も参考にしました。強調したいリンクなどをボタンで表示できると目立つので、紹介記事などで有効です。
CSSにするほどでない時々使う囲み枠はもか様のmoca＊Bloggerメモ＊2ndを参考にしています。HTMLだけで利用できるので細かい設定なしで使えるのがありがたいですね。
③過去記事のリライト
変更点というよりは単純に2年近く文章を書いただけあり、過去の記事が黒歴史に近い文章になっていたため、多くの過去記事をリライトしました。日記は当時のままでいいかなと思ってそのままですが、ツイステ紹介など過去記事誘導などが目立つものは、ほぼ最新記事と言っても過言でないほど書き直しています。当時抱いた感想などはそのままですが、最近になって取り入れた様式と統一させるために追記をしまくったという感じですね。
なんなら今回リライトして気づいたのですが、更新失敗で途中で記事が終わっていた記事をそのまま公開してしまってたりと、なかなかヤバい失敗も見つかりました。
ブログ運営では「繰り返しのリライトが大切」と、よく耳にしていたのですが、身に染みて実感しました（ツイステイベントの『アリアーブ・ナーリヤ』記事で、一個前のイベントである『ハッピー・ビーンズデー』の話題取り上げてた記事は本当に戦慄した……）。
リライトは非常に大変な作業で時間がかかりました…。結果としてブログの価値は高まったので良かったのですが、ひとまずブログの限定公開状態を解除したかったので、一部記事だけにとどまっています。まだリライトが済んでいない記事もあるため、それらはいったん下書きに戻し、書き直したら更新していくつもりです。
④公開し損ねていた記事もしれっと追加予定
旅行した当時から公開が遅れてしまったという理由でお蔵入りになっていた旅行記などがしれっと追加される予定です。書き終えていたものの、タイミングのがすと今更感あって公開しづらいですよね。
でも、せっかく書いたのに日の当たらない場所で眠り続けるのもまた悔しいのです。
そこで、投稿時間をいじるという技能を身に着けたので、内容を多少読んでもらって役立てる情報も載せたものに書き換えつつ、追々公開していこうと思います。
まとめ
CSSやHTMLなどインターネットに触れていると、ある程度聞きなれる言葉ですが実際に使うことは今までありませんでした。単純に難しいという先入観が勝り、「やろう」とはなかなか思わないんですよね。しかし、調べれば素人でも簡単にカスタマイズできるように情報を提供してくれている人がいて、その人たちの恩恵を受けて楽しくブログ運営などもできます。
このブログはゆるくやりたいので2年たってそこそこアクセスも頂けるようになったものの、収益を発生させないでおこうなど方針は決めたんですが、商用化させてないから何でもしてもいいわけでもありません。そのため、これまで放置してしまっていた「プライバシーポリシー」や「免責事項」などの設置もしっかり行い、著作権に引っ掛かりそうなものは出典を明記しました（なお、本ブログで割と出てくるツイステのスクショは非営利であれば共有サイトに掲載することが禁止されていないため、自分で撮ったスクショという扱いで出典を明記しておりません）。
まだまだ直しきれていないところは追々やるとして、今後もブログ運営を頑張っていきたいなと思います。
非常に長くなりましたが、ここまでお読みいただきありがとうございました。
