グラフィックデザインからDTP、Webデザインまで
デザインに役に立つテクニックやコツをお届けします。

ホームページをリニューアルしました!

webデザイン wordpress

Pocket

ホームページをリニューアルしました!(自作テーマにしました)

このd-tipsも開設して早2年が経ちました。このサイトを始めた頃は、wordpressの使い方がまるで分からず、色々と調べながら自作のテーマを作ってはみたものの、何だかイマイチ。て事で、自作テーマはやちて、既存の無料テーマ『Stinger8』を使わしていただいておりました。

一昨年の年間アクセス数は11,000件。

昨日のアクセス数は3,3000件と実に3倍の伸びを記録しました。さて、何をしたかと言うと……。何もしてませんでした。更新はというと、数件しか更新していません。

つまり、為になる内容はロングテールでアクセス数がどんどん伸びていくという事が分かりました。

ついに完成!自作テーマ!

あれから2年、仕事でwebのデザインやwordpressを使ったコーディングなど、数々の経験を積んで来ました。最近では、HTMLからwordpressのテーマ化には30分足らずで出来るスキルを身に付けました。コツさえ掴んで、覚えてしまえばなんて事ないですね。

そんなこんなで、そろそろ自作テーマ作らなきゃ。って思い、数々のノウハウを詰め込んで遂に完成しました。

ちゃんとレスポンシブ対応です。

しかし、GoogleAdSenseの自動広告のせいか、時たま、読み込みが遅い事があります。

 

サイトスピードについて

近頃、仕事の案件でも感じますが、特にスマホ版サイトスピードはなかなか上がりません。Googleがサイトスピードの定義を仕様したせいもありますが、この辺りはこれからは常に課題になってくるでしょう。

サイトスピードは、下記のサイトにURLを入力するだけで、測定する事が可能です。今現在、このサイトスピードを上げる事が最大のSEO対策とも言われています。それ故に、なかなか上がらないのが現状です。

サイトスピード

対策としては

1.画像を圧縮したり、PCやスマホでサイズを使い分ける。

img要素は、picture要素を使ったやり方や、srcsetを使ったやり方をする事で、レスポンシブにも対応した無駄のないコーディングが可能になります。

2.画像を遅延読み込みする。

これは、『Lazyload』や『BJ Lazyload』が有名で、wordpressのプラグインとしても配布されていますが、サイト設計段階から組込むのが効果的です。私の様に、あとからプラグインに頼ろうとすると、色々と不具合がでます。

3.iframe関連も遅延読込みさせる。

先程の『BJ Lazyload』を利用すれば、簡単に導入可能です。あと、JavaScriptはfooterに書くようにする事です。headに書いてあると、初期読込みの際に、優先的に読み込もうとしてしまいます。CSSよりも前に書いてあると、見た目が出る前に、読込みでストップしてしまう場合もあります。

4.キャッシュを利用する。

サーバーの設定やhtaccessを利用すれば、キャッシュを長時間維持することが可能になります。リピーターは差分だけを読みに行くことになるので、体感速度は格段に上がります。

 

次回は、wordpressのテーマ化について触れて行こうと思います。

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

スポンサーリンク