KuuGaming's Blog

ギ◯リストがおくる、動画配信の試行錯誤日記。主にゲーム、Steam系やBlizzardが好きな人向け。

ゲームは関係ないけど、ブログの軽量化は大事

f:id:kuugaming:20160418142159j:plain とくに考えもなく、記事更新していたら、ページ重くなってきた。

  • 記事へ画像を追加
  • 関連記事表示
  • ブログランキングに登録

これだけしかやってない。

え?なに?
はてなブログって重いの?

現実逃避してても解決しないので、こんな感じで対策をした。

軽量シェアボタンの配置

デフォルトのだと、記事上にも使うとTOPにも出ちゃうしなんか表示にも時間がかかっている。

これは最優先で直さないといけない。

でも、やり方は簡単。

そのやり方を紹介してくれてるブログが沢山有る。

いくつかのコードを参考に、自分で配置して、ブログのデザインに合わせCSSを修正した。

まだ、気になる所はあるけど、記事の一つ一つにコードを置いているわけではない。

一つ直せは、全体が修正されるし、暇が出来た時にでもポチポチと手を付けよう。

「続きを読む」ボタンの配置

ブログTOPにアクセスすると、記事の内容がダァ~っと全部表示されててコレは重くない?

と、思った。

使ってるテーマのせい?コレ。

やり方は、記事の管理画面で全ての記事に対して「続きを読む」ボタン用のhtmlタグを挿入した。

CSSは特に何もしなくても、ボタンぽくデザインされていたので、ラッキーw

はてなスターは外さない

重い原因と言われているみたいね、はてなスター。

外したいんだけど、スターもらえると気持ち良いから、外さないw

ブログ書いて、萎えてる場合じゃないよ。

軽量化とのバランスを取って行きたい。

レスポンシブのスマホ表示

スマホだとちゃんとレスポンシブしない問題があった。
テーマを疑ったけど、そんな事はなかった。

使用しているテーマのDEMOページを見てたら、ちゃんとスマホでもレスポンシブしている。

説明欄にも"viewport"がどうこうと書いてあった。

で、おかしいなぁと思い、はてなのテーマ作成の為のヘルプを眺めていると、ヘッダの指定がある。

そこで、

[設定][詳細設定]・headに要素を追加に、

<meta name="viewport" content="width=device-width">

を追記するように。

出来た!

結果的に

体感で、少し早くなった気がする。

あんまり時間かけずに出来ることだけはやった。

あとは惰性で、調整していこう。

今回、弄りたい所は、JavaScriptを置いてセレクター等を駆使すれば良いということが、はてなブログの勉強になった。

問題はスマホ

個人的には、スマホの記事デザイン等が、無料だと好きに弄れなくなっている。

「はてなさん、やりますね?」

って感じた。

課金ポイントを良く理解しているw

というわけで、近日中にプロにする。

一日、20円くらいなら、もう空気みたいなものでしょw