ブログ型からサイト型へ ― トップページ改造の記録
ここ１ヶ月かけて、私のブログ型トップページを「サイト型トップページ」へと大きく変えていくプロジェクトを進めてきました。その経緯を少し振り返ってみます。
１）カルーセルで動きをプラス
まず最初に取り入れたのが、Cocoonの機能であるカルーセル。ページを開いた瞬間に動きが出て、訪問者の目を引いてくれます。
２）背景固定のアピールエリア
次に、背景を固定したアピールエリアを設置。視覚的に印象が残りやすくなり、サイト全体の雰囲気がグッと引き締まりました。
３）スライドショーの導入
さらに、Smart Slider 3を使ってスライドショーを追加。動きと情報のバランスがとれて、ページにリズムが生まれました。
４）PC版ヘッダーの調整
Cocoonの機能でヘッダーを固定し、メニュー幅をテキストに合わせてスッキリ見せるようにしました。これでナビゲーションの見やすさが向上。
５）モバイル版ヘッダーとフッター
モバイルでもヘッダーを固定し、キャッチフレーズをフッターにも表示。スマホで見ても読みやすく、サイトの一体感が出ました。
こうして５つの工夫を積み重ねたことで、ようやく「サイト型トップページ」の土台が完成した気がします。これからはこの基盤をもとに、さらにオシャレで機能的なデザインへと進化させていく予定です。
スキンの色を変えるだけで、ここまで変わる！
今回まず取り組んだのは「既存スキンの色合いだけを変える」アプローチでした。
以前も「スキンをちょこっと変更して印象刷新」に挑戦したことがあります。そのときはグリーンオレンジ（薄緑）からブルーコーラル（青水）に変えてみたのですが、正直なところ、罫線ノートの色合いは気づかないレベル。そこで仕方なく、カテゴリーラベルの色を調整した…という経緯がありました。
でも、同じ車でもボディカラーが変わるだけで、イメージがガラリと変わることってありますよね。ここ数年は特に、街を走るグレーの車が渋くてカッコよく見えるのが印象的です。
そこで思い切って、「手書きノート」スキンのカラーをブルーコーラルから「ダークスカイ」に変更してみました。
すると――印象が大きく変わりました！同じスキンなのに、色合いがダークになっただけで、全体の見栄えが一気に引き締まってスタイリッシュに。まさに“色の魔法”を実感しました。
