Amazon.co.jp ウィジェット

買ったものや欲しいものについての感想(レビュー)とか、雑記とか、キリンとか.

ブログを始めてから5回目のデザインリニューアルをしました。

これまではなんとなく見た目だけを考えてリニューアルしていたのですが、今回は使っている WordPress プラグインの見直しや、サイトをより見やすくするための工夫もしてみましたので、いろいろ書きためておこうと思います。

リニューアルにあたり、やりたかったこと

今回は、気になっていたいくつかのポイントを改善するためのリニューアルだったので、気になるポイントをまず挙げてみました。

  1. ページが表示されるまで時間がかかる
    − 原因を調べて、表示速度の改善をする
  2. スマートフォン用のテンプレートがない
    − これまでプラグインに頼っていたので、新たに専用のテンプレートを作る
  3. デザインに使っている画像をなるべく減らしたい
    − アイコンで表現できるものはシンボルフォントを使ってみる
  4. カテゴリー、タグの見直し
    − 増えるスマートフォン系の記事に対応したい
  5. 記事のレイアウトが統一されていない
    − 特に、古い記事はサムネイル画像がないことがほとんど

サイトデザインをリニューアルしました (1)

なんとなく書き始めたブログなので、最後の「記事のレイアウトが統一されていない」についてはリニューアル後も課題となって残っているのですが、ここは時間のあるときに少しずつ調整していくことにしました。

使用した WordPress プラグイン

リニューアルにあたって、お世話になったプラグインたち。
どんな用途に使ったのかをざっくりと。

リニューアル前からも使用しているプラグインはこちら。

削除したもの

表示速度の改善のため、明らかに表示が遅くなっている箇所をまずは取り除くことにしました。

インデックスページの SNS ボタン

インデックスページや、一覧ページに置いていた Twitter などの SNS ボタンを廃止しました。
なんとなくですが、「いいね!」ボタンが一番重たい気がします…。
サイトデザインをリニューアルしました (2)

Amazon サーチ ウィジェット

こちらもやはり表示に時間がかかっていたようなので、外すことにしました。
以前のデザインにした際に、フッターに謎の余白ができてしまってしばらく原因がわからなかったんですが、このウィジェットを外すと直りましたね…。
サイトデザインをリニューアルしました (3)

スマートフォン用のテンプレートを用意

これまでは、WPtouch というプラグインに頼ってモバイル版の表示をしていましたが、ようやくテーマを作ることにしました。
モバイル版では、いまのところパソコン表示できませんが、いずれ選択式で表示できるようにしたいと思います。
サイトデザインをリニューアルしました (4)

シンボルフォントを使う

これまでサイトで使っていたアイコンはすべて自作のものですが、Retina 対応 (同画像の4倍サイズ版も用意しないといけない) を考えるとシンボルフォントを使うのが効率的です。

本当は自分で作るのが一番なのですが、今回は Ligature Symbols というフォントセットを使わせて頂きました (本当にありがとうございます!)。
詳しくは作者さまのサイトをご覧いただくのが一番だと思います。

シンボルフォント、自作してみたいな〜…。

カテゴリー、タグの見直し

これまで K-9 Mail や BlackBerry 関連の記事はすべて「携帯」カテゴリーだったのですが、ここに来てようやく「スマートフォン」カテゴリーを新設しました。(まさか、ここまでスマートフォン関連の記事が増えるとは思わず…)

また、「BlackBerry」や「Xperia」などカテゴリーにしたほうがいいタグはカテゴリーに移し、大小のカテゴリーを作って階層化してわかりやくしました。
サイトデザインをリニューアルしました (5)

他には、いま読んでいる記事のタグがハイライトされるようにしました。
サイトデザインをリニューアルしました (6)


主に「快適さ」を重視したリニューアルでしたので、多少の配置変更はあるものの、レイアウト的に大きく変わったところはそんなにありません。
記事を読んでくれる方が少しでも「快適になったな」と思っていただければうれしいです。
サイトデザインをリニューアルしました (7)

まだ細かい課題も残っていますが、その辺りは少しずつ改善していきたいと思います!

この記事をシェアする

  • このエントリーをはてなブックマークに追加

カテゴリー

タグクラウド

Apple BlackBerry Classic BlackBerry PRIV Bold 9780 Bold 9900 BootCamp Curve 9360 enchantMOON FF11 Gmail iPad iPhone iPod Touch IS12T K-9 Mail Kindle Kinesis Mac Mobile Nexus 7 PlayBook Q10 Reader Replicator 2X spモード ThinkPad Tips Torch 9800 Xperia Z10 キリングッズ キーボード スタンディングデスク ナノブロック ベンチマーク 増設・換装 絵文字 自炊 雑貨

月別アーカイブ

最近書いた記事

書いてる人

masaWebデザイナーの端くれ。珍しそうなモノを見つけたらついうっかり買ってしまう。