ブログをフラットデザイン?っぽくリニューアルしました

フラットデザインとはちょっと違うか……うかです、こんにちわ。

これまでのデザインにちょいと飽きが出まして、昨年の10月くらいからリニューアル作業に取り掛かっていたんですが、今日、ようやくデザインを刷新することができました。

うかブログVer13.0

フラットデザインを目指した……んだが

実は、新しいWordPressテーマは、6月くらいに完成してました。が、いざテーマを切り替えようという段になって、「今って、フラットデザインだよな?」と思い直し、イチから作りなおした結果、さらに1ヶ月を要してしまったと。(なので、Ver12は陽の目を見ることなくお蔵入りw)

で、フラットデザインの特徴である「グラデーションなし」「角丸なし」「大きなアイコン」というのを取り入れてはみたんですが……確かにフラットではあるものの、これってフラットデザインに入るんかな?と思っちゃうのが正直なところ。

Windows8に代表されるフラットデザインって、もっとカラフルですよね。えぇ、私もカラフルにしようとは思ったんですよ。思ったんですけど、あまりにカラフルなデザインではすぐに飽きてしまうな、と。

その結果モノトーン、しかもかなり薄いモノトーンに落ち着きました。

画像は使ってません

とまぁ、デザイン自体は「フラットデザイン的なもの」になってしまったんですが、もうひとつ、フラットデザインの特徴を取り入れてます。

それが、「画像の使用なし」という点。

グローバルナビやらサイドバーやらでいくつかのアイコンを使ってるんですが、これは画像ではなく全てWebフォント。絵文字なんですねー。

ここ↑からダウンロードしてきたやつなんですが、いかにもフラットデザインで使われてそうなアイコンを、Webフォントとして使用することができます。無料。ありがたや。

画像を使うCSS Spriteと比べてどっちが表示時間が短いの?というのは分かってないんですが、特にストレスも感じないし、まぁいいんじゃないかなと。

サイドバーのコンテンツを一定の位置で止めてみた

で、フラットデザインとは関係ないんですが、「スクロールしていくとサイドバーのコンテンツがページ上部で止まる」ってやつ、最近よく目にしません?

Facebookのサイドバーに用いられてたりするんですが、これをウチのブログにも取り入れてみました。

この記事のように長文になると、サイドバーのコンテンツが足りなくてスカスカになっちゃうんですが、上部で止めればそのスペースを有効に使うことができるわけで、いやー、これはいいですね。設置方法も簡単だし。

新しいものを実験的に取り入れる

……ということで、今回のリニューアルはこんな感じ。

ウチのリニューアルは、その時その時に私が興味を持った新しい手法を、実験的に取り入れるというのが毎度のパターンなんですが、それが今回は「フラットデザイン」と「ストップするサイドバーコンテンツ」でした。

実験できると別のサイトを作るときに活かせたりするので、いやはや、都合のいいブログを持ったなぁと我ながら思っております。はい。