2012年によく読まれた記事や様々なランキング

今年書いた記事のアクセスランキング

ということでまずはこちら。

1. 配色、デザイン、文章、写真、センスがないとあきらめる前に勉強しよう！

はてなブックマークのトップページに2日ほど掲載されたこともありかなりのアクセスがありました。結局はまとめ記事なのですがタイトルに共感された方が多かったようです。

2. スマートフォンサイト作成の参考になるギャラリーサイトのまとめ

個人的に作る機会があったので、勉強しながらこちらの記事も書いてみました。勉強しながらということでかなり時間がかかりました。

3. ページタブアプリ(iframe)の作成とFacebookページへの追加方法

以前同じような記事を書いたのですが、Facebookの仕様がコロコロ変わり内容が古くなっていたので作り変えました。この記事ももう古くなっているかも。。

4. リストに1pxのラインを追加するだけで、印象がぐっとよくなる

色の違うラインの重ねることで見た目がシャープになります。ということを順を追って解説しています。

5. CSS3を使うにあたって知っておきたいIE対策のまとめ

CSS3を使うにあたって避けて通れないIE対策。諦めるというのが1番の対策かなと思いつつ、CSSのIE対策としてできることをまとめています。

6. CSS3の勉強になるかも！？画像を使わないボタンの作成手順

CSS3を使えば画像のようなボタンが作れますよという記事ですが、順を追って説明しているのでプロパティひとつひとつの効果が分かりやすいと思います。

7. 細部にこだわってみた！CSS3を使った美しい横メニューの作り方

先ほどはボタンでしたが、今度メニューです。こちらも順を追って説明していますのでお勉強にぜひ。

8. 私がウェブサイト作成時にお世話になっているサイトをご紹介

私が普段使っているサイトを紹介しています。この手の記事ははてブが付きやすいですね。感謝です。

9. スマートフォンサイト作成の参考になるギャラリーサイトのまとめ

スマートフォンサイトを作成する際に勉強させていただいたギャラリーサイトを紹介しています。

10.スクロール時の動きがおもしろい！パララックス効果を使ったサイト

パララックス効果を使ったサイトは作ったことはないですが、見ていて面白いので集めてみました。

とういうことで今年書いた記事でアクセスが多かったものを紹介しました。見逃した記事がある方はこれを機会にぜひご覧ください。

全記事を対象にしたアクセスランキング

続いては全記事を対象にしたランキングです。

• 意外と知らない!?CSSセレクタ20個のおさらい
• 配色、デザイン、文章、写真、センスがないとあきらめる前に勉強しよう！（2012）
• CSSの知識をもっと深める30+2の小技テクニック集
• スマートフォンサイト作成の参考になるギャラリーサイトのまとめ（2012）
• iFrameによるFacebookページ作成法と6つのポイント
• ロイヤリティフリーなフリーフォト、無料写真素材サイトのまとめ
• JavaScriptによる画像切り替え
• ページタブアプリ(iframe)の作成とFacebookページへの追加方法（2012）
• Nivo Slider - jQueryを利用した画像のスライドショー
• リストに1pxのラインを追加するだけで、印象がぐっとよくなる（2012）

2012年に書いた記事は4つだけです。なんか悲しいですね。

ところで、2012年に書いた記事ははてなブックマーク、Twitter、Facebookなどのソーシャル系のサイトからのアクセスが多く、それ以前に書いた記事では検索エンジンからのアクセスが多いという傾向があります。

検索エンジンからのアクセスは持続性がありますので2012年1位だった意外と知らない!?CSSセレクタ20個のおさらいは、2013年も上位にくると思います。私のようにあまり記事を書けない（書かない！？）人が安定したアクセスを得るには、検索エンジンからのアクセスも大事にしないといけないのかなと感じました。

ユーザー属性ランキング

参考になるかどうか分かりませんが、ここからはユーザーの属性についてのランキングです。

まずはOSです。Macは健闘していますが、さすがにWindowsの方が多いです。

• Windows (75.05%)
• Mac (21.72%)

続いてブラウザです。Chrome、Firefoxが上位にきていますが、一般的にはやっぱりIEは根強いと思います。

• Chrome (37.99%)
• Firefox (28.10%)
• Internet Explorer (20.61%)
• Safari (9.77%)
• Opera (1.80%)

次は、画面の解像度です。サイトの横幅をどれくらいにするかの参考にしています。私は1920x1080を使っていて結構大きいと思っていたのですが1位でした。皆さん大きなのを使っているんですね。一般的にはこのサイズが1位にくることはないのかなと。

• 1920x1080 (22.60%)
• 1280x1024 (14.47%)
• 1366x768 (11.11%)
• 1280x800 (8.80%)
• 1680x1050 (8.30%)
• 1920x1200 (7.93%)
• 1440x900 (6.69%)
• 1024x768 (3.74%)
• 2560x1440 (3.31%)
• 1600x900 (2.98%)

検索ワードランキング

最後は検索ワードです。最近はすっかりCSSに関する記事が多いのですが検索ワードにはあまり入っていません。もう少しタイトルの付け方を考えないといけないかも。

• css セレクタ
• javascript 画像切り替え
• facebook iframe
• jquery スライドショー
• nivo slider
• iframe
• ie6 シェア
• javascript 画像 切り替え
• css3
• cssセレクタ
• フリーフォト
• 無料写真素材
• css3 セレクタ
• デザイン 勉強
• javascript スライドショー
• webpark
• ロイヤリティフリー 写真
• サイト作成
• facebookページ iframe
• フリー素材 写真

ということで2012年のランキングを紹介しました。すべてGoogle Analyticsで調べています。

それでは2013年もどうぞよろしくお願いいたします。