ヨミコのデザイン工房

デザイナー&ブロガーのヨミコが、 WEB制作の事を書いたり書かなかったり。

【画像あり】はてなブログスマフォ版をカスタマイズしてみた【コピペで簡単】

アイキャッチ画像

こんばんは。Web&グラフィックデザイナーのヨミコです。

またブログをカスタマイズしたから画像とリンク付で紹介します

先に言っておくと今日の記事は縦に長いです。

はてなpro使用前提です。
無料版であんまり魔改造するとBANされると聞きますので気を付けて下さい。
無料版でやってみたい方は自己責任でどうぞ。

長過ぎるスマフォ画面。これではユーザビリティに著しく問題があり、ユーザー離れが懸念されます

短気なヨミコは、全部スクロールする前にアプリで遊びたくなってしまう、という弊害も…。(半分くらい嘘です)

使用前画像

匠は問題点を洗い出しました

本当は、先人達が消している部分を参考にしただけなんですけどね…。

ピンクの部分がいらないと思うので消してしまいます。

ここを消したいな、の画像

ヘッダを消す

まずは一番上のHatenabrogとアイコンの表示を消します。
自分で見る時に、アクセス解析が見づらくなってしまうんですが優先順位的には、ユーザー>>>>>>(超えられない壁)>>>>>>>>ヨミコである事は確定的に明らかなので、消します。

アイコンの下のブログの説明も消します。

あってもいい気もするんですが、スマフォの導線は短い方が断然有利だと思うので、削ってしまいます。
そもそも大体スマフォユーザーはトップページからアクセスしないで、個別記事に飛んで来るんじゃないかなー?とも思いますし。

プロフィールとか記事を書くとかはてな開発ブログとか、idとか、フッタのボックスを消すよ

上記全て、下記の記事の要領で消せます。有益な記事を書いて下さって、本当に有難うございます!!

www.mataro1.com

プロフィールはあった方がいい気もするんですけどね。これも導線の都合上削ります。
もう少しいいプロフィールの表示の方法があれば、別途設定したいと思います。

フッターの事なのでフッターに入れましょう。

ヘッダに一度入れてみたけど一部は反応しないです。(css構造の問題だと思われます。)

フッターの編集には、はてなproへの申し込みが必要です。

こんなのもありました。

www.usamofu.com

読者になるボタンを残すのは素晴らしいですね。これは実践したい。(カスタマイズに終わりはないのです)

いよいよ、完成図をお披露目です

使用後画像

なんという事でしょう…!匠の手によりあんなに縦長だったスマフォ版の画面がこんなに短く…!

注目記事も消しちゃってもいいかもな…この辺はまだ考え中。(カスタマイズに終わりはないのです)

実機だと広告が入ってるのでもう気持ち縦長になっております。

コピペで簡単に出来るので、はてなpro会員の方は是非お試し下さい。

それにしてもはてなの人気ブロガーはほぼpro使用だし、同様のカスタマイズしている方も多いので、はてな側でもっと簡単にオン/オフ出来る様にならないものでしょうか…

コピペで出来るんだからそんなに目くじら立てなくても、ってかんじもしますけど(笑)

お疲れ様でした!

ではまた。

お仕事etcお問い合わせ先(制作実績お送りします):yomikodesign@gmail.com

Facebook友人申請お気軽にどうぞ。スパムでなければ基本承認します。

Twitterお気軽にフォローどうぞ!基本リフォローします。

他のカスタマイズネタ↓

yomikodesign.hateblo.jp

yomikodesign.hateblo.jp