いなふのブログ

ブログは生き物

【超初心者】はてなブログのスマホ版カスタマイズに挑戦してみた!

f:id:narinariman:20181007172139j:plain

 

ブログのデザインに四苦八苦している【いなふ】です。

 

PC版は公式のテーマでいい感じのデザインがあったので使わせていただいてるんですが、問題はスマホ版でした。

 

正直、スマホ版のブログデザインとかあまり気にしてませんでした。

デフォルトでも十分じゃい!ってな感じでスルーしてました。

 

ブログを書く上で他のブロガーさん達のブログを拝見したりして思ったんですが・・・

トップページや記事のページがメチャメチャ見やすいしカッコいい!!

 

タイトルのデザインとかフォントや色の使い方!

見たいページやカテゴリーの配置!

記事ページも見出しの強調性や目次のシンプルさ!

背景の絶妙なコントラストなど・・・

 

いや~マジ見やすいな~スゲーなぁ~(;´Д`)

 

 

よ~しスマホ版のデザインもカスタマイズしてみよう!

(・_・D フムフム・・

よしよし・・・そういう事か・・・

なるほど・・・・・全然わからん!!

 

ははっ何がわからないのかワカラナイ!

ググってみても専門用語すぎて

いなふのスペックでは理解不能でした!

いなふのメモリーカードは初代プレステくらいの容量(15ブロック)しかないのでオテアゲネ!

 

もうね、HTMLとかCSSとか全然わからん(∀`*ゞ)テヘッ

 

よしっ!やーめた( ̄▽ ̄)

ちょっと、いなふにはレベルが高かったね!

別にこのままのデザインでも大丈夫・・・

 

 

安西先生「あきらめたらそこで試合終了ですよ。」

 

・・・!?その声は・・・・!?

・・・・

・・・・・

せっ・・せんせい~・・・

スマホのデザイン、カッコよくしたいです(´;ω;`)

 

 

さぁデザインをカスタマイズだ~Let's try!~

今のご時世、インターネットでの検索のほとんどはスマホからですよね?

なのでブログの閲覧はスマホからのアクセスが非常に多いです。

見られるなら見やすいほうがいい!

そう思って、超初心者のワタシ「いなふ」が挑戦してみました!

と言ってもHTMLやCSSの事は全くわからない!

でもコピペするだけでできるらしいので、

プロのはてなブロガー様の記事を参考にしてカスタマイズしてみようと思いますm(__)m

※このカスタマイズは、はてなブログPro(有料会員)前提となっております。

 

 

まずはこちらの方々の記事を参考にさせていただきました。

www.ituore.com

hitsuzi.hatenablog.com

 

いや・・なまらスゴイ!

ほぼこの記事だけで全体のデザインができてしまいました(*^▽^*)

初心者のワタシでもわかりやすく書いているので

たいへん、助かります(というかコピペしただけなんですけど・・。)

いや・・・本当にこれタダでいいんですか??

 

shun_prog0929さん、codomituさん、ありがとうございますm(__)m

 

【トップ】

f:id:narinariman:20181007160041p:plain

     👇

f:id:narinariman:20181007160204p:plain

 

トップだけでもこんなに変わるんだね( ;∀;)

ちょっと感動!

 

【記事内、ヘッダ部分】

f:id:narinariman:20181007161448p:plain

      👇

f:id:narinariman:20181007161625p:plain

 

日付やカテゴリーのバックに背景が付いてかなり見やすくなりました。

どんどんカスタマイズしていきましょう(^^♪

 

【目次の部分】

f:id:narinariman:20181007161935p:plain

      👇

f:id:narinariman:20181007162046p:plain

【見出し部分】

f:id:narinariman:20181007162339p:plain

     👇

f:id:narinariman:20181007162512p:plain

 

【フッタ部分】

f:id:narinariman:20181007162642p:plain

      👇

f:id:narinariman:20181007162742p:plain

 

カスタマイズ終了・・・

ざっくりですがスマホのデザイン全体を変えてみました。(くどいようですがホントにコピペだけしかしてません('◇')ゞ)

背景や見出しを変えるだけでグンと記事が見やすくなりますね!

ホントはもっとトピックスを作ったり、

ページの先頭に戻る矢印とか、

各、フォローボタンとか変えたかったんですが

とりあえずこれで十分!(っつうかこれが限界!)

 

もう少しHTMLやCSSの事を勉強してチャレンジしたいと思いますm(__)m

 

はいっ!

今日は終わりです( ̄▽ ̄)

 

ブログランキング・にほんブログ村へ
にほんブログ村