2014-04-26

劇的!?みどりの森の回転木馬ビフォーアフター


Bloggerへお引越ししてきてからあっという間の1年と3ヶ月。
以前のSeesaaとの違いに戸惑ったりその逆もあったりで、記事を書くことに慣れてきたら徐々に改良をしていくつもりではあったのですが、まだまだわからないことが多すぎて悪戦苦闘中。

「フィギュアスケートの大きな大会も終わって一段落ついた今でないと出来ない」と思い立って、4月になってから見た目と見えない部分とを大改造すべくカスタマイズに取りかかりました。


2014年春・ニューデザイン


まずは現在見てもらっている新しいデザインを。

テーマは『シンプル&ホワイト&ナチュラル』


  • 画像はGoogle Chrome 100%表示、Windows7・画面解像度1920×1080で撮ったキャプチャです。
  • 拡大/縮小の割合で見え方は違ってきます。

全体幅:1050px サイドバー幅:360px

記事本体の背景は白でやるというのが絶対条件。
前のカスタマイズ記事でも書いたのですが、黒背景のブログはいいことが書いてあったとしても私には目が疲れてしまって途中でリタイアしてしまいます。
ブログの趣旨にもよるので黒系が一概に悪いとは言えませんが、このブログではできるだけ自己満足にならないよう心掛けて「自分自身にも読者様にとっても双方読みやすく疲れさせないもの」を目指しました。
(目指したけれど、それが実現できているかどうかはわからない)


テンプレート変更、細部の見直しへ


テンプレートはこれまでBloggerのAwesomeというものを元に改良してきたのですが、Blogger標準で揃えてるテンプレートはイマイチなうえに数が少ない!
「もっと使い勝手がよくスタイリッシュなものとなると海外テンプレートしかない!」
そう思って膨大な量のテンプレート探しの旅をしていたのですが、結局コレ!っていうのが見つからなかったのと、今の回転木馬のスタイルではそれを取り入れたところで逆にそぐわないだろうとの結論に至り断念。
調べ物をするためにいっぱい検索して引っかかるBloggerブログの中には
「え、これ本当にBlogger!?WordPressじゃないの?」
っていうオサレなブログもあって、作業に煮詰まってBlogger標準の野暮ったいシンプルテンプレートを再度見直したらセンス次第では自分でもそれなりには見栄えがする作りに変えられそうな気になって

そこからがまた大変だった・・・大変だったさ・・・(トオイメ
テンプレート変更さえうまくいけばこれまでのものをそのまま引き継げるって思ってたさ・・・
一からやり直しするとは思ってなかったさ・・・


カスタマイズでお世話になったBlogger関係ブログ様


主にBloggerブログの再構築関係の記事をあちこち参考にさせていただきました。
以下、備忘録を兼ねて参考にさせていただいたブログ(順不同)の紹介です。


こんなにたくさん!?と思われるかもしれませんがこれでもまだほんの一部です。
他にも基礎知識を学ぶため数多くのサイトを参考にさせていただいたのですが、参考にしては別のところをさらに改造、てなことをやってたので書き留めてなくて失念したところ多し・・・(;´д`) 
数々のBloggerブロガーの皆様・サイト様、本当に本当にお世話になりました。大感謝でございます。


他人の模倣が決して自分に合うとは限らない


で、書いてあったもの・センスが良いものを取り入れてみて
「ちょっとこれいい感じじゃない?私って天才かもwww」
って調子ぶっこいた直後に別のところいじったら回転木馬のテーマには全然合わなくてそこからさらに改造・やり直しで二歩も三歩も後退、そんなことの繰り返し。
木目模様を入れたかったけどあちこち欲張って入れると見苦しくなるので我慢我慢。テストブログでもうどれだけ改造改良しまくったことか。

他人のものを真似してもブログの個性は人それぞれなので決して同じものはできない、だからここまで手を付けてしまったからにはオリジナリティを追求しなくては
・・・という沼にズブズブとハマってゆく日々。




みどりの森の回転木馬 これまでの歩み



これが記念すべき回転木馬2010年7月13日開設当初からのデザイン。
『みどりの森の回転木馬』というブログタイトルのイメージに一番近いこのSeesaaテンプレートは気に入っていて長い間使用していたのですが、どこかで同じものを使っているSeesaaユーザーは当然いるわけで、使っていくうちにオリジナリティを出したい幅の狭さがどうにも気に入らない、でも広げようにも簡単にはうまくいかない、そんなこんなで1年7ヶ月ほぼこのスタイル。


使っていくうちにサイドバーに物が増えていく・記事の書き方にも慣れてきた頃にはこの幅の狭さにはどうにも我慢できなくなっていた!
ていうわけで奮起して初めてのブログ大改造。
3カラムに変更、後に背景も葉っぱの模様にしてかなりいい感じで11ヶ月使用。
(現在のこのブログのように)メニューバーを作りたかったのだけど当時はよくわからなくて、いつか改めてカスタマイズしようかと思っていたらSeesaa追い出されたぁぁぁ
▂▅▇█▓▒ (’ω’) ▒▓█▇▅▂


2013年1月に独自ドメインを取ってこのBloggerにお引越し。
わからないことだらけだけど後には引けない状況、ブログのお引越しがこれほど大変なものとは・・・
(実は今も完全移行できていなかったりするんですが)
これまでのイメージを継承したかったのでヘッダー画像は以前のものを使用、背景は壁紙っぽい質感で。
移転直後でどこをどう改造すればいいのか、頭で思い描いているようにはなかなかうまくいかず、でも重くて窮屈な感じだったので、ここで一旦思い切って『回転木馬画像』へのこだわりは捨ててみることに。
1ヶ月くらいはこんな感じで試行錯誤の日々。


これがつい最近まで、1年3ヶ月続いたスタイル。
背景画像は3週間別のものを使ってみて全体のバランスがしっくりこなかったので、現在のこの白タイルにアイビー(ヘデラ)というホワイト&ナチュラルな画像に落ち着きました。
上の画像と見比べるてわかるように同じテンプレートを使用しています。
色や画像でこれだけイメージが変わるもんなんですね。
でも枠で仕切られた空間がどんどん窮屈に感じられて、今回の大改造へと繋がります。


このシンプルテンプレートも当初はメニューバーを赤と黒を基調にして進めていたのですが、他とのバランスがどんどん取れなくなってきて、あっちを変えたらこっちも変えたほうがいい、ってな具合でどんだけ改造&やり直ししたかわかんないってくらいあちこち修正の日々。
一日一歩三日で三歩、三歩進んで二歩下がる。カスタマイズはワンツーパンチ、汗かきベソかきやったわよぉぉ・゜・(ノД`)・゜・





素材にこだわってみました


サイドバーのガジェットタイトル、このシンプルテンプレートのままだと真っ白。
それだと全体が繋がって区切りがなくてわかりづらいので、背景に縫い目付き布素材を使用。
重要ポイントとなる記事タイトル見出し背景であれこれ試しまくってコルク模様に落ち着いたので、この素材と相反せず調和が取れたものを探してこれに落ち着きました。
今のところ、ですけど。セロテープとかナチュラルウッドとか和紙だとか、それはもういろんな素材で試しました。
使いたかったけど我慢した素材数知れず。

ブログタイトル部分はブログの顔であり全体のイメージを左右するので、試行錯誤していっぱい作っていっぱい試して入れ替えて、っていうのを何度も繰り返したけど本当にこれでいいのかどうかはまだわかっていないという・・・

「チョチョイと作ればなんとかなるわよ」

・・・甘かった・・・甘かったわ・・・地獄を見たわ _(;3 _/∠)ゞ
せっかくなんで葬り去った画像をいくつか。(Seesaaカスタマイズ時に作ったものを含む)


左上の木の板プレートは記事タイトルのコルク模様見出しと似たような感じが並んでしまうので断念。(※ コルク背景は文字が若干見づらかったので木の板に変更
下二つはナチュラルな感じでまぁまぁよかったけど、当分は今のままでいくつもりです。

お世話になった素材サイト様


Re:vre フリーWEB素材 Re:vre
フリー素材*ヒバナ *  * フリー素材*ヒバナ *  *


これで完了!…ではない


Blogger独自の表に見える部分見えない裏の細かい部分の改造はまだこれからっていうのはあるにはあるんですが、現時点で最低限やっておかなくてはいけないことが一段落着いたのでやっとここでニューデザインに切り替え。
一年以上ここでやってきて「ここをこうしたい」っていうのがある程度は見えてきたので、これからははボチボチと出来る時にやれることをやっていこうかなといったところでございます。


見えない部分ではこういった各見出しに付けられたhタグっていうものの順番がBloggerでは文字の大きさ順になっていなくて(他のブログでも多分そう)、これを入れ替えするのに苦労しました。
hタグ入れ替えってのはSEO対策(検索エンジン最適化)に大きく影響するっていうんでSeesaaの時にもやったんだけど、Blogger移転直後はそこまで手が回らなくて、今改めて手付け出したらもう訳わかんなくなって大変だった!
「見えない」とは書きましたが、この記事内の見出し・小見出しはhタグを動かして改造したからこそこのように表示されています。
なかなかいい感じですね。これまでできなかったことが出来て、見出しをちゃんと考えて付けるだけで全体のイメージもこれまでとは違って見えてきます。

hタグが入ってる過去記事(多分Blogger移転以降の記事)には変なところで見出し用画像が挿入されて表示がおかしくなっている部分もあるかと思いますので、合間を見てチェックして修正していきます。

これからも時々表示が崩れていたりうまく作動していないところもあるかもしれませんが温か~い目で見てやってくださいませ。





ブログ選び・移転は慎重に


すでにBloggerからお引越ししていたブログの移転先がほぼWordPress・・・まぁそうなりますよねぇ。
WordPress.comっていう無料のところもあるんですが使える機能が制限されているので、物足りなくてそこからBloggerに移ってきたという人も。
よく『WordPressかBloggerか』っていうのを目にするのですが、「独自ドメインは欲しいけどレンタルサーバーの維持費がなぁ」って人にはBloggerは最適だと思います。
Seesaaでもできるんですが追い出された身でもありますしぃ(;´д`) 
やってた頃にはそんな知識もなかったけれど。後は使う人の方向性に適したものをってことですね。


「こういうのもあったんだ!しまったー」って一瞬思ってよく見たらスタードメインでやっているサービスなので、私のようにムームドメインだとか別のところでドメインを取得した人は対象外になります。
これから始めるっていう人にはいいかもしれません。


ブログ移転を何度も繰り返さないためにも


ブログサービスのお引越しを考えている方は、ブログ開設からあまり年月が経たないうちに決断されるのをお勧めします。
お引越しをする必要性がなければそれが一番ですが、「今のところでは物足りない」とお考えなら、自分がやりたいことに適したブログサービスはどこかを入念に調べて慎重に選んでからにしましょう。
そこで実際に書いてみないとわからないことはたくさんありますが、安易に選んで後で後悔しないためにも。
それには思い切って過去記事を旧ブログに置いていって新たにスタートさせるか、過去記事を一緒に連れていくのであればお荷物は多ければ多いほど重労働だということです。


選択の第一条件はこの先サービスを停止しそうもない安定したところですね。
ある程度は大手のブログサービス。急に引越しを余儀なくされるというのは辛いものです。

というブログお引越し経験者の体験談でした。


オリジナリティを出してアピール


ブログユーザーが多いFC2なんかだと多種多様のテンプレートが揃っていて、目移りしてあれこれ試してみたくなる気持ちはわかりますが、試すのであれば非公開でテストにテストを重ねてからをお勧めします。
訪問するたびにコロコロ仕様が変わっているようでは、そのブログの個性が読んでもらっている人には伝わらないと思うのです。テンプレート変更によってこれまで書いてきた表示が崩れてしまうこともあるし。
FC2で用意された人気があるテンプレートだと同じものを使っているのをあちこちで見かけます。そうなると「あれ、これってあっちのブログだったかな?」って勘違いされることもあるわけです。
記事タイトル部分もしくは背景をオリジナルに差し替えるだけでもガラッと印象が違ってきますよ。



カスタマイズの旅に終わりはない…!


ああ、ここまでやって今気がついた!! IEでチェックしてなかった (T▽T) 
前にIEで表示崩れてて大変だったんだけど、元がシンプルテンプレなんで大丈夫でしょう多分大丈夫だと思いたい。
パソコンでの閲覧を基本に考えて書いてるのでモバイルのカスタマイズまではまだ手が回りません。スマホで見てもらってる方も多いかと思いますが、あまりに表示が酷いようでしたら教えてください。(まだガラケーで粘ってる化石・買い替え時期が近いけどどうしたもんか)
見苦しくない程度には見てもらえているといいのですが。

このブログ閲覧はGoogle ChromeFirefoxIE以外を絶賛推奨します。


コメント欄変更に関する記事も合わせてお読みください



これまでのBlogger標準コメント欄をDisqusというシステムに変更しました。
説明とコメント投稿テストを兼ねたものになります。

これからもボチボチとマイペースで頑張ります。引き続きみどりの森の回転木馬をよろしくお願いいたします。


0 件のコメント :
コメントを投稿

新しい記事 以前の記事
  
Related Posts Plugin for WordPress, Blogger...