まだイケる。

日々の雑記をスタイリッシュにまとめてます(多分)

記事書くよりブログのデザイン弄るのにハマってしまったんだけど

あとで読む

f:id:luna_jack21:20171103232027j:plain

どうも、Naonosukeです。

 

ブログデザイン弄るのめっちゃ楽しいわ

 

あかん、最近記事書くよりもハマってる。

暇さえあれば配置とか考えてる。

 

んでもってデザイン弄ってる時ってすごい勢いで時間過ぎていっちゃうのよね。

特に私はCSSの知識が皆無からのスタートで手探りで覚えながらデザインしてるから特にロスが多くて体感時間の短さが目立ちます。

 

でも大体頭のなかで思い浮かべてたデザインにすることが出来たので、記事書くのに専念します。

 

ブログ完成図

 

PC版
f:id:luna_jack21:20171103222504j:plain
f:id:luna_jack21:20171103222510j:plain

 

今回見た目で気合を入れたのはPC版です。

大きな画面を活用してみたかったので横に4列並べてみました。
あとサイドバー撤廃して1カラムにしました。

 

なんか1カラムってちょっとブログデザイン慣れてます感あるやん?

 

まぁPCでこのブログ見てくれる人は3割未満だけどな!!!!

 

でもね、私はPC表示のデザインも是非力入れたい。

 

私は記事を基本的にPCから投稿している。

下書きはスマホで書いても投稿は大体PCで行っている。

 

その時自分のブログをPC見るんだけど、自分で自分のブログのデザインにワクワクできるようになりたい。

自分のブログを愛していたい。いやマジで。

だからPCの版のデザインは3割の人のためというよりは自分のためです。

 

 

スマホ版

 

f:id:luna_jack21:20171103223934j:plain
f:id:luna_jack21:20171103223957j:plain


スマホ版はそんなにデザイン変わって無いんだけどね。

なるべく必要最低限にこだわったよ。ブログデザインミニマリストです。

 

 

前々から気になっていたんだけど

f:id:luna_jack21:20171103224448j:plain

PC版では機能的なサイドバーもスマホでは

 

f:id:luna_jack21:20171103224658j:plain

こんな風に長々と表示されるの。

正直7割のスマホ読者さんもこんなの見ないだろと私は思ったし、私自身なんかゴチャゴチャしてて気に入らなかった。

 

だから思い切って全部撤去してやったの。ブログにサイドバー必要なんてもう昔の話だよ。とか自分に言い聞かせて思い切った。

 

f:id:luna_jack21:20171103225149j:plain

記事を読み終わったらすぐにメニューを見られるようにしてみた。

長ったらしいサイドバーの1000倍は機能的で美しいと思ってる。(ごめん言いすぎた)

 

コメント欄の葛藤

 

すぐフッターを見られるようにする。

我ながら気に入ったアイデアなんだけど、1つの壁にぶち当たる。

 

コメント欄どうしよ・・・

 

コメント欄がどうしてもデザイン的に微妙な位置になってしまった。

(はてなブログではコメント欄のコメント表示数やコメント欄の移動がほぼできない)

 

でも自分の理想のレイアウトの為にはコメント機能を捨てなければ。

いやでも、コメント貰えたら嬉しいしな、うわ〜〜〜!!!!迷う!!!

 

結果的に言うとコメント機能を無効化した。

 

今の時代ツイッターとかはてブとかで記事へのコメントは出来るから代替手段はいくらでもあるんだけど、

アカウント持ってない人でも気軽にコメントできるのは大きいかな?と思った。

たまたまこのブログ来てくれた人がコメント残せるようにしておきたいのはあった。

 

でも、たまたま来てくれた人がコメントを残してくれるのもそんなに多い話じゃないしな・・・自分の好むデザインにするほうが良いかな・・・なんか代わりに掲示板でも設置しちゃう?掲示板とか懐かし(わらい)

 

みたいな葛藤がありました。

 

まぁとりあえず試しにコメント機能無効にしてみる。あれね、PDCAってやつ。

 

 

最後に私からデザインに弄りしたら面白いよ。と勧めておくね。

時間どんだけあっても足りなくなっちゃうけど、お気に入りのデザインにすることができたら超嬉しいし、自分のブログ愛せるよ。

 

あと「なんかはてなブログでオシャレなブログがあるよ」って紹介されるのがなのでヨロシクゥ!

 

おわり

 

ここまで読んでくれてありがとう!